Question

为澄清而编辑：

我有一个包含两个下拉列表的JQuery对话框。它显示在按钮单击事件上。

我在页面加载事件中有这段代码。在代码隐藏中，我填充了一些带有过滤数据的下拉列表。当.commonClass触发LoadVessels（）时，会有一个回发。

我第一次使用它时效果很好。如果我关闭对话框，然后执行执行LoadVessels（）的click事件，它将回发。我没有从数据库重新下载的下拉列表，我可以在调试控制台中看到这些值。

当我显示对话框时，我会在ddlOperations下拉列表中看到值。当进入ddlOperations单击事件时，我还可以调试并查看其他下拉列表中的值。它似乎循环，但屏幕上的项目不受影响。

HTML：

<div id="divOpSubOp" title="Select Operations/Sub-Operations" style="width:500px; display:none;">
       <div class="row" style="margin-bottom:10px;">
            <label class="col-xs-3 control-label">
                  <span id="lblPier">Select Operation:</span></label>
         <div class="col-xs-5">
            <asp:DropDownList ID="ddlOperations" runat="server" ClientIDMode="Static" class="form-control"></asp:DropDownList>
         </div>
       </div>
       <div class="row">
            <label class="col-xs-3 control-label">
             <span id="Span1">Select Sub-Operation:</span>
            </label>
          <div class="col-xs-5">
             <asp:DropDownList ID="ddlSubOperations" runat="server" ClientIDMode="Static" class="form-control">
             </asp:DropDownList>
             <asp:DropDownList ID="ddlSubOperations1" style="display:none" runat="server" ClientIDMode="Static" class="form-control">
             </asp:DropDownList>
             <asp:DropDownList ID="ddlSubOperations2" style="display:none"  runat="server" ClientIDMode="Static" class="form-control">
             </asp:DropDownList>
           </div>
         </div>
         <div class="row">
             <asp:Button ID="btnGenerate" runat="server" 
ClientIDMode="Static" Text="Generate" CssClass="btn btn-primary" 
OnClientClick="return ValidateGenerate()" />
                </div>
            </div>

<script type="text/javascript">
  function pageLoad() {
        Sys.Application.add_load(function () {
            theForm.__EVENTARGUMENT.value = '';
        });

$(".commanClass").click(function () {
            LoadVessels();
     });

$("#ddlOperations").change(function () {
    $("#hfOperation").val($(this).val());
    $("#ddlSubOperations").empty();
    var SubOpsIdbyVal = [];

    $("#ddlSubOperations2 > option").each(function () {
        if ($(this).val() == $("#ddlOperations").val()) {
            SubOpsIdbyVal.push($(this).text());
        }
    });

    $("#ddlSubOperations").append($("<option value='0'></option>"));
    for (i = 0; i < SubOpsIdbyVal.length; i++) {
        $("#ddlSubOperations1").val(SubOpsIdbyVal[i]);
        $("#ddlSubOperations").append($("<option value='" + SubOpsIdbyVal[i] + "'>" + $("#ddlSubOperations1 option:selected").text() + "</option>"));
    }
});
}

function LoadVessels() {
        if ($('#divShiftGroup input:radio:checked').val() != undefined && 
 $('#divPortGroup input:radio:checked').val() != undefined
          && $("#txtDate").val() != "" && 
 ($("input:radio[name='YardVessel']").is(":checked"))) {
            __doPostBack("<%=upInner.UniqueID %>", 'LoadVoyageDDL');
    }
</script>

下拉列表的初始填充是在VB.net背后的代码中完成的。

If Not IsPostBack Then
        ddlOperations.DataSource = "CALL TO SQL"
        ddlOperations.DataTextField = "Descr"
        ddlOperations.DataValueField = "OpsId"
        ddlOperations.DataBind()
        ddlOperations.Items.Insert(0, "")

        ddlSubOperations1.DataSource = "CALL TO SQL"
        ddlSubOperations1.DataTextField = "Descr"
        ddlSubOperations1.DataValueField = "SubOpsId"
        ddlSubOperations1.DataBind()

        ddlSubOperations2.DataSource = "CALL TO SQL"
        ddlSubOperations2.DataTextField = "SubOpsId"
        ddlSubOperations2.DataValueField = "OpsId"
        ddlSubOperations2.DataBind()
End If

Answer 1

如果您希望过滤在页面中持续存在，则后端需要生成过滤列表或客户端需要在页面加载时执行代码。

最初在ddlOperations上触发change事件时应用它。但是，在回发和页面重新加载之后，直到在ddl操作更改时再次触发更改事件时才会执行代码。如果选择了ddl操作，除了将其注册到on change事件之外，尝试将过滤代码移动到函数中并在页面加载时执行它。

Answer 2

问题最终是有一个未被删除的打开的JQuery对话框窗口。因此，每次打开两次，但下拉列表已隐藏在DOM中，并且未显示。

级联下拉列表JQuery - 回发后不显示下拉列表

2 个答案: