I am using readymade modalbox which has three step process, in second step there is multiple checkboxes where user can choose two or more. Now I am confuse that how to pass this selected checkbox values to next step in modalbox.
<script>
$('input[name=sweater]').change(function() {
$('#area').val(
$('[name=sweater]:checked').map(function() {
return $(this).val();
}).get().join(',')
);
});
</script>
<!-----------------------------------------First Step------------------------------------------------>
<div id="dialog_content" class="dialog_content" style="display:none">
<div class="dialogModal_header">Dialog header 1</div>
<div class="dialogModal_content">
<?php
$query1="select * from `usersweater` where `Sweaterid`='$sweaterid'";
$result1=mysql_query($query1);
$row1=mysql_fetch_assoc($result1);
$sweaternikname=$row1['SNickname'];
//echo $sweaternikname;
?>
<div>
<ul class="sweaters">
<li>
<h4><?php echo $sweaternikname; ?></h4>
<img src="upload/<?php echo $opic; ?>" style="width:100px; height:100px;" >
</li>
</ul>
</div>
<input type="hidden" name="sweaterownerid" value="<?php echo $sownerid; ?>">
<input type="hidden" name="osweaterpic" value="<?php echo $opic; ?>">
<input type="hidden" name="osweaterid" value="<?php echo $sweaterid; ?>">
<h4>Are you sure you want to swap ? </h4>
<br><br>
</div>
<div class="dialogModal_footer">
<button type="button" class="btn btn-primary" data-dialogmodal-but="next">Yes</button>
<button type="button" class="btn btn-default"data-dialogmodal-but="cancel">Continue Looking</button>
</div>
</div>
<!-----------------------------------/first step over-------------------------->
<!-----------------------------------------Second Step------------------------------------------------>
<?php
$query1="select * from `usersweater` where `Sweaterid`='$sweaterid'";
$result1=mysql_query($query1);
$row1=mysql_fetch_assoc($result1);
$sweaternikname=$row1['SNickname'];
//echo $sweaternikname;
?>
<div id="dialog_content2" class="dialog_content" style="display:none">
<div class="dialogModal_header">Dialog header 2</div>
<div class="dialogModal_content" style="min-height:400px;">
<form action="" method="post">
<div>
<ul class="sweaters">
<li> <h4><?php echo $sweaternikname; ?></h4> <img src="upload/<?php echo $opic; ?>" style="width:100px;"> </li>
</ul>
<ul class="sweater1">
<?php
$query="select * from `usersweater` where `Userid`='$userid' && `Swap`='0' ";
$result = mysql_query($query);
while ($line = mysql_fetch_array($result, MYSQL_ASSOC)){
$sid = $line[Sweaterid];
$img = $line[Sweaterpic];
$nikname = $line[SNickname];
$size = $line[Size];
?>
<li> <h4><?php echo $nikname; ?><input type="checkbox" name="sweater" value="<?php echo $sid; ?>" /></h4> <img src="upload/<?php echo $img; ?>" style="width:100px;"> </li>
<?php } ?>
</ul>
</div>
</div>
<input type="text" id="area">
<div class="dialogModal_footer">
<input type="submit" name="submit" class="btn btn-primary" value="Next" />
<button type="button" class="btn btn-primary" data-dialogmodal-but="next">Next</button>
<button type="button" class="btn btn-default"data-dialogmodal-but="cancel">Cancel</button>
</div>
</div>
</form>
<!-----------------------------------------Second Step Over------------------------------------------------>
<!-----------------------------------------Third Step ----------------------------------------------->
<div id="dialog_content3" class="dialog_content" style="display:none">
<div class="dialogModal_header">Dialog header 3</div>
<div class="dialogModal_content" style="min-height:400px;">
<!-----here i want to print that value------>
</div>
<div class="dialogModal_footer">
< id="area">
<button type="button" class="btn btn-default btn-left" data-dialogmodal-but="prev">Back</button>
<button type="button" class="btn btn-primary" data-dialogmodal-but="ok">Ok</button>
<button type="button" class="btn btn-default"data-dialogmodal-but="cancel">Cancel</button>
</div>
</div>
<!-----------------------------------------Third Step Over----------------------------------------------->
In code is the part where jQuery prints the values of selected checkboxes but how to pass? I try form but not successful. How to pass value not form action/href. I think session possible but no idea how to do. Put big code for understanding flow of modalbox.
</div>