zukucode
主にWEB関連の情報を技術メモとして発信しています。

ASP.NET ListBoxのListItemを移動して要素を入れ替える

ASP.NETListBoxの要素(ListItem)の前後の順番を入れ替える方法を紹介します。

よくある例として、「↑」「↓」ボタンをクリックすると選択中のListItemを上下に移動する機能があります。

btnUp(↑)ボタン, btnDown(↓)ボタンで、クリックするとlstSample(リストボックスコントロール)の選択中の要素を上下に1つ移動します。

<asp:Button ID="btnUp" runat="server" Text="↑" />
<asp:Button ID="btnDown" runat="server" Text="↓" />
<asp:ListBox ID="lstSample" runat="server" SelectionMode="Multiple"></asp:ListBox>

以下に実装例を示します。

Protected Sub btnSort_Click(sender As Object, e As EventArgs) Handles btnUp.Click, btnDown.Click

    '1行のみ選択可能
    If lstSample.Items.Cast(Of ListItem).Where(Function(i) i.Selected = True).Count <> 1 Then Return

    '選択中の要素を保持
    Dim SelectedItem As ListItem = lstSample.SelectedItem

    '移動する要素のインデックスを取得
    Dim index As Integer = lstSample.Items.IndexOf(SelectedItem)

    Select Case CType(sender, Button).ID
        Case btnUp.ID
            '先頭行の場合は処理終了
            If index = 0 Then Return
        Case btnDown.ID
            '最終行の場合は処理終了
            If index = lstSample.Items.Count - 1 Then Return
    End Select

    '選択状態をクリア
    lstSample.SelectedValue = Nothing

    '移動する要素をリストから削除
    lstSample.Items.RemoveAt(index)

    Select Case CType(sender, Button).ID
        Case btnUp.ID
            'インデックス - 1の場所に要素を追加
            lstSample.Items.Insert(index - 1, SelectedItem)
        Case btnDown.ID
            'インデックス + 1の場所に要素を追加
            lstSample.Items.Insert(index + 1, SelectedItem)
    End Select

    '移動した要素を選択状態にする
    SelectedItem.Selected = True
End Sub

リストボックスのSelectronModeのプロパティがMultipleの場合は複数の要素が選択できます。

4行目の処理で、選択中の要素が1行以外の場合は処理を行わないようにしています。

VB.NET 複数選択のリストボックスListBoxで選択された項目を配列で取得するで紹介したラムダ式を使用して、選択状態の要素の数を取得しています。


関連記事