Category : Javascript


How to check file size when select multiple file validation using Jquery?

Sometimes we require to add validation of max file size using jquery, If we have only single file for validation then we can do it easily that, but if we have multiple file then you have to calculate size of all selected files and then check max required file size. So, in this example you can see how to check validation for max size in multiple file select using jquery. <strong>Example:</strong> <pre class="prettyprint lang-html"> <html lang="en"> <head> <title>Jquery - multiple image upload with size validation</title> <script src="http://ajax.googleapis.co.....

By Hardik Savani | June 15, 2016 | | 5908 Viewer | Category : Javascript
READ MORE

HTML tags are not allowed in textbox validation using Jquery

I have two example that prevent HTML tags are not allowed in textbox using focusout event of jquery. You can chose any if you think it is best for me. In the first example i use regular expression for prevent html tags in my textarea and in second example i user directly check with html tags. So you can check both and use <strong>Example 1:</strong> <pre class="prettyprint lang-html"> <html lang="en"> <head> <title>Jquery - HTML Tag are not allowed in textarea</title> <script type="text/javascript" src="//cdn.jsdelivr.net/jquery/1/jquery.min.js"></scrip.....

By Hardik Savani | June 12, 2016 | | 4361 Viewer | Category : Javascript
READ MORE

Ckeditor required field validation example in Jquery

we can add required field validation easily using jquery if we have textbox, textarea, select box etc, but if we used ckeditor then it's not simple. In this example i give you how to add Ckeditor required field validation in javascript. we can do it using CKEDITOR.instances, so if you also require then you can use it. <strong>Example:</strong> <pre class="prettyprint lang-html"> <html lang="en"> <head> <title>Jquery - ckeditor required field validation</title> <script type="text/javascript" src="//cdn.jsdelivr.net/jquery/1/jquery.min.js"></script> .....

By Hardik Savani | June 11, 2016 | | 7179 Viewer | Category : Javascript
READ MORE

Jquery notification popup box example using toastr JS plugin with demo

We always need to use notification in our project, because for example if user add new record and we need to display notification with success alert, when comes error then display error notication. So if you use jquery notification popup then it's better that way it's layout looks like good. In this example i use toastr.js plugin that provide several notification type like warning, success, info, error etc and several function. toastr Jquery plugin you can use easily with bootstrap and very customize. You can run bellow example and you can see how it works and pretty good. <strong>Example:</.....

By Hardik Savani | June 10, 2016 | | 27679 Viewer | Category : Javascript
READ MORE

How to get ip address in jquery?

you can get ip address in jquery using getJSON(). If you need to get ip address in your js file you can get easily. In this example you can see how to get ip address in jquery. So let's try with this... <strong>Example</strong> <pre class="prettyprint lang-php"> <html lang="en"> <head> <title>Jquery - get ip address</title> <script type="text/javascript" src="//cdn.jsdelivr.net/jquery/1/jquery.min.js"></script> </head> <body> <br/> <h1>Your Ip Address : <span class="ip"></span></h1> <br/> <script type="text/java.....

By Hardik Savani | June 8, 2016 | | 2657 Viewer | Category : Javascript
READ MORE

Jquery highlight search text in div using highlight JS with example

If you want to highlight search text in your page using jquery then you have to choose highlight JS Jquery plugin. highlight JS Plugin is very simple to use and more simple. In this example i give you example using highlight JS. So, you can also check preview you can see after run bellow example. <strong>Preview:</strong> <img width="100%" style="border:1px solid black" src="/upload/Jquery-highlight-search.png"> In this example you have to just copy code and paste in your index.html file and run that file. After run this file you will found like above preview. <strong>index.html</strong> <pre.....

By Hardik Savani | June 4, 2016 | | 3151 Viewer | Category : Javascript
READ MORE

Bootstrap daterangepicker example code with demo using daterangepicker.js

Sometimes, we may require to use daterangepicker in our php project or laravel project etc, then you can use date range picker easily using daterangepicker.js plugin. In this post i give you full example from scratch and also give you demo that way you can check how it's looks like. So just copy bellow code and run in your local system. <img src="/upload/daterangedemo.png" width="100%" class="img-responsive" /> <strong>Example:</strong> <pre class="prettyprint lang-html"> <html lang="en"> <head> <title>Jquery - Bootstrap Daterangepicker Example</title> <scri.....

By Hardik Savani | May 28, 2016 | | 18140 Viewer | Category : Javascript
READ MORE

Jquery - input tags plugin example using jquery.tagsinput.js plugin

If you require to add multiple tags from input then you can do it using XOXCO plugin. In this example you can do it quickly. jquery tagsinput will help to add multiple tags with good layout. After run bellow example you will found like preview. In this example i use cdn js path that way you don't require to download any js from internet. So you have to just copy this file and run in your sytem. it will words. <strong>Preview:</strong> <img class="img-responsive" style="border:2px solid" src="/upload/Jquery-input-tags-plugin.png"> <strong>Example:</strong> <pre class="prettyprint lang-html"> .....

By Hardik Savani | May 25, 2016 | | 4605 Viewer | Category : Javascript
READ MORE

How to remove all whitespace from string in JQuery?

Sometimes we require to remove white space from given string. So at that time you can delete spaces from string using replace() of core php. replace() will help to replace your blank space or empty space or extra space or trailing space from string that way we can remove. you can do it from bellow example. <strong>Example:</strong> <pre class="prettyprint lang-html"> <html lang="en"> <head> <title>Jquery - Remove white space from string</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script> </head> <bod.....

By Hardik Savani | May 24, 2016 | | 3347 Viewer | Category : Javascript
READ MORE

Display preview selected image in input type file using JQuery

Sometimes we need to show preview of image before image upload. I mean when user will select new image from input="file" then it will display preview of image. In this example you can see before upload it will display preview using jquery. <strong>Example:</strong> <pre class="prettyprint lang-html"> <html lang="en"> <head> <title>Change image on select new image from file input</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script> </head> <body> <br/> <input type="file" name="file" id="profile-im.....

By Hardik Savani | May 16, 2016 | | 24231 Viewer | Category : Javascript
READ MORE

    Bootstrap form validation example with demo using validator.js plugin

    Bootstrap form validation example with demo using validator.js plugin

    Open Post

    How to implement lazy loading image with example for your website?

    How to implement lazy loading image with example for your website?

    Open Post

    AngularJS - convert comma separated string to array example

    AngularJS - convert comma separated string to array example

    Open Post

    Codeigniter JQuery Ajax image upload example from scratch

    Codeigniter JQuery Ajax image upload example from scratch

    Open Post

    How to call AngularJS controller function in Jquery?

    How to call AngularJS controller function in Jquery?

    Open Post

    Laravel 5 - user prevent common passwords using laravel-password package

    Laravel 5 - user prevent common passwords using laravel-password package

    Open Post