In this post, I would like to show you data populating in select 2 dropdown based on x event and it will get data from the remote server using Http protocol, the same technique you can apply for dependent dropdowns to show data based on the selection. Populate Select2 with AJAX data example In the… Continue reading Populate Select2 with AJAX data based on X event
Category: JQuery
Better way of using jquery’s Append
We use append() method for adding elements dynamically into an already existing element. If you miss use this function, it will dramatically affects the performance of your page. In this post, I will share a quick performance tip and will show correct way of using jQuery.append(). jQuery.append() inserts content at the end of the each… Continue reading Better way of using jquery’s Append
Get selected Text and Value of DropDownList using jQuery
This tutorial illustrates about getting selected Text and Value of HTML Select DropDownList on Button click using jQuery. The following HTML Markup consists of an HTML Select DropDownList and a Button.
|
1 2 3 4 5 6 7 8 9 10 |
// dropdown markup <select id="myselect"> <option value="1">Mr</option> <option value="2">Mrs</option> <option value="3">Ms</option> <option value="4">Dr</option> <option value="5">Prof</option> </select> // button <input type="button" id = "getDataButton" value="Get Selected Text and Value" /> |
Now add jQuery to footer of the page.
|
1 |
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> |
Final and import step, let’s bind click event handler to the button and read… Continue reading Get selected Text and Value of DropDownList using jQuery
Scroll to top JQuery
When you have web page too long, it is recommended to provide your users easy navigation mechanism.You we can provide it in many ways like fixed navigation at top and left or right navigation panels..etc. Here I am gonna show you quick trick called “Scroll to top”. Basically by using this, user can easily reach… Continue reading Scroll to top JQuery
Abort A Previous Ajax Request In jQuery
When using Ajax there will be changes ,where you will need to cancel the Ajax call. I found Aborting is useful while building a search as you type feature and I would abort the previous search and request a new Ajax search each time they typed a new letter. Since their old word has changed… Continue reading Abort A Previous Ajax Request In jQuery
JQuery Foreach Example
Foreach provides easy way to iterate over the arrays, objects. Foreach is the most important control structure in any language. So i am going to write a simple comprehensive tutorial on JQuery’s $.each() function.I would like to show you example on how to loop through an array ,object,JSON and DOM elements. jQuery.each() syntax jQuery.each( array,… Continue reading JQuery Foreach Example
How to check / uncheck all check boxes using jQuery?
You may have noticed select/deselect all functionality on websites like gmail.com, outlook.com or even in the wordpress admin dashboard basically which allows you to select all emails or posts on the page with single click. Which can be convenient to have check / uncheck multiple checkboxes with single click especially if the list is vast.… Continue reading How to check / uncheck all check boxes using jQuery?
jQuery Copy To Clipboard
ZeroClipboard is a library that provides you with a way of coping text to your clipboard using Adobe flash and a Javascript interface. Flash can access your computers clipboard because you have to install flash and agree to the security settings, therefore we have to use flash to access the clipboard. We can use Javascript… Continue reading jQuery Copy To Clipboard
JQuery Ajax form submit Example
Sending Ajax requests to server with JQuery library is pretty easy. We just need to include JQuery in your page after that we can use JQuery’s ajax API methods in the page. Deprecation Notice: The jqXHR.success(), jqXHR.error(), and jqXHR.complete() callbacks are deprecated as of jQuery 1.8. To prepare your code for their eventual removal, use… Continue reading JQuery Ajax form submit Example
Check if Object is empty in Javascript
To check if an object is empty in JQuery we use jQuery.isEmptyObject( object ) with will return true on success , false on failure. Ex :
|
1 2 |
jQuery.isEmptyObject({}); // true jQuery.isEmptyObject({ foo: "bar" }); // false |
To check if an object is empty or not using Javascript we use Object.getOwnPropertyNames() .The Object.getOwnPropertyNames() method returns an array of all properties (enumerable or not) found directly… Continue reading Check if Object is empty in Javascript