How to read value of a textbox in jQuery

If you want to read the text from an input box like this in jQuery, you can follow one of the following approaches : 1. Using val() function Here is the syntax : var str = $('#txt_name').val(); Example : <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script   src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> <script>   $(document).ready(function() {     $("button").click(function() { […]

Manage multiple Ajax requests using jQuery when() method

With jQuery, we can use $.ajax() or the shorthand $.get() to make ajax calls. When we have multiple such calls, we can nest them using jQuery callbacks as follows :     // First ajax call     $.get(url1, function (response1) {         // On suceess of First         // Second ajax call         $.get(url2, function (response2) {             // Both successful             // […]

Inserting content into page in jQuery

We can use following jQuery methods to insert content into page : before() after() prepend() prependTo() append() appendTo()   The following diagram explains where the new content is inserted in each of these methods.   jQuery before() method   This method inserts content before selected elements. HTML <p id="oldpara"> Old Paragraph </p> <button>insert new parapraph</button> […]

Updating element content in jQuery

We can use following jQuery methods to update content of elements in jQuery selection. text() html() replaceWith remove()   .text() This method can be used to update the text content of the matching elements. Any markup data will be shown as text. HTML <p>This is a paragraph</p> <button>Click me</button> jQuery $(document).ready(function(){     $("button").click(function(){         $("p").text("Paraghaph contents updated"); […]

Getting Element Content in jQuery

jQuery .html() and .text() methods can be used to retrieve content of elements.   jQuery text() method   text() method returns the content from every element in the jQuery selection including any descendents. Lets see the result of using .text() on the following HTML:   HTML Code <div> <p> First paragraph</p> </div> <div> <p> Second […]