Disable And Enable Input Elements In A Div Block Using jQuery

Developer
Victor Yan
Size
2,033 Kb
Views
12,144
  1. Disable And Enable Input Elements In A Div Block Using jQuery Previews
  2. Disable And Enable Input Elements In A Div Block Using jQuery HTML Codes
  3. Disable And Enable Input Elements In A Div Block Using jQuery JS Codes

How do I make an disable and enable input elements in a div block using jquery?

What is a disable and enable input elements in a div block using jquery? How do you make a disable and enable input elements in a div block using jquery? This script and codes were developed by Victor Yan on 05 January 2023, Thursday.

Disable And Enable Input Elements In A Div Block Using jQuery Previews
IQ Test

Disable And Enable Input Elements In A Div Block Using jQuery - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Disable And Enable Input Elements In A Div Block Using jQuery</title> <link rel='stylesheet prefetch' href='https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css'>
</head>
<body> <div class='container'> <h2>Disable And Enable Input Elements In A Div Block Using jQuery</h2> <form id="pageForm"> <p> When you click the below checkbox, all the input elements in the div are disabled, if they are enabled and vice versa. </p> <p> Click to change: <input id="toggleElement" type="checkbox" name="toggle" onchange="toggleStatus()" /> </p> <div id="elementsToOperateOn"> This is our example div block. <br /> Sample Text Box: <input type="text" name="name" /> <br /> Sample Checkbox : <input type="checkbox" name="participate" /> <br/> Sample Radio : <input type="radio" name="bookEarly" /> <br /> Sample Select: <select name="sampleSelect"> <option>Option 1</option> <option>Option 2</option> </select> </div>
</form> <div style="margin-top: 20px;">Sponsored by <a onclick="window.open('https://www.solargalore.com.au')">Solar Galore</a></div>
</div> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Disable And Enable Input Elements In A Div Block Using jQuery - Script Codes JS Codes

$(document).ready(function() { handleStatusChanged();
});
function handleStatusChanged() { $('#toggleElement').on('change', function () { toggleStatus(); });
}
function toggleStatus() { if ($('#toggleElement').is(':checked')) { $('#elementsToOperateOn :input').attr('disabled', true); } else { $('#elementsToOperateOn :input').removeAttr('disabled'); }
}
Disable And Enable Input Elements In A Div Block Using jQuery - Script Codes
Disable And Enable Input Elements In A Div Block Using jQuery - Script Codes
Home Page Home
Developer Victor Yan
Username tipsoftheday
Uploaded January 05, 2023
Rating 3
Size 2,033 Kb
Views 12,144
Do you need developer help for Disable And Enable Input Elements In A Div Block Using jQuery?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Victor Yan (tipsoftheday) Script Codes
Name
HTML 5 Session Storage Example
A Pen by Victor Yan
Detect Enter Key Pressed Using jQuery event
Sample AngularJS app using controller
Using Javascript to calculate age
Bootstrap 3 button groups
Tooltip using jQuery UI
HTML 5 Canvas Example
Create inline help tips for your site with a bit of CSS
Testing for a Value in JavaScript Array
Create amazing sales emails with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!