Question

我在网页上有两个列表框，两个html输入标记和一个.NET提交按钮。

// The two listboxes
<asp:ListBox ID="lbViewOptions_Hidden" runat="server" Rows="7" Width="110px"></asp:ListBox>
<asp:ListBox ID="lbViewOptions_Show" runat="server" Rows="7" Width="110px"></asp:ListBox>

// The two html input tag
<input id="ibtnRight" type="image" src="images/move_right.png" style="height:16px;width:16px;border-width:0px;" />
<input id="ibtnLeft" type="image" src="images/move_left.png" style="height:16px;width:16px;border-width:0px;" />

// The .NET submit button
<asp:Button ID="btnApplyViewOptions" runat="server" Text="Apply" CssClass="submit" onclick="btnApplyViewOptions_Click" />

我有输入标签的点击事件的以下jQuery函数，它们只是在两个列表框之间来回移动项目。这些函数可以很好地工作，并在列表框之间来回移动项目。

$('#ibtnRight').click(function ($e) {
    $("select[id$='lbViewOptions_Hidden'] option:selected").appendTo(
        $("select[id$='lbViewOptions_Show']"));
    $("select[id$='lbViewOptions_Hidden'] option:selected").remove();

    $e.preventDefault();
});

$('#ibtnLeft').click(function ($e) {
    $("select[id$='lbViewOptions_Show'] option:selected").appendTo(
        $("select[id$='lbViewOptions_Hidden']"));
    $("select[id$='lbViewOptions_Show'] option:selected").remove();

    $e.preventDefault();
});

在page_load事件期间加载了列表框，其中包含各种动态项目，因此我使用ASP.NET列表框控件而不是仅使用各种项目硬编码HTML选择标记。 我的问题是：由于列表框是.NET控件而且我使用jQuery在它们之间来回移动项目，对它们所做的任何更改都不会持续存在通过回发。

例如，假设listbox lbViewOptions_Hidden中有两个项目：“Foo＃1”和“Foo＃2”。如果我选择项目“Foo＃2”并单击输入按钮将其移动到listbox lbViewOptions_Show，那么它将移动到它应该的位置，我现在在第一个列表框和项目“Foo＃2”中有项“Foo＃1”在第二个列表框中。但是，如果我点击.NET按钮btnApplyViewOptions提交回服务器，第二个列表框没有项目，所有项目仍在第一个列表框中。

如何解决此问题？我认为它与ViewState有关，但我并不乐观。提前感谢您对我的任何帮助！

Answer 1

您将不得不使用Ajax调用WebMethod服务器端来通过在会话中存储更改来更新控件...然后在回发时使用会话值更新控件。

或者您可以使用添加了runat="server"属性的隐藏字段，在列表之间存储更改，然后在回发后获取更改并以此方式更新控件。

使用jQuery在.NET列表框之间移动项目

1 个答案: