Skip to main content

Jquery Image Validation

1 ) jQuery validator method

jQuery.validator.addMethod('img_ext',function(value,element){
        if(value=="")
        {
            return true;
        }
        //alert(element.files[0].size);
        var ext_index=value.lastIndexOf('.');
        var ext=value.substring(ext_index+1);
        var ext_lcase=ext.toLowerCase();
        if(ext_lcase=='jpeg' || ext_lcase=='jpg' || ext_lcase=='png' || ext_lcase=='gif')
        {
            return true;
        } else {
            return false;
        } }, "Please select valid image file" );

Html

<input name="logo_image1" type="file"  class="required img_ext" id="logo">

2)  $('#addAlbum').validate({
            ignoreTitle: true,
                rules: {
                        "image":
                        {
                            required: true,
                            accept: 'jpg|png|gif|jpeg'
                        },
 messages: {
                    "image":
                     {
                        required: 'This field is required.',
                        accept: 'Please upload valid file formats'
                     }
   });

Html 

 <input type="file" onchange="document.getElementById('file_fake').value = this.value.replace(/.*?[\/\\]([^\/\\]+)$/, '$1')"
                             class="file_select imgupload" name="image"  id="attachImg1"/>

3) validating size and type

$('#attachImg').change(function(){
                var input = document.getElementById("attachImg"),formdata = false;               
                if (window.FormData) {
                    formdata = new FormData();
                }   
                file = input.files[0];       
                formdata.append("upload", file);
               
                var t=$(this);
               
                if (formdata) {
                    $.ajax({
                        url:ajax_url+"Members/ajax_image_validation/700/700",
                        type: "POST",
                        data: formdata,
                        processData: false,
                        contentType: false,
                        cache:false,
                        success: function (resp) {
                                    if(resp!='ok')
                                    {
                                        alert(resp);
                                        $("#file_fake1").val('');
                                            $("#attachImg").attr('value','');
                                       
                                    }
                                                                  
                                   
                        }
                    });
                }
        });
Html
<input type="file" onchange="document.getElementById('file_fake').value = this.value.replace(/.*?[\/\\]([^\/\\]+)$/, '$1')"
                             class="file_select imgupload" name="image"  id="attachImg1"/>

In method: 
    function ajax_image_validation($x,$y){
   
        if(is_uploaded_file($_FILES['upload']['tmp_name']))
        {
            $imgName = pathinfo($_FILES['upload']['name']);          
            $ext = strtolower($imgName['extension']);
            if($ext=='tiff' || $ext=='jpeg' || $ext=='png' || $ext=='jpg')
            {
                list($width,$height)= getimagesize($_FILES["upload"]["tmp_name"]);
                if($width >= $x && $height >= $y)
                {
                    echo "ok";  
                }else{
                    echo "Image dimensions should be (".$x." x ".$y.") or greater";
                }
            }else{
                echo "Invalid file format";
            }
        }
        die;
    }

Comments

Popular posts from this blog

Generate XML file in Cakephp

Steps to Generate XML file using CakePHP: Step-1 Enable to parse xml extension in config route.php file.     Router::parseExtensions('xml'); Step-2 Add Request Handler Component to the Controller    var $components = array(‘RequestHandler’); Step-3 Add controller Action For XML Generation in Post Controller     function generateXMLFile()     {         if ($this->RequestHandler->isXml()) { // check request type             $this->layout = 'empty'; // create an empty layout in app/views/layouts/empty.ctp              }        }  Add header code in empty layout <?php header('Content-type: text/xml');?> <?php echo $this->Xml->header(); ?> <?php echo $content_for_layout; ?> Step-4 Set up View To generate XML Create xml folder inside Posts vi...

How To Create Shortcodes In WordPress

We can create own shortcode by using its predified hooks add_shortcode( 'hello-world', 'techsudhir_hello_world_shortcode' ); 1. Write the Shortcode Function Write a function with a unique name, which will execute the code you’d like the shortcode to trigger: function techsudhir_hello_world_shortcode() {    return 'Hello world!'; } Example: [hello-world] If we were to use this function normally, it would return Hello world! as a string 2. Shortcode function with parameters function techsudhir_hello_world_shortcode( $atts ) {    $a = shortcode_atts( array(       'name' => 'world'    ), $atts );    return 'Hello ' . $a['name'] . !'; } Example: [hello-world name="Sudhir"] You can also call shortcode function in PHP using do_shortcode function Example: do_shortcode('[hello-world]');

How to replace plain URLs with links

Here we will explain how to replace Urls with links from string Using PHP $string ='Rajiv Uttamchandani is an astrophysicist, human rights activist, and entrepreneur. Academy, a nonprofit organization dedicated to providing a robust technology-centered education program for refugee and displaced youth around the world.  CNN Interview - https://www.youtube.com/watch?v=EtTwGke6Jtg   CNN Interview - https://www.youtube.com/watch?v=g7pRTAppsCc&feature=youtu.be'; $string = preg_replace('@(https?://([-\w\.]+)+(:\d+)?(/([\w/_\.%-=#]*(\?\S+)?)?)?)@', '<a href="$1">$1</a>', $string); Using Javascript <script> function linkify(inputText) {     var replacedText, replacePattern1, replacePattern2, replacePattern3;     //URLs starting with http://, https://, or ftp://     replacePattern1 = /(\b(https?|ftp):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/gim;     replacedText = inputT...