CODEWITHSUNDEEP
javascriptjqueryjquery-selectors
Panama Jack
Panama Jack

Reputation: 24448

jQuery show submit button on input field click

I'm trying to have a comment input field that will show the submit button on a dynamically created form when you click on the input field. Similar to how facebook comments work. When you click on the input field the submit button appears and when you click off it disappears. All the comment input id's are comment_1 etc and the submit button id's are submit_1 etc.

I've tried this,

jQuery("#[id^='comment_']").live('click',function(event){ 
    if(jQuery("#[id^='comment_']").val() == ""){ 
        jQuery("#[id^='submit_']").hide(); 
    } 
    else { 
        jQuery("#[id^='submit_']").show(); 
    } 
});

And that won't work for some reason. Any suggestion or how it can be accomplished would be great.

Upvotes: 2

Views: 1165

Answers (2)

PetersenDidIt
PetersenDidIt

Reputation: 25620

jQuery("[id^='comment_']").live('focusin focusout',function(e){
    var commentText = "Write a comment...",
        id = this.id.replace('comment_',''),
        val = jQuery(this).val();   
    if (e.type == 'focusin'){
        val = (val == commentText) ? '' : val; 
        jQuery("#submit_"+id).show();
    } else if (e.type == 'focusout') {
        val = (val == '') ? commentText : val; 
        if( val == commentText){ 
            jQuery("#submit_"+id).hide(); 
        }
    }
    jQuery(this).val(val);
}).trigger('focusout');

Upvotes: 1

RoToRa
RoToRa

Reputation: 38400

You need to remove the # from the selectors. Also I think you don't want the click event, but focus and blur.

Upvotes: 2

Related Questions