Enable or Disable Button Based On TextBox.Text Text Changes

Question

I am creating a web application for my company. My application has a button and a textbox.

What I want to do is entering some value into the textbox and then when i click the button the application will process the value based on the input in the textbox.

Now here is the tricky part.

After the button is clicked once and the text in textbox remains, the button shall disappear.

However if there is modification in the textbox.text, the button shall reappear.

But if the textbox.tex somehow return to original value, the button shall disappear again.

Please its quite urgent, I have tried my best to do it already, yet so far unsuccessful. I also did a lot of research in Google, but so far none of my findings suit my case.

Your help is appreciated.

Answer 1

You got it here http://jsfiddle.net/ywe9G/

var ori = '';
$(document).ready(function(){
    $('button').hide();
    $('input').keyup(function(){
        if($(this).val() != ori){
                $('button').show();
        }else{
            $('button').hide();
        }
    });
    $('button').click(function(){
        ori  = $('input').val();
        $(this).hide();
    });
});

Answer 2

    private string oldTextboxValue = "";
    private void textBox1_TextChanged(object sender, EventArgs e)
    {
        if (textBox1.Text != oldTextboxValue)
        {
            button1.Visible = true;
        }
        else
        {
            button1.Visible = false;
        }
    }

    private void button1_Click(object sender, EventArgs e)
    {
        oldTextboxValue = textBox1.Text;
        button1.Visible = false;
    }

Answer 3

to disable button you can do this-

var oldvalue="";
$('#buttonid').click(function(){
//your code
oldvalue = $("#textBox").text();
this.hide();
}

$("#textBoxId").keypress(function(){
if(this.value!=oldvalue){
this.show();
}
}

Answer 4

Demo here

HTML

<textarea id='mytext' rows='4' cols='20'></textarea>
<br>
<input type="button" id='my_button' value="click">
<input type="hidden" id="my_hidden">

jQuery

var clicked=false;
jQuery(document).ready(function() {
    $("#my_button").click(function(){
        $("#my_hidden").val($("#mytext").val());
        $(this).hide();
        clicked=true;
    });

    $("#mytext").keyup(function(){
       if(clicked==true && $(this).val()==$("#my_hidden").val()) {
           $("#my_button").hide();
       }else if(clicked==true){
           $("#my_button").show();
       }
    });

});

You can similarly enable/disable button instead of show/hide