Friday, 15 February 2013

jquery - How to show hide dynamic parse divs? -



jquery - How to show hide dynamic parse divs? -

i have form select menu values 1,2,3,4. when 3 selected 3 sub div's visible, 1 select 1 visible.

i created simple span div holds input fields per user

<span id="ticketuser1">....</span><span id="ticketuser2">....etc $('#numoftickets').change(function() { var num= $("#numoftickets").val(); (var i=0;i<num;i++){ if(i>num){ $('#ticketuser'+i).hide(); } else { $('#ticketuser'+i).show(); } } });

now 2 3 4 goes expected selecting lower number doesn't trick.

any tips?

the problem loop never getting hide status because hide status end condition.

$('#numoftickets').change(function() { var num= $("#numoftickets").val(); (var i=0;i<num;i++){ if(i>num){ $('#ticketuser'+i).hide(); } else { $('#ticketuser'+i).show(); } } });

you need have 2 loops , variable can either static or dynamic.

in simple illustration chose create static:

var maxuser = 5; $(function () { $('#numoftickets').change(function () { var num = parseint($(this).val())+1; (var = 1; < num; i++) { $('#ticketuser' + i).show(); } (var j = num ; j <= maxuser; j++){ $('#ticketuser' + j).hide(); } }); });

so if div less maxuser greater num, shown.

in sec loop hide on num.

num value +1 loop grab lastly item intend show.

here working fiddle if want variable dynamic , based on options available page loads, then here example. add together code load initializes maxuser variable in sec illustration , place in alter function if options dynamic.

jquery for-loop

No comments:

Post a Comment