- PR -

ListBoxの値の順序を非同期に変更する

1
投稿者投稿内容
ani
常連さん
会議室デビュー日: 2007/05/17
投稿数: 44
投稿日時: 2007-09-05 13:55
こんにちは。
いつも勉強させていただいております。

ListBoxの値の順序を非同期に変更したいのですが、よい方法が思い浮かびません。
具体的にはListBoxに

A
B
C
D

という値が入っているとして、ユーザーが「A」を選択し、
「上」、「下」というボタンをクリックするたびにListBoxの値の順序を更新したいと思っています。
UpdatePanel内にListBoxを配置し、プログラムで並び替えたものを再描画すれば実現できますが、他に方法はないでしょうか？
イメージ的には以下のサイトで使用されている「ReorderListコントロール」のようなものができればと思っています。（ドラッグ＆ドロップは不要ですが）
http://www.atmarkit.co.jp/fdotnet/dotnettips/589aspajaxreorderlist/aspajaxreorderlist.html
よい方法がありましたらご教示下さい。
よろしくお願いします。

<環境>
Windows XP(SP2), VS2005(SP1), .NET Framework 2.0, ASP.NET Ajax 1.0
ぶさいくろう
ぬし
会議室デビュー日: 2005/11/22
投稿数: 1232
お住まい・勤務地: 川崎市（は俺も含めてロクな人間が住んでないよｗ）
投稿日時: 2007-09-05 14:04
どのあたりが非同期なの？
ani
常連さん
会議室デビュー日: 2007/05/17
投稿数: 44
投稿日時: 2007-09-05 14:19
引用:

ぶさいくろうさんの書き込み (2007-09-05 14:04) より:
どのあたりが非同期なの？


ぶさいくろうさん、回答ありがとうございます。
ListBoxの順序の更新を非同期に行いたいと思っています。

引用:

「上」、「下」というボタンをクリックするたびにListBoxの値の順序を更新

この部分を非同期で行いたいです。
べる
ぬし
会議室デビュー日: 2003/09/20
投稿数: 1093
投稿日時: 2007-09-05 14:52
A
B
C
D
の状態でAを選択して「下」を押したら
B
A
C
D
という順序に変更したいということですか？

これを行うのにABCDというデータそのものはサーバー上から再取得する必要がありますか？
(例えば、別のユーザが今まさに登録した「E」も表示しなきゃいけないとか)

そうでないのだったら、単にjavascriptで順序を変えるだけでいいと思います。
ドロップダウンのoptionsとかselectedIndexとかを使ってごにょごにょやる感じですね。
ani
常連さん
会議室デビュー日: 2007/05/17
投稿数: 44
投稿日時: 2007-09-06 10:24
引用:

A
B
C
D
の状態でAを選択して「下」を押したら
B
A
C
D
という順序に変更したいということですか？

これを行うのにABCDというデータそのものはサーバー上から再取得する必要がありますか？
(例えば、別のユーザが今まさに登録した「E」も表示しなきゃいけないとか)


べるさん、レスありがとうございます。
はい、その通りです。
また、サーバー上から再取得の必要はありません。
なので、教えていただいた通り、javascriptでごにょごにょすればできると思います。
ただ、それをjavascriptを直接記述せずにASP.NET AJAXのコントロールで実装する方法はないものかと質問させていただきました。
ani
常連さん
会議室デビュー日: 2007/05/17
投稿数: 44
投稿日時: 2007-09-06 18:48
自己レスです。
ASP.NET AJAXのコントロールのみではありませんが、javascriptを直接記述せず実装できました。

コード:
    protected void UpButton_Click(object sender, EventArgs e)
    {

        int SelectedIndex;
        int SelectedIndexPrev;
        ListItem SelectedItem;
        ListItem SelectedItemPrev;


        if (ListBox1.Items.Count < 2)
        {
            return;
        }

        if (ListBox1.SelectedIndex == 0)
        {
            return;
        }

        SelectedIndex = ListBox1.SelectedIndex;
        SelectedIndexPrev = ListBox1.SelectedIndex - 1;

        SelectedItem = ListBox1.SelectedItem;
        SelectedItemPrev = ListBox1.Items[SelectedIndexPrev];

        ListBox1.Items.RemoveAt(SelectedIndex);
        ListBox1.Items.RemoveAt(SelectedIndexPrev);        

        ListBox1.Items.Insert(SelectedIndexPrev, SelectedItem);
        ListBox1.Items.Insert(SelectedIndex, SelectedItemPrev);        

    }

    protected void DownButton_Click(object sender, EventArgs e)
    {                
        int SelectedIndex;
        int SelectedIndexNext;
        ListItem SelectedItem;
        ListItem SelectedItemNext;


        if (ListBox1.Items.Count < 2)
        {
            return;
        }

        if (ListBox1.SelectedIndex == ListBox1.Items.Count -1)
        {
            return;
        }

        SelectedIndex = ListBox1.SelectedIndex;
        SelectedIndexNext = ListBox1.SelectedIndex + 1;

        SelectedItem = ListBox1.SelectedItem;
        SelectedItemNext = ListBox1.Items[SelectedIndexNext];

        ListBox1.Items.RemoveAt(SelectedIndexNext);
        ListBox1.Items.RemoveAt(SelectedIndex);

        ListBox1.Items.Insert(SelectedIndex, SelectedItemNext);
        ListBox1.Items.Insert(SelectedIndexNext, SelectedItem);        

    }

（UpdatePanelコントロール内にListBoxコントロールと「上」、「下」ボタンを配置します。）

お騒がせしてすみません。
また、ヒントを下さったぶさいくろうさん、べるさん、ありがとうございました。
1

スキルアップ／キャリアアップ（JOB@IT）