Check Label Value Change

Now, I want to alert a message that please fill text-box, whenever there is change in value of error_msg Also, I want to check whether l

Solution 1:

I haven't yet been able to test this out, but assuming you're changing your label with JavaScript could you not manually fire change()

Eg

$("#error_msg").text("hello").change();

Solution 2:

You need to monitor Dom changes for label. Check out the easy to use jQuery plugin at http://james.padolsey.com/javascript/monitoring-dom-properties/

If you are trying to validate, i highly suggest using the validation plugin http://bassistance.de/jquery-plugins/jquery-plugin-validation/

Solution 3:

The jQuery change() method only works with certain elements and label is not one of them.

http://api.jquery.com/change/

The change event is sent to an element when its value changes. This event is limited to input elements, textarea boxes and select elements.

Solution 4:

The change event doesn't get triggered if you change an element's text/value through JavaScript - it only happens when the user changes something (say the text in an input, or the selected item in a select).

If you control the code that sets your label's text, you can write a custom function that both sets the text as well as runs your "event handler", and call this function whenever you want to change #error_msg's text:

function set_error_msg(txt)
{
    $('#error_msg').text(txt);
    if(txt)
    {
        //There's text in the label - show your alert...
    }
}

But if the change is coming from somewhere else (code outside of your control), you'll have to start up a loop that checks every XXX seconds to see if the text has changed - a process known as Busy Waiting, and generally considered a Bad Thing...

Hope this helps!

Solution 5:

I think, the query validate plugin will auto change the error label. Further i have following script for validation and error placement.

$('#account').validate({
    rules:{
            username: {required: true},
            password: {required: true},
            email: {required: true, email: true},
            fullname: {required: true}},
    messages: {
            username: "Category name is required",
            password: "Password is required",
            fullname: "Full Name is required",
            email: "Valid email is required"
        },      
    errorPlacement: function(error, element){
            $(element).each(function (){
            $(this).parent('td').find('p.error').html(error);
        });
}})     

And the html goes like this

<td><inputtype="text"name="username"value="<?phpecho$user['username']; ?>"size="40"/><pclass="error"></p></td>

Now if you are planning to ALERT error message, then

errorPlacement: function(error, element){
            var errors = newArray();
            $(element).each(function (){
            $(this).parent('td').find('p.error').html(error);
            errors.push(error);
        });
        alert(errors.join(" "));
    }