{"id":5883,"date":"2024-12-13T09:18:39","date_gmt":"2024-12-13T09:18:39","guid":{"rendered":"https:\/\/ubiq.co\/tech-blog\/?p=5883"},"modified":"2025-09-03T05:50:10","modified_gmt":"2025-09-03T05:50:10","slug":"how-to-disable-enable-input-in-jquery","status":"publish","type":"post","link":"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/","title":{"rendered":"How to Disable\/Enable Input in jQuery"},"content":{"rendered":"\n<p>Web developers need to work with many form inputs while building websites and applications. So they need to be able to enable or disable HTML form inputs on their web pages, depending on different use cases. There are several ways to disable\/enable form inputs. You can do this using plain JavaScript or third-party libraries like jQuery. In this article, we will learn how to disable\/enable input in jQuery as well as using JavaScript. We will also learn how to disable\/enable inputs whether it is just one element or multiple elements.<\/p>\n\n\n\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_82_2 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/#How_to_DisableEnable_Input_in_jQuery\" >How to Disable\/Enable Input in jQuery<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/#1_Using_prop_function\" >1. Using prop() function<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/#2_Using_attr_function\" >2. Using attr() function<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/#3_Using_removeAttr\" >3. Using removeAttr()<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/#4_Using_disabled_property\" >4. Using disabled property<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/#5_For_multiple_elements\" >5. For multiple elements<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/#6_Creating_JS_Prototype_functions\" >6. Creating JS Prototype functions<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/#7_Using_Plain_JavaScript\" >7. Using Plain JavaScript<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/#8_Toggle_DisableEnable_States\" >8. Toggle Disable\/Enable States<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/#Conclusion\" >Conclusion<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/#FAQ\" >FAQ<\/a><\/li><\/ul><\/nav><\/div>\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"How_to_DisableEnable_Input_in_jQuery\"><\/span>How to Disable\/Enable Input in jQuery<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Every HTML form input has an attribute called &#8216;disabled&#8217;. If it is set to true or is even present without any value, the input will be disabled. If it is set to false, or is absent from the input then it will be enabled.<\/p>\n\n\n\n<p>Let us say you have the following HTML input.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">&lt;input id='my_input' class='my_class' name='my_name'\/&gt;<\/pre>\n\n\n\n<p>The above input is enabled since it does not have disabled attribute. Please note, all the following inputs are disabled, even where disabled attribute is set to false.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">&lt;input id='my_input' class='my_class' name='my_name' <strong>disabled<\/strong>\/&gt;<br>&lt;input id='my_input' class='my_class' name='my_name' <strong>disabled=false<\/strong>\/&gt;<br>&lt;input id='my_input' class='my_class' name='my_name' <strong>disabled='false<\/strong>'\/&gt;<br>&lt;input id='my_input' class='my_class' name='my_name' <strong>disabled=true<\/strong>\/&gt;<br>&lt;input id='my_input' class='my_class' name='my_name' <strong>disabled='true'<\/strong>\/&gt;<\/pre>\n\n\n\n<p>Now let us look at different ways to disable\/enable input in jQuery.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"1_Using_prop_function\"><\/span>1. Using prop() function<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>In jQuery 1.6+, you can use prop() function to disable\/enable inputs. It allows you to set\/reset any property of any HTML element.<\/p>\n\n\n\n<p>You can disable input by setting disabled property to true.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">$('#my_input').prop('disabled',true);<\/pre>\n\n\n\n<p>In fact, you can set the disabled property to any string value, to disable it.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">$('#my_input').prop('disabled','true');<br>$('#my_input').prop('disabled','false');<br>$('#my_input').prop('disabled','disabled');<br>$('#my_input').prop('disabled','abc');<\/pre>\n\n\n\n<p>On the other hand, you can enable input by setting disabled property to false.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">$('#my_input').prop('disabled',false);<\/pre>\n\n\n\n<p>You can also enable it by setting disabled property to empty string &#8221;.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">$('#my_input').prop('disabled','');<\/pre>\n\n\n\n<p>You can even call these functions inside an event handler. Let us say you also have a button on the same web page.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">&lt;button id='my_button'&gt;click me&lt;\/button&gt;<\/pre>\n\n\n\n<p>Here is a click handler for the button that disables our HTML input above.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">$('#my_button').click(function(e){<br>  $('#my_input').prop('disabled',false);<br>});<\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"2_Using_attr_function\"><\/span>2. Using attr() function<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>For jQuery 1.5 and below, prop() function is not available. In such cases, use attr() function. It has same syntax as prop() function. Here is the code to disable an input.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">$('#my_input').attr('disabled',true);<\/pre>\n\n\n\n<p>In fact, like prop(), you can set the disabled property to any string value, to disable it.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">$('#my_input').prop('disabled','true');<br>$('#my_input').prop('disabled','false');<br>$('#my_input').prop('disabled','disabled');<br>$('#my_input').prop('disabled','abc');<\/pre>\n\n\n\n<p>You can enable HTML input by setting disabled property to false.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">$('#my_input').prop('disabled',false);<\/pre>\n\n\n\n<p>However, you cannot enable it by setting disabled property to empty string &#8221;. The following code will not work.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">$('#my_input').prop('disabled','');<\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"3_Using_removeAttr\"><\/span>3. Using removeAttr()<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>jQuery also provides a removeAttr() function to remove an attribute from HTML element. You can use this to enable an input by removing its disabled property.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">$('#my_input').removeAttr('disabled');<\/pre>\n\n\n\n<p>However, you can only use this to disable an input.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"4_Using_disabled_property\"><\/span>4. Using disabled property<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>If you are already referencing the input element in a function or event handler, then you can disable it by settings it disabled DOM property and <em>this<\/em> keyword.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">this.disabled=true<\/pre>\n\n\n\n<p>Similarly, you can enable it by setting this property to false.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">this.disabled=false<\/pre>\n\n\n\n<p>Here is an example to disable all inputs with class=my_class.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">$('.my_class').each(function(e){<br>  this.disabled=true;<br>});<\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"5_For_multiple_elements\"><\/span>5. For multiple elements<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>So far, we have only seen examples to disable\/enable single HTML input. But you can also use prop() and attr() functions to disable multiple elements at one go.<\/p>\n\n\n\n<p>Here is an example to disable all inputs with class=my_class using prop() and attr() functions.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">$('.my_class').prop('disabled',true);<br>$('.my_class').attr('disabled',true);<\/pre>\n\n\n\n<p>On the other hand, here is how to enable them.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">$('.my_class').prop('disabled',false);<br>$('.my_class').attr('disabled',false);<\/pre>\n\n\n\n<p>Similarly, you can disable multiple elements by simply changing the jQuery selector. Depending on whether the CSS selector returns one or more elements, prop() and attr() functions will automatically update their properties. Here is an example to disable and enable inputs with name=my_name.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">\/\/ disable elements<br>$('input[name=my_name]').prop('disabled',true);<br>$('input[name=my_name]').attr('disabled',true);<br><br>\/\/ enable elements<br>$('input[name=my_name]').prop('disabled',false);<br>$('input[name=my_name]').attr('disabled',false);<\/pre>\n\n\n\n<p>If your jQuery selector returns multiple elements, you can always use array index to precisely select the appropriate item. When a jQuery selector returns multiple items, they are indexed starting with 0, 1, 2, &#8230; Here is the code to disable\/enable only the second input with class=my_class, using index=1.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">\/\/ disable input<br>$('.my_class')<strong>[1]<\/strong>.prop('disabled',true);<br>$('.my_class')<strong>[1]<\/strong>.attr('disabled',true);<br><br>\/\/enable input<br>$('.my_class')<strong>[1]<\/strong>.prop('disabled',false);<br>$('.my_class')<strong>[1]<\/strong>.attr('disabled',false);<\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"6_Creating_JS_Prototype_functions\"><\/span>6. Creating JS Prototype functions<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>If you need to disable\/enable many input elements across your website, you can simply create a prototype function for this purpose, save it in a JS file and include it on your web pages. They provide a very concise way to do these things. Here are couple of functions to illustrate it.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">$.prototype.enable = function () {<br>    $.each(this, function (index, el) {<br>        $(el).prop('disabled',false);<br>    });<br>}<br><br>$.prototype.disable = function () {<br>    $.each(this, function (index, el) {<br>        $(el).prop('disabled', true);<br>    });<br>}<\/pre>\n\n\n\n<p>In the above code, we have used prop() function. If you are using jQuery &lt;=1.6 then you can use attr() function instead.<\/p>\n\n\n\n<p>Once you have defined the prototype function as shown above, you can easily call them on any element. Here is how you can enable the input element using prototype functions.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">$('#my_input').enable();<\/pre>\n\n\n\n<p>Here is how you can disable the input element.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">$('#my_input').disable();<\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"7_Using_Plain_JavaScript\"><\/span>7. Using Plain JavaScript<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>If you do not have jQuery on your website, or do not want to use it, then you can also disable\/enable input elements using plain JavaScript. In this case, we will need to use getElementById() function to first select the input. Then we need to call setAttribute() function to set its disabled attribute. Here is the code to disable HTML input.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">document.getElementById('my_input').setAttribute('disabled','disabled');<\/pre>\n\n\n\n<p>If you want to enable the input, you will need to call removeAttribute() function.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">document.getElementById('my_input').setAttribute('disabled');<\/pre>\n\n\n\n<p>As you can see, JavaScript code is much longer than jQuery. Also, in jQuery, you can select single element or multiple elements, just by changing the CSS selector in prop() or attr() functions. In JavaScript, you will need to use getElementById() function to select item using its ID attribute, getElementsByClassName() to select item by its class name, and so on. This means you need to use different functions depending on your selector. This can be tedious. In jQuery, prop() and attr() functions automatically handle single as well as multiple items. Nevertheless, if you simply cannot use jQuery on your web pages, then you can go for plain JavaScript approach.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"8_Toggle_DisableEnable_States\"><\/span>8. Toggle Disable\/Enable States<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Sometimes, you may want to just toggle an input element based on the click of a button. In such cases, you can use the prop() or attr() function to invert the present value of disabled attribute.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">$(\"#my_input\").prop('disabled', !$(\"#my_input\").prop('disabled') );<br>$(\"#my_input\").attr('disabled', !$(\"#my_input\").attr('disabled') );<\/pre>\n\n\n\n<p>You can place this code, inside the click handler of a button to toggle the input based on button click.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">&lt;button id='my_button'&gt;Toggle Input&lt;\/button&gt;<br><br>$('#my_button').click(function(e){<br>  $(\"#my_input\").prop('disabled', !$(\"#my_input\").prop('disabled') );<br>});<\/pre>\n\n\n\n<p><strong>Important Note<\/strong><\/p>\n\n\n\n<p>Please do not use removeProp() function to remove disabled property. It will completely remove this property for good. Thereafter, you will never be able to add back this property to the said input. In other words, if you enable the input by removing its disabled property using removeProp() function, you will not be able to disable it again later.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Conclusion\"><\/span>Conclusion<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>In this article, we have learnt how to disable and enable HTML input for elements. We have covered many different use cases such as disabling\/enabling single element, multiple elements, in event handlers and so on. We have also learnt how to disable\/enable HTML inputs using plain JavaScript. You can use any of them as per your requirement. In fact, you can also use them to add\/remove checked property of checkboxes and radio buttons. Depending on your jQuery version, it is recommended to use prop() or attr() function. They are very easy to use, and automatically handle single as well as multiple inputs.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"FAQ\"><\/span>FAQ<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p><strong>1. Can we use either of prop() or attr() function to disable\/enable input?<\/strong><\/p>\n\n\n\n<p>If you use jQuery 1.6+, you can use prop() function, else you can use attr() function.<\/p>\n\n\n\n<p><strong>2. Can we use these methods on all inputs?<\/strong><\/p>\n\n\n\n<p>Yes. You can use these solutions on all HTML inputs, across all web browsers.<\/p>\n\n\n\n<p>Also read:<\/p>\n\n\n\n<p><a href=\"https:\/\/ubiq.co\/tech-blog\/does-python-have-ternary-operator\/\">Does Python Have Ternary Operator?<\/a><br><a href=\"https:\/\/ubiq.co\/tech-blog\/how-to-change-elements-class-with-javascript\/\">How to Change Element&#8217;s Class in JavaScript<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Web developers need to enable &#038; disable inputs on their web pages. Here is how to disable\/enable input in jQuery.<\/p>\n","protected":false},"author":1,"featured_media":5910,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[350],"tags":[351,352],"class_list":["post-5883","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-jquery","tag-disable-input","tag-enable-input"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>How to Disable\/Enable Input in jQuery - Ubiq BI<\/title>\n<meta name=\"description\" content=\"Web developers need to enable &amp; disable inputs on their web pages. Here is how to disable\/enable input in jQuery.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Disable\/Enable Input in jQuery - Ubiq BI\" \/>\n<meta property=\"og:description\" content=\"Web developers need to enable &amp; disable inputs on their web pages. Here is how to disable\/enable input in jQuery.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/\" \/>\n<meta property=\"og:site_name\" content=\"Ubiq BI\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/ubiqbi\" \/>\n<meta property=\"article:published_time\" content=\"2024-12-13T09:18:39+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-09-03T05:50:10+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/ubiq.co\/tech-blog\/wp-content\/uploads\/2024\/12\/disable-enable-input-jquery.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"256\" \/>\n\t<meta property=\"og:image:height\" content=\"171\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Sreeram Sreenivasan\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@UbiqBI\" \/>\n<meta name=\"twitter:site\" content=\"@UbiqBI\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Sreeram Sreenivasan\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-disable-enable-input-in-jquery\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-disable-enable-input-in-jquery\\\/\"},\"author\":{\"name\":\"Sreeram Sreenivasan\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/#\\\/schema\\\/person\\\/db98d49a766a3a111d8510935ab90abc\"},\"headline\":\"How to Disable\\\/Enable Input in jQuery\",\"datePublished\":\"2024-12-13T09:18:39+00:00\",\"dateModified\":\"2025-09-03T05:50:10+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-disable-enable-input-in-jquery\\\/\"},\"wordCount\":1238,\"commentCount\":0,\"image\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-disable-enable-input-in-jquery\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i0.wp.com\\\/ubiq.co\\\/tech-blog\\\/wp-content\\\/uploads\\\/2024\\\/12\\\/disable-enable-input-jquery.jpg?fit=256%2C171&ssl=1\",\"keywords\":[\"disable input\",\"enable input\"],\"articleSection\":[\"jQuery\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-disable-enable-input-in-jquery\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-disable-enable-input-in-jquery\\\/\",\"url\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-disable-enable-input-in-jquery\\\/\",\"name\":\"How to Disable\\\/Enable Input in jQuery - Ubiq BI\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-disable-enable-input-in-jquery\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-disable-enable-input-in-jquery\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i0.wp.com\\\/ubiq.co\\\/tech-blog\\\/wp-content\\\/uploads\\\/2024\\\/12\\\/disable-enable-input-jquery.jpg?fit=256%2C171&ssl=1\",\"datePublished\":\"2024-12-13T09:18:39+00:00\",\"dateModified\":\"2025-09-03T05:50:10+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/#\\\/schema\\\/person\\\/db98d49a766a3a111d8510935ab90abc\"},\"description\":\"Web developers need to enable & disable inputs on their web pages. Here is how to disable\\\/enable input in jQuery.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-disable-enable-input-in-jquery\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-disable-enable-input-in-jquery\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-disable-enable-input-in-jquery\\\/#primaryimage\",\"url\":\"https:\\\/\\\/i0.wp.com\\\/ubiq.co\\\/tech-blog\\\/wp-content\\\/uploads\\\/2024\\\/12\\\/disable-enable-input-jquery.jpg?fit=256%2C171&ssl=1\",\"contentUrl\":\"https:\\\/\\\/i0.wp.com\\\/ubiq.co\\\/tech-blog\\\/wp-content\\\/uploads\\\/2024\\\/12\\\/disable-enable-input-jquery.jpg?fit=256%2C171&ssl=1\",\"width\":256,\"height\":171,\"caption\":\"disable enable input in jquery\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-disable-enable-input-in-jquery\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to Disable\\\/Enable Input in jQuery\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/#website\",\"url\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/\",\"name\":\"Ubiq BI\",\"description\":\"Build dashboards &amp; reports in minutes\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/#\\\/schema\\\/person\\\/db98d49a766a3a111d8510935ab90abc\",\"name\":\"Sreeram Sreenivasan\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4b3127ed2d4bb8efb3fa0bbb52cf2efd4d0156c97fc05a503537c883e8279947?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4b3127ed2d4bb8efb3fa0bbb52cf2efd4d0156c97fc05a503537c883e8279947?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4b3127ed2d4bb8efb3fa0bbb52cf2efd4d0156c97fc05a503537c883e8279947?s=96&d=mm&r=g\",\"caption\":\"Sreeram Sreenivasan\"},\"description\":\"Sreeram Sreenivasan is the Founder of Ubiq. He has helped many Fortune 500 companies in the areas of BI &amp; software development.\",\"sameAs\":[\"https:\\\/\\\/www.linkedin.com\\\/in\\\/sreeram-sreenivasan\\\/\"],\"url\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/author\\\/wordpress\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to Disable\/Enable Input in jQuery - Ubiq BI","description":"Web developers need to enable & disable inputs on their web pages. Here is how to disable\/enable input in jQuery.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/","og_locale":"en_US","og_type":"article","og_title":"How to Disable\/Enable Input in jQuery - Ubiq BI","og_description":"Web developers need to enable & disable inputs on their web pages. Here is how to disable\/enable input in jQuery.","og_url":"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/","og_site_name":"Ubiq BI","article_publisher":"https:\/\/www.facebook.com\/ubiqbi","article_published_time":"2024-12-13T09:18:39+00:00","article_modified_time":"2025-09-03T05:50:10+00:00","og_image":[{"width":256,"height":171,"url":"https:\/\/ubiq.co\/tech-blog\/wp-content\/uploads\/2024\/12\/disable-enable-input-jquery.jpg","type":"image\/jpeg"}],"author":"Sreeram Sreenivasan","twitter_card":"summary_large_image","twitter_creator":"@UbiqBI","twitter_site":"@UbiqBI","twitter_misc":{"Written by":"Sreeram Sreenivasan","Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/#article","isPartOf":{"@id":"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/"},"author":{"name":"Sreeram Sreenivasan","@id":"https:\/\/ubiq.co\/tech-blog\/#\/schema\/person\/db98d49a766a3a111d8510935ab90abc"},"headline":"How to Disable\/Enable Input in jQuery","datePublished":"2024-12-13T09:18:39+00:00","dateModified":"2025-09-03T05:50:10+00:00","mainEntityOfPage":{"@id":"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/"},"wordCount":1238,"commentCount":0,"image":{"@id":"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/#primaryimage"},"thumbnailUrl":"https:\/\/i0.wp.com\/ubiq.co\/tech-blog\/wp-content\/uploads\/2024\/12\/disable-enable-input-jquery.jpg?fit=256%2C171&ssl=1","keywords":["disable input","enable input"],"articleSection":["jQuery"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/","url":"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/","name":"How to Disable\/Enable Input in jQuery - Ubiq BI","isPartOf":{"@id":"https:\/\/ubiq.co\/tech-blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/#primaryimage"},"image":{"@id":"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/#primaryimage"},"thumbnailUrl":"https:\/\/i0.wp.com\/ubiq.co\/tech-blog\/wp-content\/uploads\/2024\/12\/disable-enable-input-jquery.jpg?fit=256%2C171&ssl=1","datePublished":"2024-12-13T09:18:39+00:00","dateModified":"2025-09-03T05:50:10+00:00","author":{"@id":"https:\/\/ubiq.co\/tech-blog\/#\/schema\/person\/db98d49a766a3a111d8510935ab90abc"},"description":"Web developers need to enable & disable inputs on their web pages. Here is how to disable\/enable input in jQuery.","breadcrumb":{"@id":"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/#primaryimage","url":"https:\/\/i0.wp.com\/ubiq.co\/tech-blog\/wp-content\/uploads\/2024\/12\/disable-enable-input-jquery.jpg?fit=256%2C171&ssl=1","contentUrl":"https:\/\/i0.wp.com\/ubiq.co\/tech-blog\/wp-content\/uploads\/2024\/12\/disable-enable-input-jquery.jpg?fit=256%2C171&ssl=1","width":256,"height":171,"caption":"disable enable input in jquery"},{"@type":"BreadcrumbList","@id":"https:\/\/ubiq.co\/tech-blog\/how-to-disable-enable-input-in-jquery\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/ubiq.co\/tech-blog\/"},{"@type":"ListItem","position":2,"name":"How to Disable\/Enable Input in jQuery"}]},{"@type":"WebSite","@id":"https:\/\/ubiq.co\/tech-blog\/#website","url":"https:\/\/ubiq.co\/tech-blog\/","name":"Ubiq BI","description":"Build dashboards &amp; reports in minutes","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/ubiq.co\/tech-blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/ubiq.co\/tech-blog\/#\/schema\/person\/db98d49a766a3a111d8510935ab90abc","name":"Sreeram Sreenivasan","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/4b3127ed2d4bb8efb3fa0bbb52cf2efd4d0156c97fc05a503537c883e8279947?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/4b3127ed2d4bb8efb3fa0bbb52cf2efd4d0156c97fc05a503537c883e8279947?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/4b3127ed2d4bb8efb3fa0bbb52cf2efd4d0156c97fc05a503537c883e8279947?s=96&d=mm&r=g","caption":"Sreeram Sreenivasan"},"description":"Sreeram Sreenivasan is the Founder of Ubiq. He has helped many Fortune 500 companies in the areas of BI &amp; software development.","sameAs":["https:\/\/www.linkedin.com\/in\/sreeram-sreenivasan\/"],"url":"https:\/\/ubiq.co\/tech-blog\/author\/wordpress\/"}]}},"jetpack_featured_media_url":"https:\/\/i0.wp.com\/ubiq.co\/tech-blog\/wp-content\/uploads\/2024\/12\/disable-enable-input-jquery.jpg?fit=256%2C171&ssl=1","jetpack_shortlink":"https:\/\/wp.me\/pbGGTT-1wT","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/posts\/5883","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/comments?post=5883"}],"version-history":[{"count":38,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/posts\/5883\/revisions"}],"predecessor-version":[{"id":9450,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/posts\/5883\/revisions\/9450"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/media\/5910"}],"wp:attachment":[{"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/media?parent=5883"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/categories?post=5883"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/tags?post=5883"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}