Skip to main content

Posts

Showing posts from 2012

Html5/JavaScript: Client side image preview before uploading on server

Every time user upload an image or a file, we have to validate it and display preview to user before actually it on server. Now it is possible to read file and its properties on client side (before uploading on server) using HTML5 and JavaScript. Let’s assume we have an uploader control on page having id=imguploader . <input type="file" id="imguploader" name="image" accept="image/*"> Here’s a function I‘ve created that validate the image uploded by user & display the image preview. $('#imguploader').bind('change', function() { var file = this.files[0]; //we can retrive the file array. // alert(file.type); if you want to check image type, uncomment this line. // alert(file.size); if you want to check the image size, uncomment this line. var reader = new FileReader(); // file.target.result holds the DataURL which // can be used as a source of the image: //imgpreview is the id of...

JavaScript: Validate email address

Sometime we need to validate email address entered by user on client side, Here i have written a very simple but useful javascript regex to validate email address. function validate(email) { var reg = /^([A-Za-z0-9_\-\.]{2,})+\@([A-Za-z0-9_\-\.]{2,})+\.([A-Za-z]{2,4})$/; if(reg.test(email) == false) return true; else return false; }

JavaScript functions to get browser name & version

Common javascript functions to get browser name & version, I post here primarily for my own benefit as I always forget the syntax each time I need it. Get Browser Name function getBrowser() { var userAgent = navigator.userAgent.toLowerCase(); if (/webkit/.test( userAgent )) { return "safari"; } if (/opera/.test( userAgent )) { return "opera"; } if (/msie/.test( userAgent ) && !/opera/.test( userAgent )) { return "msie"; } if (/mozilla/.test( userAgent ) && !/(compatible|webkit)/.test( userAgent )) { return "mozilla"; } }; Get Browser Version function getBrowserVersion() { var userAgent = navigator.userAgent.toLowerCase(); return (userAgent.match( /.+(?:rv|it|ra|ie)[\/: ]([\d.]+)/ ) || [])[1]; }; Get Browser Type function(){ var isIE11 = function(){ var userAgent = navigator.userAgent.toLowerCase(); return (!$.browser.msie) && (userAgent.indexOf("trident") > 0); }; ...