Skip to main content

Posts

Showing posts with the label JQuery

How to Refresh/Reload a Page frequently or periodically

We can automatically webpage refresh/ reload with two ways. one of them is using HTML Meta Tag and another is Javascript. in this tutorial you can learn both technique. Using Meta Tag <!DOCTYPE html> <html class= "k-ff k-ff43" > <head> <meta http-equiv= "refresh" content= "10" /> </head> <body> <div class= "refressData" style= "border: 2px dotted red; margin-top:40px;" id= "refressData" > </div> <script> $( document ).ready( function () { var dateTime = 'Date: ' + new Date ().getDate() + '/' + new Date ().getMonth() + '/' + new Date ().getFullYear() + '/' + ' Time: ' + new Date ().getHours() + ": " + new Date ().getMinutes() + ':' + new Date ().getSeconds(); $( "#refressData" ).append(dateTime); }) </script> </h...

How to display simple jquery loader/spinner using ajax?

Showing loading image indicator when ajax calling and also loading display off when ajax get response. <!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> <script> $(document).ready(function(){     $(document).ajaxStart(function(){         $("#divLoadingd").css("display", "block");     });     $(document).ajaxComplete(function(){         $("#divLoadingd").css("display", "none");     });     $("button").click(function(){         $("#txt").load("demo_ajax_load.asp");     }); }); </script> </head> <body> <div id="txt"><h2>Let AJAX change this text</h2></div> <button>Ajax Call</button> <div id="divLoadingd" style="display:none;width:69px;height:89px;bord...

Display Image Immediately from fileUpload Control

Client Side Programming is more efficient for user to very first interection Like Jquery . Now i provide some jquery script to display Image from FileUpload Control directly.. For this purpose we use reference . <script src="../../../JS/JQueryAutocomplete/jquery-1.7.2.js" type="text/javascript"></script>. You just download from jquery.com. Now code below... <script language="javascript" type="text/javascript"> /* Write FileUpload Change event .. */ $('#FileUpload1').bind('change', function() {                                 displayImage(this);                    }); //-------------------------// function displayImage(input)             {        ...