Question

我正在使用现成的modalbox，它有三个步骤，第二步有多个复选框，用户可以选择两个或更多。现在我很困惑如何将这个选中的复选框值传递给modalbox中的下一步。

＆＃13;

<script>
$('input[name=sweater]').change(function() {
    $('#area').val(
        $('[name=sweater]:checked').map(function() {
            return $(this).val();
        }).get().join(',')
   );
});
</script>

＆＃13;

<!-----------------------------------------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----------------------------------------------->

＆＃13;

在代码中是jQuery打印所选复选框的值但是如何传递的部分？我尝试形式但不成功。如何传递值而不是表单action / href。我认为会议可能但不知道该怎么做。提供大代码来理解modalbox的流程。

Answer 1

对于每个步骤，当用户点击复选框时，将值存储在JS对象

中

var values={}; //createing a values object
$('.checkbox').change(function(){
 if($(this).is(':checked')){
    var checkboxvalue = $(this).val();
    var id = $(this).attr('id');
   values[id] = checkboxvalue;  //keep storing all infos in the object
}
});

然后当用户atlast点击提交按钮时，通过AJAX

传递所有信息

$.ajax({
  type: 'POST',
  url: addPackagePath,
  data: {allinfo : values}
  dataType: 'html',
  success: function(result){
  //do whatever you want
  }
});

然后在收到服务器端的所有信息后，将其存储在$_SESSION变量中

Answer 2

只要步骤之间没有页面重新加载，您只需显示/隐藏页面的某些部分就不需要使用会话。只需将其存储在像这样的javascript变量中

var sweater_val = $('[name=sweater]:checked').val();

如何将jQuery多个值存储到php $ _SESSION中

2 个答案: