Problem in input value and my jquery code

Question

Im using this code for my inputs:

$(document).ready(function(){
$('.add-news').each( function () {
    $(this).val($(this).attr('defaultValue'));
    $(this).css({'color':'#686868' ,  'font-size':'11px', 'font-weight':'bold'});
});
$('.add-news').focus(function(){
    if ( $(this).val() == $(this).attr('defaultValue') ){
        $(this).val('');
        $(this).css({'color':'#686868' , 'font-size':'11px' ,'font-weight':'bold'});
    }
});
$('.add-news').blur(function(){
    if ($(this).val() == '' ){
        $(this).val($(this).attr('defaultValue'));
        $(this).css({'color':'#686868' ,  'font-size':'11px', 'font-weight':'bold'});
    }
});

});

But in post, It posts 'defaultValue' not $_POST['name']. How can I avoid this? Thanks in advance

Are you missing code somewhere? I don't see the section dealing with any posting. — Incognito
– Incognito, Commented Sep 30, 2010 at 13:21
Off-topic: Each time you call $(this) in your various iterator and event handler functions, you're calling a series of functions and doing a couple of memory allocations. Sure, modern computers are fast, but let's throw 'em a bone, eh? :-) Consider doing one var $this = $(this); at the top of each of those functions and then using $this throughout, like this. FWIW. — T.J. Crowder
– T.J. Crowder, Commented Sep 30, 2010 at 13:26

Nick Craver · Accepted Answer · 2010-09-30 13:25:44Z

3

You could filter out all those entries when posting the form, for example:

$("form").submit(function() {
  $(".add-news").val(function(i, v) {
    return v == $(this).attr("defaultvalue") ? "" : v
  });
});

This would clear out all those boxes with the default value just before submitting.

answered Sep 30, 2010 at 13:25

Nick Craver

631k138 gold badges1.3k silver badges1.2k bronze badges

Sign up to request clarification or add additional context in comments.

Comments

T.J. Crowder · Accepted Answer · 2010-09-30 13:33:19Z

Your fields have the default value if the user isn't in the field, so naturally when you post the form, that's what will get posted. How 'bout something like this:

Style:

.showingDefault {
    color:       #686868;
    font-size:   11px;
    font-weight: bold;
}

JavaScript:

$(document).ready(function(){
    $('.add-news').each( function () {
        var $this = $(this);
        $this.val($this.attr('defaultValue'));
        $this.addClass('showingDefault');
    });
    $('.add-news').focus(function(){
        var $this = $(this);
        if ( $this.val() == $this.attr('defaultValue') ){
            $this.val('');
            $this.removeClass('showingDefault');
        }
    });
    $('.add-news').blur(function(){
        var $this = $(this);
        if ($this.val() == '' ){
            $this.val($this.attr('defaultValue'));
            $this.addClass('showingDefault');
        }
    });

    // Hook up a submit handler on the form
    $(your_form_selector_here).submit(function() {
        $('.add-news.showingDefault').val('');
    });
});

That submit handler at the end wipes out the values on any elements with the class flagging that they're showing the default value.

(There I've also done the off-topic thing I mentioned in my comment on the question; if you don't want that, just remove the vars and do a search-and-replace changing $this to $(this).)

Collectives™ on Stack Overflow

Problem in input value and my jquery code

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related