TaleMing 2014-05-22 03:01 采纳率: 0%
浏览 921

动态二级联动一直搞不定,求帮忙~~

根据id查出所有name第一个下拉中显示,再根据第一个下拉菜单中选中的name查询出所有这个名字下的cname,都在一个material表中。
id int
name varchar
cname varchar
这个老项目用struts1写的。最好jquery代码能注释一下,

  • 写回答

1条回答

  • ChatGPTᴼᴾᴱᴺᴬᴵ 2023-12-08 22:57
    关注

    所有内容均由人工智能模型输出,其内容的准确性和完整性无法保证,不代表我的态度或观点。
    (通义千问专栏,v2.1.0版本)


    该回答引用通义千问大模型,仅提供参考,不保证完全正确
    要实现一个基于 Struts1 和 jQuery 的动态二级联动效果,你需要按照以下步骤进行:

    1. 创建 struts 配置文件
      struts-config.xml 文件中添加 Action 到你的 JSP 页面。

    2. 创建 Action 类
      创建一个新的 Java 类来处理 AJAX 请求并返回 JSON 数据。例如,你可以创建一个名为 MaterialAction 的类,并为每个请求分别定义 findMaterials()findCnamesByMaterial() 方法。

    3. 编写 JSP 页面
      在你的 JSP 页面上创建两个下拉菜单,并使用 jQuery 来处理它们的事件和更新。

    以下是一个简化的示例代码:

    1. struts-config.xml

    <action path="/material/findMaterials"
            type="com.example.MaterialAction"
            name="materialForm"
            scope="request"
            validate="false">
        <forward name="success" path="/WEB-INF/materials.jsp"/>
    </action>
    <action path="/material/findCnamesByMaterial"
            type="com.example.MaterialAction"
            name="materialForm"
            scope="request"
            validate="false">
        <forward name="success" path="/WEB-INF/cnames.jsp"/>
    </action>
    

    2. MaterialAction.java

    import java.util.List;
    import javax.servlet.http.HttpServletRequest;
    import org.apache.struts.action.Action;
    import org.apache.struts.action.ActionForm;
    import org.apache.struts.action.ActionForward;
    import org.apache.struts.action.ActionMapping;
    
    public class MaterialAction extends Action {
        
        public ActionForward findMaterials(ActionMapping mapping, ActionForm form,
                                          HttpServletRequest request, HttpServletResponse response)
                throws Exception {
            List<Material> materials = // 查询所有材料
            request.setAttribute("materials", materials);
            return mapping.findForward("success");
        }
    
        public ActionForward findCnamesByMaterial(ActionMapping mapping, ActionForm form,
                                                  HttpServletRequest request, HttpServletResponse response)
                throws Exception {
            String materialName = request.getParameter("materialName");
            List<String> cnames = // 根据 materialName 查询所有cname
            request.setAttribute("cnames", cnames);
            return mapping.findForward("success");
        }
    }
    

    3. materials.jsp

    <!-- 引入 jQuery -->
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    
    <!-- 第一个下拉菜单 -->
    <select id="materialSelect">
        <!-- 使用 struts 的 iterate 标签循环遍历 materials -->
        <option value="">请选择</option>
        <logic:iterate id="material" name="materials">
            <option value="<bean:write name="material" property="name"/>" >
                <bean:write name="material" property="name"/>
            </option>
        </logic:iterate>
    </select>
    
    <!-- 第二个下拉菜单 -->
    <select id="cnameSelect">
        <!-- 下面的内容将在 AJAX 调用后被替换 -->
    </select>
    
    <!-- JavaScript 代码 -->
    <script>
    $(document).ready(function() {
        $('#materialSelect').change(function() {
            var selectedMaterial = $(this).val();
            if (selectedMaterial) {
                $.ajax({
                    url: '/your_project_name/material/findCnamesByMaterial.do',
                    data: { 'materialName': selectedMaterial },
                    success: function(data) {
                        // 清空当前选项
                        $('#cnameSelect').empty();
    
                        // 添加新选项
                        for (var i = 0; i < data.length; i++) {
                            $('<option/>', {
                                value: data[i],
                                text: data[i]
                            }).appendTo('#cnameSelect');
                        }
                    }
                });
            } else {
                // 如果未选择任何材料,则清空第二个下拉菜单
                $('#cnameSelect').empty();
            }
        });
    });
    </script>
    

    这个例子中,当用户在第一个下拉菜单(#materialSelect)中选择了一个选项时,jQuery 的 change 事件处理器会被触发。然后,它会发送一个 AJAX 请求到 /your_project_name/material/findCnamesByMaterial.do,并将选中的材料名称作为参数传递。服务器端的 findCnamesByMaterial 方法将根据这个参数查询所有相关的 cname,并以 JSON 数组的形式返回给客户端。最后,jQuery 将接收到的数据解析为数组,并根据这些数据更新第二个下拉菜单(#cnameSelect)。

    评论

报告相同问题?

悬赏问题

  • ¥15 vs2019中数据导出问题
  • ¥20 云服务Linux系统TCP-MSS值修改?
  • ¥20 关于#单片机#的问题:项目:使用模拟iic与ov2640通讯环境:F407问题:读取的ID号总是0xff,自己调了调发现在读从机数据时,SDA线上并未有信号变化(语言-c语言)
  • ¥20 怎么在stm32门禁成品上增加查询记录功能
  • ¥15 Source insight编写代码后使用CCS5.2版本import之后,代码跳到注释行里面
  • ¥50 NT4.0系统 STOP:0X0000007B
  • ¥15 想问一下stata17中这段代码哪里有问题呀
  • ¥15 flink cdc无法实时同步mysql数据
  • ¥100 有人会搭建GPT-J-6B框架吗?有偿
  • ¥15 求差集那个函数有问题,有无佬可以解决