由于浏览器警告,从下拉列表中选择不会填充第二个从属下拉列表


selecting from dropdown list does not populate a second dependent drop list because of browser warning

这是我第一篇关于堆栈溢出的文章,但作为一名新手,我经常访问它寻求答案,但在这个问题上,我找不到现有的答案来帮助我,因为我的知识有限。

我的网站使用了一个预先构建的商店应用程序,多年来我对其进行了大量修改,但该应用程序已不再提供支持。有一些结账页面,其中有一个国家下拉列表和第二个国家依赖下拉列表。

很久以前,由于一个我无法解决的问题行为,我完全删除了下拉列表,但现在我必须恢复下拉列表(及其问题代码),因为我的支付网关正在向标准化的国家代码和州代码要求转变。

发生的情况是,当从国家下拉列表中进行选择时,代码在从国家下拉菜单中进行选择之前提交表格;此时,浏览器会发出警报,要求确认您是否要离开当前页面。

如果你回答"否",那么你就被卡住了,因为States下拉列表仍然为空,而且在任何情况下,表单的按钮(next、back、cancelled)现在都不起作用。另一方面,如果你回答"是",那么下一个结账表单就会加载到浏览器中,在该表单中,你必须使用"上一步"按钮返回到第一个表单,在那里你现在可以进行选择,然后使用"下一步"键钮等。显然,这对用户来说不是一个可行的过程,因为大多数人都会回答"否",然后陷入困境。

这是代码的相关部分:

<tr>
    <td class="KT_th"><label for="country_ord">Country:</label></td>
    <td>
        <select name="country_ord" id="country_ord" onChange="submitMe(this)">
            <option value="" >Choose one...</option>
                <?php 
                    do {  
                ?>
                <option value="<?php echo $row_rsCountry['iso2_cnt']?>"<?php if (!(strcmp($row_rsCountry['iso2_cnt'], $row_rsorder_ord['country_ord']))) {echo "SELECTED";} ?>>
                <?php echo $row_rsCountry['name_cnt']?></option>
                <?php
                    } while ($row_rsCountry = mysql_fetch_assoc($rsCountry));
                    $rows = mysql_num_rows($rsCountry);
                    if($rows > 0) {
                        mysql_data_seek($rsCountry, 0);
                        $row_rsCountry = mysql_fetch_assoc($rsCountry);
                    }
                ?>
        </select>
          <?php echo $tNGs->displayFieldError("order_ord", "country_ord"); ?>
    </td>
</tr>
<tr>
    <td class="KT_th"><label for="state_ord">State (REQUIRED for USA only):</label (optional)></td>
    <td>
        <select name="state_ord" id="state_ord">
            <option value="">Choose one ...</option>
<?php 
do {  
?>
            <option value="<?php echo $row_rsStates['code_sta']?>"<?php if (!(strcmp($row_rsStates['code_sta'], $row_rsorder_ord['state_ord']))) {echo "SELECTED";} ?>><?php echo $row_rsStates['name_sta']?></option>
          <?php
} while ($row_rsStates = mysql_fetch_assoc($rsStates));
  $rows = mysql_num_rows($rsStates);
  if($rows > 0) {
      mysql_data_seek($rsStates, 0);
  $row_rsStates = mysql_fetch_assoc($rsStates);
  }
?>
        </select>
          <?php echo $tNGs->displayFieldError("order_ord", "state_ord"); ?>
    </td>
</tr>
<tr class="KT_buttons">
    <td colspan="2">
        <input type="button" onClick="MM_goToURL('parent','index.php?mod=cartview');return document.MM_returnValue" value="&lt; Previous">
        <input type="submit" name="KT_Update1" id="KT_Update1" value="Next &gt;">
        <input name="button_cancel" type="button" value="Cancel" onClick="document.location = 'index.php?mod=cartview'">
        <input type="hidden" name="validate_form" value="1">
    </td>
</tr>
</table>
</form>
<script>
function submitMe(el) 
{
var frm = el.form;
frm.action = window.location.href;
frm.elements.state_ord.selectedIndex = 0;
frm.elements.validate_form.value = 0;
KT_FVO = {};
frm.elements.KT_Update1.click();
}
</script>

当下拉列表的值被选中时,要防止提交,请删除以下内容:

 onChange="submitMe(this)"
from this:
<select name="country_ord" id="country_ord" onChange="submitMe(this)">
to this:
<select name="country_ord" id="country_ord">

在选择国家/地区时,不要提交表格。只需发出一个Ajax调用即可填充您的状态框。在表格中选择所有必需的参数后,提交表格。即使你仍然想在国家选择时提交表格,在提交时也要检查是否填写了你需要的所有数据,如州。如果没有,请加载包含所选国家/地区的状态数据的同一页面。下次用户选择状态并提交时,除了检查所有需要的数据(如状态)是否存在之外,还可以加载函数或页面来完成其他数据工作。