CODEWITHSUNDEEP
javascriptjqueryruby-on-rails
Sandip Karanjekar
Sandip Karanjekar

Reputation: 850

Show or hide form element

I have one html form - On that one text field like

<input type = "text" name = "age" value = "" id = "txt_age">

On the value of age i have to show this element like -

<select name = "married">
  <option value = "Yes">Yes</option>
  <option value ="No">No</option>
</select>

If age>18 then married field will be shown to form otherwise hide it.This age>18 condition is stored in database.As value of age changes married field toggle(show/hide). How can i do it with javascript/jquery.Please suggest.

For more information, all these fields are genereated dynamically.So i was thinking to add onchange = "somefuction(condition);" with age while creating then look for field are to be shown when condition is satisfied, is also in DB.

OR

One solution may i think that -
The field in this case married will look for value of age changes.Then accordingly married will hide/show itself.But problem is that how married observe age field or call javascript function.
Sorry for not explaining full problem.

Upvotes: 0

Views: 807

Answers (2)

just.another.programmer
just.another.programmer

Reputation: 8785

add id="married" to the select and use something like this.

$("#txt_age").blur(function() {
    if(parseInt($(this).val() > 18) {
        $("#married").show();
    } else {
        $("#married").hide();
    }
});

Upvotes: 1

Tats_innit
Tats_innit

Reputation: 34107

Try this & note

  • avoid the space between id = "txt_age"

rest this should help:

var $foo = $('select[name="married"]');
$foo.hide(); // in start always hide

$('#txt_age').on('blur', function() {
   if(parseInt(this.value)>18){
       $foo.hide();
   } else {
       $foo.show();
   }

});

Upvotes: 0

Related Questions