Category : jQuery


Jquery select2 ajax autocomplete example with demo in PHP

Jquery select2 plugin is a very famous jquery plugin, using select2 plugin we can do several thing like select box with search, select option with check box, ajax auto-complete etc. We normally require to do autocomplete task with select box when we have large amount of data like products, items, category, tag, user etc. so we can't load all then data at time and it's hard to find that item from several records. So select2 plugin provides us with select box with search and Ajax dynamically auto complete that way page will never load more and it will work fine. In this example, I have two fil.....

By Hardik Savani | August 5, 2016 | | 61270 Viewer | Category : jQuery
READ MORE

Laravel 5 Ajax CRUD with Pagination example and demo from scratch

In this tutorials, I going to give you how to create jquery Ajax CRUD(Create, Read, Update and Delete) in your laravel 5 application. I write just few step to follow you can make simple crud application with jquery pagination in your laravel 5 project. In this example i used several jquery Plugin for fire Ajax, Ajax pagination, Bootstrap, Bootstrap Validation, notification as listed bellow. <strong>Jquery</strong> <strong>Bootstrap</strong> <strong>twbsPagination js</strong> <strong>Validator JS(<a href="http://itsolutionstuff.com/post/bootstrap-form-validation-example-with-demo-using-validat.....

By Hardik Savani | August 2, 2016 | | 111445 Viewer | Category : jQuery
READ MORE

Jquery Select2 - Select box with search example code

We always like to choose good plugin for search option in select box. In this example i added select2.js, that provide select box with search option. If you use select2.js, you don't require to add bootstrap js or css. It provides it's own js and css code. I give you full example of select box with search option. After run this example you will find bellow preview. <strong>Preview:</strong> <img src="/upload/select2-search-option.png" style="width:100%;border:1px solid red" /> <strong>Example:</strong> <pre class="prettyprint lang-html"> <html lang="en"> <br/> <head> <br/> .....

By Hardik Savani | July 29, 2016 | | 10161 Viewer | Category : jQuery
READ MORE

How to get current url path example in Jquery?

Sometimes we need to get current URL in jquery file, we can get current URL or path of our current page in javascript using "window.location". In this post i give you three way to get current url in your js file as there are bellow listed: <strong>1.window.location.href</strong> <strong>2.$(location).attr("href")</strong> <strong>3.window.location</strong> Ok, so you can check bellow example code and run in your system. <strong>Example:</strong> <pre class="prettyprint lang-html"> <html lang="en"> <br/> <head> <title>JQuery - get current URL Example</title> &l.....

By Hardik Savani | July 27, 2016 | | 1474 Viewer | Category : jQuery
READ MORE

Bootstrap SweetAlert - Confirm dialog box model with yes and no option example

When we deal with delete task then we always require to ask with model dialog and yes or no for conformation with message. So, if you have bootstrap then you can use simply SweetAlert plugin. Bootstrap SweetAlert plugin provide alert box, confirm dialog box and prompt box. In this example i use bootstrap js and css and SweetAlert plugin js and css. It is very simple and it gives us better layout that way we don't need to do for design. So let's see demo and get demo code. <strong>Example:</strong> <pre class="prettyprint lang-html"> <html lang="en"> <br/> <head> <title>.....

By Hardik Savani | July 26, 2016 | | 4392 Viewer | Category : jQuery
READ MORE

Bootstrap form validation example with demo using validator.js plugin

We always need to add validation on form like registration form, contact form, login form etc. we always prefer to give validation error after page refresh but you can give validation without page refresh. If you use bootstrap then you can use easily validator.js plugin. validator.js plugin gives client side validation without page refresh. We can use simply. validator.js plugin we can add validation in our PHP project, or any framework like laravel framework, codeigniter framework, symphony framework etc. In this example i give you how can you give validation for require field, email, minle.....

By Hardik Savani | July 20, 2016 | | 49373 Viewer | Category : jQuery
READ MORE

Jquery tooltip example code with demo using Jquery UI

Jquery UI is a lots of collection of GUI widgets like datepicker, tab, timepicker, colorpicker etc. Jquery UI also provide tooltip GUI widget that way we can set text and display when hover on specific element. Jquery UI tooltip through we can set information about element like if we set delete button but when user will mouseover then display text like "You can remove from here". So in this simple html example through you understand how to set tooltip using jquery ui. <strong>Example:</strong> <pre class="prettyprint lang-html"> <html lang="en"> <head> <br/> <title>Jque.....

By Hardik Savani | July 19, 2016 | | 1547 Viewer | Category : jQuery
READ MORE

Twitter bootstrap - fancy alert box example and demo using SweetAlert Plugin

We always require to give alert box when something success, warning, info etc. we always use alert() of jquery function, If you used twitter bootstrap then you can use SweetAlert Plugin with fancy alert. SweetAlert Plugin provide a different types of animated alert like for info, primary, success, warning or error. So, you can use anyone as you require. SweetAlert Plugin gives one function swal() with several arguments like title, text, type, showCancelButton etc options so you can make customize alert. In this post i give all types of alert like success, warning, error, info and primary that.....

By Hardik Savani | July 18, 2016 | | 1249 Viewer | Category : jQuery
READ MORE

Jquery - Show hide password in Password textbox using checkbox.

In this post we can implement how to add hide show password when user input password at register time or login time. We sometimes require to do it because that use can determine password is right or wrong. In this example i use just jquery change event on checkbox, if check then user can see his entered password and change anything, so you can see preview and also check demo with code. <strong>Preview:</strong> <img src="/upload/jquery-show-password.png" style="width:100%;border:1px solid red" /> <strong>Example:</strong> <pre class="prettyprint lang-html"> <html lang="en"> <head&g.....

By Hardik Savani | July 11, 2016 | | 1740 Viewer | Category : jQuery
READ MORE

Jquery - Display a loading gif image before a image loads using Eager ImageLoader plugin

Eager ImageLoader plugs give us lazy loading before image loads, in this example you can load your gif image that you want before main image load. In this example i use eager-image-loader plugin. As you can see bellow preview that before image load. so first you have to give path of gif image "./upload/loading.gif" instead of your gif image path. If you want to get this image then you can get from demo. <strong>Preview:</strong> <img src="/upload/image-upload.png" style="width:100%;border:2px solid red" /> <strong>Example:</strong> <pre class="prettyprint lang-html"> <html lang="en">.....

By Hardik Savani | July 8, 2016 | | 2423 Viewer | Category : jQuery
READ MORE

    Jquery Select2 - Select box with search example code

    Jquery Select2 - Select box with search example code

    Open Post

    Twitter Bootstrap - Digital Clock picker with AM PM example using clockface plugin

    Twitter Bootstrap - Digital Clock picker with AM PM example using clockface plugin

    Open Post

    PHP - How to Convert file(image, audio, video) extension using CloudConvert API?

    PHP - How to Convert file(image, audio, video) extension using CloudConvert API?

    Open Post

    Laravel 5 Ajax CRUD with Pagination example and demo from scratch

    Laravel 5 Ajax CRUD with Pagination example and demo from scratch

    Open Post

    Laravel 5.3 - import export csv and excel file into database

    Laravel 5.3 - import export csv and excel file into database

    Open Post

    AngularJS - How to render HTML value in ng-repeat ?

    AngularJS - How to render HTML value in ng-repeat ?

    Open Post