views:

10

answers:

0

I'm using the following script to do inline field labels, but I would like to have it also validate the fields before the user submits the form. I only have 3 fields in the form, Name, Email and File upload, can anyone please help me? If I use a separate validation script, it will not recognize the fields as being empty because this scripts adds a value to the fields.

this.label2value = function(){    

    // CSS class names
    // put any class name you want
    // define this in external css (example provided)
    var inactive = "inactive";
    var active = "active";
    var focused = "focused";

    // function
    $("label").each(function(){        
        obj = document.getElementById($(this).attr("for"));
        if(($(obj).attr("type") == "text") || (obj.tagName.toLowerCase() == "textarea")){            
            $(obj).addClass(inactive);            
            var text = $(this).text();
            $(this).css("display","none");            
            $(obj).val(text);
            $(obj).focus(function(){    
                $(this).addClass(focused);
                $(this).removeClass(inactive);
                $(this).removeClass(active);                                  
                if($(this).val() == text) $(this).val("");
            });    
            $(obj).blur(function(){    
                $(this).removeClass(focused);                                                     
                if($(this).val() == "") {
                    $(this).val(text);
                    $(this).addClass(inactive);
                } else {
                    $(this).addClass(active);        
                };                
            });                
        };    
    });        
};
// on load
$(document).ready(function(){    
    label2value();    
});