下拉列表选择完查询后跳回默认值解决方法

下拉列表查询条件保持

最新推荐文章于 2022-06-12 18:19:11 发布

原创最新推荐文章于 2022-06-12 18:19:11 发布 · 1.3k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #人工智能 #python #ViewUI

本文介绍了一种解决下拉列表查询条件丢失的方法。通过使用JavaScript脚本保存用户的选择，并在下次加载页面时恢复这些选项，确保了用户体验的一致性和查询结果的准确性。

在页面中写了一个下拉列表选择查询，代码如下:

 订单类型：
        <select id="orderType" name="orderType" style="width:100px;">
          <option value='H' >酒店 </option>
              <option value='T' > 旅游</option>
     <option value='P' >商品</option>
   </select>

默认刚开始访问页面时下拉列表中选择的是酒店，但当选择“旅游”后，点击查询，下拉列表中的值又变回“酒店”，解决方案是：

在页面上写一个javascript脚本：

<script type="text/javascript">
$(function(){ 
        var orderType = '${orderType}'; //此orderType是由程序返回的值
        var orderTypeSel = $('#orderType').find('option');
        if (orderType == 'H') {
            orderTypeSel.get(0).selected = true;//根据下拉列表选择，如果值为"H"，将其设置为“酒店”，以下同
        } else if (orderType == 'T') {
            orderTypeSel.get(1).selected = true;
        } else if (orderType == 'P') {
            orderTypeSel.get(2).selected = true;
        } else{}
       }      
    ); 
</script>

主要执行过程:

当在页面从下拉列表中选择条件时，表单将条件提交给程序去数据库中查询，然后还会将查询出来的结果放在ModelMap中，在页面上就可以用${orderType}调用到。再次到页面上时，就根据程序传过来的值去判断该显示什么条件。

大概就是这样。。。。。。