Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
jQuery Articles
Page 28 of 42
Find the Sum of Radio button values jQuery?
Let’s say we have marks records and we need to sum them. The records are displayed in Radio Button −Marks1 75 { if (evnt.checked) { total = total + parseInt(evnt.value); return; } }); secondMark.forEach((evnt) => { if (evnt.checked) { total = total + parseInt(evnt.value); return; } }); ...
Read MoreChange input type value attribute in jQuery
Let’s say the following is our input type with value, “John Smith” −To change, use the attr() method −$('#changeTheName').attr('value', 'Please enter your name.......');You need to use the concept of attr(). Following is the code −Example Document $('#changeTheName').attr('value', 'Please enter your name.......'); To run the above program, save the file name “anyName.html(index.html)” and right click on the file. Select the option “Open with Live Server” in VS Code editor.OutputThis will produce the following output −
Read MoreHow to hide table rows containing zero value with jQuery?
Let’s say the following is our table with product quantity records − qty: qty: qty: qty: Let us now hide using the hide() method. Following is the code −Example Document qty: qty: qty: qty: $('.hideRowContainingZeroValue input').filter(function(){ return +this.value === 0; }).closest("tr").hide() To run the above program, save the file name “anyName.html(index.html)” and right click on the file. Select the option “Open with Live Server” in VS Code editor.OutputThis will produce the following output −
Read MoreFetch value from Alert pop up in jQuery
To fetch value from alert pop up, use alert(). At first, use prompt() to input the value from user. Following is the code −Example Document var value = prompt("Please enter an integer value"); var multiplyBy10=10*value; alert("Result after multiplying by 10 = "+ multiplyBy10); To run the above program, save the file name “anyName.html(index.html)” and right click on the file. Select the option “Open with Live Server” in VS Code editor −OutputThis will produce the following output −Put an integer value and click the OK button.After clicking the OK button, the snapshot is as follows −
Read MoreList View Search list on typing with filter like keyword search using jQuery?
Let’s the following is our input type, wherein the user will search −Now, use hide() and show() to display only relevant search and hide rest. For example, on typing “Ja”, related keywords like “Java” and “JavaScript” should be visible because it begins with “Ja”.Example Document Enter the keyword.. JavaScript John Smith Java David Miller -1) { $(this).show(); $(this).prev('.subjectName').last().show(); } else { $(this).hide(); ...
Read MoreHow to print div content using jQuery?
Let’s say we have the following button −On click of the above button, call the function() with on() −$('#buttonId').on('click', function () { displayTheData(); })The above function is using the html() to display the following div − I am inside the div tag... ExampleFollowing is the complete code to print div content − Document I am inside the div tag... I am not inside the div tag... $('#buttonId').on('click', function () { ...
Read MoreManipulate two selects on page load with jQuery
Let’s say the following is our first select − John David Bob Mike Sam Carol Following is our second select − David Mike Carol We need to remove the options in the first select, which are similar to options in the second select. For this, use val(). Following is the complete code −Example Document John David Bob Mike Sam Carol David Mike Carol $('#remaining_name > option').each(function (i, el) { var value = $(el).val(); $('#all_present_name > option[value="' + value + '"]').remove(); }); OutputThe output is as follows −
Read MoreHow to populate select list with jQuery?
To populate select list with jQuery, use for loop along with append() and append the options to the already created select.Let’s say we have the following select with options − John David ExampleFollowing is the code to append more number of options using append() − Document John David $(document).ready(function () { var data = [ { "name": "Bob", "customerName": "Bob" }, { "name": "Mike", "customerName": "Mike" } ]; for (var index = 0; index
Read MoreHow to enable the "disabled" attribute using jQuery on button click?
Set the disabled property to true in jQuery −ExampleFollowing is the code − Document $("#change").click(function (buttonEvent) { buttonEvent.preventDefault(); $('#showTxtBoxHide').prop("disabled", false); }); To run the above program, save the file name anyName.html(index.html). Right click on the file and select the option “Open with live server” in VS Code editor −OutputThe output is as follows −The text box property is disabled. To enable, you need to click the button −
Read MoreHow to Implicitly mimic click() in jQuery?
To implicitly mimic click(), you can call a function internally.ExampleFollowing is the code to implicitly mimic click − Document My Name is John Doe demo1Data = document.getElementById('demo1').innerHTML demo1Data = demo1Data.replace('My Name is John Doe', `My Favourite Subject is JavaScript..`) document.getElementById('demo2').innerHTML = demo1Data function replaceData() { document.getElementById('output').innerHTML = 'I live is US.'; } document.getElementById('demo2').querySelector('span').click(); To run the above program, save the file name anyName.html (index.html). Right click on the file and select the ...
Read More