ListBox 之基本運用，插入、左鍵雙擊移除、後台讀取項目

插入 :

//HTML
<asp:TextBox ID="txtImputItem" runat="server"></asp:TextBox>
<a onclick="AddGroup()">Insert</a>
<asp:ListBox ID="List1" runat="server"></asp:ListBox>
 
//Script
<script type="text/javascript">
    function AddGroup() {
        var name = $('#<%=txtImputItem.ClientID %>').val();
        $('#<%=List1.ClientID %>').append('<option value="' + name + '">' + name + '</option>');
        $('#<%=txtImputItem.ClientID %>').val('');
        GetGroupList();
    }
</script>

左鍵雙擊移除 :

$("select").dblclick(function () {
    var str = "";
    $("select option:selected").each(function () {
        $(this).remove();
    });
    GetGroupList();
})

後台讀取項目 :

此功能需搭配HiddenField處理

//HTML
<asp:HiddenField ID="HiddenField1" runat="server" />
 
//Script
<script type="text/javascript">
    function GetGroupList() {
        var arr = $('#<%=List1.ClientID %>').find("option").map(function () { return this.value; }).get();
        $('#<%=HiddenField1.ClientID %>').val(arr.join(','));
    }
</script>
arrow
arrow
    全站熱搜

    balance 發表在 痞客邦 留言(0) 人氣()

    E-mail轉寄