CODEWITHSUNDEEP
c#asp.net
user2347308
user2347308

Reputation: 39

Disabling a button if textbox is empty

I want to find out if I can create a real time event that would check for value of a textbox. What I mean is if the textbox is empty the button wouldnt be clickable. I am thinking is there anyway apart from validation to do this in code?

So far im stuck here:

if (YourName.Text = null)
{
       SubmitButton.Enabled = "False";
}

Where Yourname is the textbox and SubmitButton is the button :)

Upvotes: 3

Views: 27494

Answers (4)

Phil
Phil

Reputation: 3756

Here's an old school javascript approach. You could use jquery but if this is all you want to do that would be overkill. In the code below, the oninput event fires when text is changed either via the keyboard or mouse/tap (you need to capture all, this should do that for you). The javascript then gets the contents of the textbox, removes preceeding and trailing whitespace, and sets the disabled attribute on the submit button equal to the textbox being empty, qualified with .length == 0.

Note: if you do not want to disable for text that is only whitespace change submit.disabled = (tb.value.trim().length == 0); to submit.disabled = (tb.value.length == 0); which removes the call to the trim() method. The trim() method strips the preceeding and trailing whitespace.

This approach removes the need for a postback to enable or disable the submit button. 

<!doctype html>
<!-- tested in firefox -->
<html>
<head>
    <title>Demo</title>
    <script type="text/javascript">
        var enableInput = function() {
            var tb = document.getElementById("text_box");
            var submit = document.getElementById("submit");
            submit.disabled = (tb.value.trim().length == 0); 
        };
    </script>
</head>
<body>
    <form>
        <input type="text" id="text_box" name="test" oninput="enableInput();"></input><br/>
        <input id="submit" type="submit"></input>
    </form>
</body>
</html>

Upvotes: 1

Aniket Inge
Aniket Inge

Reputation: 25733

Well, start with the button disabled. Add TextChanged event to the textbox. And each time, check if the string is empty or not (use @dasblinkenlight's code in the TextChanged event handler.

Upvotes: 2

Paul Anderson
Paul Anderson

Reputation: 1180

SubmitButton.Enabled = YourName.Text.Length > 0;

Upvotes: 2

Sergey Kalinichenko
Sergey Kalinichenko

Reputation: 727137

System.String provides a pair of convenient functions called IsNullOrEmpty and IsNullOrWhiteSpace which you can use for testing for all kinds of strings that look empty to end users:

if (string.IsNullOrWhiteSpace(YourName.Text)) {
    SubmitButton.Enabled = false; // <<== No double-quotes around false
} else {
    // Don't forget to re-enable the button
    SubmitButton.Enabled = true;
}

This would disable the button even for string composed entirely of blank characters, which makes sense when you validate a name.

The above is identical to

SubmitButton.Enabled = !string.IsNullOrWhiteSpace(YourName.Text);

which shorter than a version with an if.

Upvotes: 10

Related Questions