基于另一个下拉列填充 struts2 jQuery 网格下拉列答案

【问题标题】：populate struts2 jQuery grid dropdown column based on another dropdown column基于另一个下拉列填充 struts2 jQuery 网格下拉列
【发布时间】：2014-01-20 20:50:27
【问题描述】：

我在发帖之前已经搜索过此类问题。找到的大多数答案都与 struts2 jQuery 网格无关。这是我的情况：

我已成功在初始加载时动态填充下拉框。
现在我想根据从另一个下拉框中的选择重新加载一个下拉框。
我正在寻找使用属性/主题的内置解决方案，但找不到。

任何人都可以分享任何解决方案吗？

这是我的代码：

<sjg:gridColumn
    name="aut"
    index="aut"
    title="AUT"
    width="300"
    sortable="true"
    editable="true"
    edittype="select"
    surl="%{selectautsurl}"
    editoptions="{ dataUrl : '%{selectautsurl}' }"

   />
    <sjg:gridColumn
    name="eforms"
    index="eforms"
    title="Page/Eform"
    width="300"
    sortable="true"
    editable="true"
    edittype="select"
    surl="%{selecteformsurl}"
    editoptions="{ dataUrl : '%{selecteformsurl}' }"
    />

非常感谢您的帮助。

【问题讨论】：

我是struggling，负责在初始加载时填充下拉列表。您是如何在初始页面加载时填充下拉列表的？
surl="%{selectautsurl}" 和 editoptions="{ dataUrl : '%{selectautsurl}' }" 在这里是什么意思？他们如何获得<select>的项目值和项目标签？
selectautsurl 在中定义。请查看本站：code.google.com/p/struts2-jquery/wiki/FormatGrid
我不太明白如何用<sjg:grid> 指定editoptions="{ dataUrl : '%{selectautsurl}' }" 可以获取HTML <select> 的项目值和项目标签。如果愿意，请回复here。我只是在寻找一个想法。一个精确的想法本身就可以成为一个完整的答案。
你必须在struts中配置你的action类一个成功值并且它应该指向一个有select元素的文件。这是 struts 配置：some.jsp .... 这是 jsp：

标签： jquery drop-down-menu struts2

【解决方案1】：

您需要做的是将dataEvents 添加到第一个gridColumn 更改值重新加载第二个gridColumn。你可以这样做，

<s:url id="url_id" namespace="/your_namespace" 
action="action_url_to_get_the_reloaded_list" >

    <sjg:gridColumn
        name="aut"
        index="aut"
        title="AUT"
        width="300"
        sortable="true"
        editable="true"
        edittype="select"
        surl="%{selectautsurl}"
        editoptions="{ dataUrl : '%{selectautsurl}', dataEvents: [type: 'change', fn: function(e) 
    {
                var url= '<s:property value="url_id" />' + '?your_attribute_sent_to_the_back=' + $('input#aut').val();, options;
                $.getJSON(url, function(retVal)
                {
                    options += '<option value="">&nbsp;</option>';
                    $.each(retVal.ur_returned_value, function(index, element)
                    {
                        options += '<option value="' + element.your_value + '">' + element.your_display_value + '</option>';
                    });     
                    $('input#eforms').html(options);
                });         
    }] }"

       />

我没有测试这个解决方案，但我认为它会起作用。

【讨论】：

感谢 Uchenna 的投入。不过我做了一些修改。

【解决方案2】：

感谢 Uchenna 的 cmets。我拿了它并做了一些修改，现在它可以工作了：

editoptions="{ dataUrl : '%{selectcavsurl}' ,
                                       dataEvents: [
                                       {  type: 'change', fn: function(value) {
                                    var params = 'selectedCAV='+this.value;
                                    $.get('eformsDropdown.action?'+params, function(data) 
                                    {
                                            var dropDown = document.getElementById('eforms');
                                            dropDown.innerHTML = data;
                                    });

                             }
                          }
                      ]     }"

【讨论】：