通过ajax以下拉形式重新填充多个选择表单

时间:2014-06-03 08:45:38

标签: javascript php jquery ajax forms

我想通过选择下拉值从ajax重新填充数据库中的多选表单。

这是下拉菜单的代码:

    <?php 
    $sql2 = "select _id, title from sub_category order by title;";
    $sel2 = mysqli_query($connect,$sql2);
    $array2 = array();
    while($row2 = mysqli_fetch_assoc($sel2)){
      $array2[] = $row2;
    }
    ?>

       <div class="span2">
            <select name="des_pos" id="des_pos">
               <?php
                  foreach($array2 as $value2){ ?>

                  <option value ="<?php echo $value2['_id']; ?>" <?php if($value2["title"] == $desired_position){ echo 'selected="selected"';} ?>><?php echo $value2['title']; ?> </option>

                  <?php

                  }
                  ?>
            </select>
        </div>

以下是多选表单的代码:

$sql4 = "SELECT _id, score_type from test_category where sub_code='$des_pos_id'";

  $sel4 = mysqli_query($connect,$sql4);

  $array4 = array();

  while($row4 = mysqli_fetch_assoc($sel4)){

      $array4[] = $row4;

  }

            <select name = 'test_tags[]' multiple>
            <?php

            foreach($array4 as $value4){ ?>

            <option value ="<?php echo $value4['_id']; ?>" <?php echo in_array($value4['_id'], $test_tag) ? 'selected="true"' : null; ?>><?php echo $value4['score_type']; ?></option>

            <?php

            }
            ?>
            </select>

所以我想要的输出是,多选表单的值应该根据下拉菜单上的选项而改变...

我需要一个jquery.ajax代码,但我不知道从哪里开始...我通过$ _POST获取值...但我想这样做而不经过另一个页面并重定向。 / p>

2 个答案:

答案 0 :(得分:1)

一些有用的东西: AJAX教程:W3schools ajax tutorial

然后您需要了解HTML DOM

然后您需要了解Select DOM Object

混合这些将教会你如何找出你的问题。

答案 1 :(得分:1)

在第一个下拉列表#des_pos选择事件中,将ajax帖子发送到php页面,如下所示。

 $("#des_pos").select(function(e){
 $.ajax({
   url:"getdropdata.php",
   dataType:"json",
   success: function(data){
     $.each(data,function(index,value){
      $("#multiselect").append("<option value="+value+">"+value+"</option>"));
  });
 }
})
});