function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
StarhunterStarhunter 

Enabling and disabling command button based on the number of characters typed in search box

I want the search button to be disabled on load of page. Only after the user has entered two characters should the search button be enabled to click. I want to achieve this using jquery,something I am not used to. I googled a bit and came to the following :
<script>
$(document).ready(function(){
              $("#btnDisabled").attr("disabled", true);
}

$('#searchbox').on("keyup", disableaction);

function disableaction() 
{ 
if($("#btnDisabled").val().length>1)
      $("#btnDisabled").attr("disabled", false);
}
</script>

Where searchbox is the id of the apex inputtext field and btnDisabled is that of the command button
The button is not even getting disabled on page load.
LakshmanLakshman

Demo - https://jsfiddle.net/lakshman_sfdc/j6azr9L1/1/ (https://jsfiddle.net/lakshman_sfdc/j6azr9L1/1/" target="_blank)
Assuming that your button id is btnDisabled and search box id is searchbox, the below script should work: 
$(document).ready(function(){
              $('[id$=btnDisabled]').prop("disabled", true);
              
});
$('[id$=searchbox]').keyup(function(){
    var thetext = $(this).val();
    
    if (thetext.length > 1) {
        $('[id$=btnDisabled]').prop("disabled", false);
    } else {
        $('[id$=btnDisabled]').prop("disabled", true);
    }
})

Please mark it as Best Answer if it helps you.