如何在选择一个选择框值时将参数作为 POST 数据传递，这将重新加载同一页面？答案

【问题标题】：How to pass parameter as POST data on selection of an Select Box value, which will reload the same page?如何在选择一个选择框值时将参数作为 POST 数据传递，这将重新加载同一页面？
【发布时间】：2013-11-20 19:09:29
【问题描述】：

我有两个链接的选择框 "pr_cat" 和 "sl_num" 。第二个选择框的值取决于第一个选择框中选择的值。

<tr>
    <td width="257">Select Product Category:</td>
    <td width="197">
        <select name="pr_cat" id="Validprcat" onChange="reload(this.form)"><option value="">< Select one ></option>
        <?php while($prd=mysql_fetch_object($select_query1)) { 
        if ($prd->cat_id==$pcat) { ?>
    <option selected value="<?php echo $prd->cat_id?>"><?php echo $prd->category_name?> </option>
    <?php } else { ?>
       <option value="<?php echo $prd->cat_id?>"><?php echo $prd->category_name?></option>
      <?php }}?>
    </select>
    </td>
  </tr>
 <tr>
    <td>Select Serial Number:</td>
    <td>

    <select name="sl_num"  id="Validslnum" onChange="reload2(this.form)"><option value="">< Select one ></option>
        <?php while($slnum=mysql_fetch_object($quer)) { 
              if ($slnum->serialno==$pcat2) { ?>
    <option selected value="<?php echo $slnum->serialno?>"><?php echo $slnum->serialno?> </option>
    <?php } else {
     ?>

        <option  value="<?php echo $slnum->serialno?>"><?php echo $slnum->serialno?></option>
        <?php }} ?>
    </select>
    </td>
  </tr>
<tr>

我使用表单重新加载 javascript 来重新加载页面，其中包含在选择框中选择的值。我使用了 GET 方法。

<script language=JavaScript>
function reload(form)
{
var val=form.pr_cat.options[form.pr_cat.options.selectedIndex].value; 
self.location='delivery.php?pcat=' + val ;
}

function reload2(form)
{
var val=form.pr_cat.options[form.pr_cat.options.selectedIndex].value; 
var val2=form.sl_num.options[form.sl_num.options.selectedIndex].value; 
self.location='delivery.php?pcat=' + val + '&pcat2=' + val2 ;
}
</script>

但是我想用 POST 方法来做这个怎么做？

【问题讨论】：

标签： javascript php jquery html mysql

【解决方案1】：

如果你不想使用 ajax，并且通过 POST 方法来做，那么代替

 onChange="reload(this.form)"

打电话

 onChange="formSubmit();"


<script>
function formSubmit()
{
  document.getElementById("frm1").submit(); //frm1 is form id
      //OR you can use
  //document.frm1.submit(); //frm1 is form name
}
</script>

注意：- 如果您在此表单中有任何提交按钮，请不要将其名称保留为提交，否则您的代码会出现问题。

【讨论】：

虽然您的代码是正确的，但注意部分令人困惑，提交按钮名称将如何产生问题:)
只有将提交按钮命名为 name='submit' 时才会出现问题，我遇到过两次，重命名按钮后，它工作正常。
这不应该发生，因为提交按钮名称不会反映任何问题。我自己有使用提交作为提交按钮名称的习惯，从未遇到任何问题。

【解决方案2】：

我想你要问的差不多是这样的：JavaScript post request like a form submit

但是，您为什么要重新加载页面而不是进行 AJAX 调用？

【讨论】：

我也想做AJAX，但想不通。

【解决方案3】：

我给你最简单、最快捷的方式来做你想做的事，

AJAX：

用''标签覆盖两个选择框，

<div id='first_select'>
   <select id='first' onchange='populate_second_select(this.value)'>
   <option>Select</option>
   </select>
</div>

<div id='second_select'>
   <select>
   <option>Select</option>
   </select>
</div>

在第一个选择框中完成更改后调用populate_second_select() 函数。没有在 ajax 中，

function populate_second_select(value)
            { 

                $.ajax({
                                method:'POST',
                                url:'ajax.php',
                                data: {value:value},
                                success:function(result)
                                {
                                    document.getElementById("second_select").innerHTML=result;
                                    showLightBox();
                                }
                            });
            }

这就是你的 javascript 函数的样子，

在您的 ajax.php 文件中，根据选择的值和“echo”整个选择标记（第二个标记）处理数据库。就是这样。

这里有几个链接可以帮助您完成这项工作。

Link_1 Link_2

【讨论】：