3

私は周りを探し回っていますが、自分がやろうとしていることをどのように行うかについて迷っています。

最初の列が名前のリストで、次の列がすべてドロップダウン リストであるフォームを作成しようとしています。アイデアは、ユーザーが名前ごとに値を選択することです。各名前には、2 つまたは 3 つ以上の値が必要な場合があります。ユーザーが行に追加をクリックすると、別のドロップダウン リストが表示される動的フォームを作成したいと考えています。

元。"名前" | ボタンを追加 | 落ちる

次に、追加をクリックすると...

"名前" | ボタンを追加 | ドロップダウン | 落ちる

そしてそれを続けてください。

私はフォームを作成することができ、ドロップダウンリストを作成しています。問題は、リピーターの ItemCommand にコントロールを追加しているため、毎回再作成する必要があることです。このため、値を再作成する必要があるときに、各ドロップダウンで値を選択したままにする方法が見つかりません。

通常、必要なドロップダウンは 2 つまでですが、場合によっては 3 つ必要で、それ以上必要になる場合もあります。これをできるだけ動的に保ちたいと思います。

ページ Init にドロップダウンを追加すると、ポストバックに永続化されることはわかっていますが、少なくとも私の設計では、ユーザーは追加をクリックして別のドロップダウンを取得する必要があります。

これらのドロップダウンからデータをキャプチャして、毎回リロードする方法はありますか? または、この機能を実現するためのより良い方法はありますか?

ご協力ありがとうございました。

これは、私が使用しているASPと背後にあるコードの一部です。これは希望どおりに機能していますが、追加したすべてのドロップダウン リストが失われるため、データをポストバックに保持する方法がわかりません。

ASP:

<table>
    <asp:Repeater ID="repChemicals" runat="server" OnItemCommand="repChemicals_OnItemCommand">
        <ItemTemplate>
            <tr>
                <td>
                    <asp:HiddenField ID="hfNumber" runat="server" />
                    <%# Eval("ChemicalName") %>
                </td>
                <td>
                    <asp:Button runat="server" ID="btnAdd" Text="Add" CommandArgument="ADD" />
                </td>
                <td>
                    <div id="divContainer" runat="server">
                        <asp:DropDownList runat="server" Width="60px" ID="ddlTest"></asp:DropDownList>
                    </div>
                </td>
            </tr>
        </ItemTemplate>
    </asp:Repeater>
</table>

C#:

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsPostBack)
        {
            List<Chem> Chemicals = new List<Chem>();
            Random rnd = new Random();

            for (int z = 0; z <= 10; z++)
            {
                List<string> t = new List<string>();

                Chem a = new Chem()
                {
                    ChemicalName = "Chemical" + z.ToString()
                };

                Chemicals.Add(a);
            }

            repChemicals.DataSource = Chemicals;
            repChemicals.DataBind();
        }


    }

public void repChemicals_OnItemCommand(object sender, RepeaterCommandEventArgs e)
    {
        int number = 0;

        foreach (RepeaterItem i in repChemicals.Items)
        {
            HiddenField hf = (HiddenField)repChemicals.Items[i.ItemIndex].FindControl("hfNumber");

            if (i.ItemIndex == e.Item.ItemIndex)
            {
                if (!string.IsNullOrWhiteSpace(hf.Value))
                {
                    number = Convert.ToInt16(hf.Value) + 1;
                }
                else
                {
                    number = 1;
                }

                hf.Value = number.ToString();
            }
            else
            {
                if (!string.IsNullOrWhiteSpace(hf.Value))
                {
                    number = Convert.ToInt16(hf.Value);
                }
                else
                {
                    number = 0;
                }
            }

            for (int x = 0; x < number; x++)
            {
                DropDownList ddl = new DropDownList();

                ddl.Style.Add("width", "60px");
                ddl.ID = "ddl" + i.ToString() + x.ToString();

                ddl.Style.Add("Margin-right", "3px");
                ddl.Attributes.Add("runat", "server");
                ddl.DataSource = DataSource();
                ddl.DataBind();

                Control c = repChemicals.Items[i.ItemIndex].FindControl("divContainer");
                c.Controls.Add(ddl);
            }
        }

一部のループは、テスト データを作成するためのものです。基本的に、隠しフィールドの各行に多数の動的コントロールを格納しています。次に item コマンドで、すべての行をループして、以前に存在していたすべての ddl を再作成し、コマンドの元の行に 1 つ追加します。

4

1 に答える 1

1

これはあなたの質問に正確に答えているわけではありませんが、複雑ではない方法で最終的な目標を達成し、組み込みの ASP.NET コントロールを利用して、ポストバック間の状態を維持することができます。

jQuery、jQuery UI、およびDropDownChecklistプラグインを利用します。

ASPX

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.min.js"></script>
    <script type="text/javascript" src="js/ui.dropdownchecklist.js"></script>
    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/themes/base/jquery-ui.css"/>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <table>
            <asp:Repeater ID="repChemicals" runat="server">
                <ItemTemplate>
                    <tr>
                        <td>
                            <%# Container.DataItem %>
                        </td>
                        <td>
                            <div id="divContainer" runat="server">
                                <asp:ListBox ID="lstAttributes" SelectionMode="Multiple" runat="server"></asp:ListBox>
                            </div>
                        </td>
                    </tr>
                </ItemTemplate>
            </asp:Repeater>
        </table>
        <asp:Button ID="btnPostback" Text="Postback" runat="server"/>
    </div>
    </form>
</body>
</html>

C#

using System;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace PersonAttributes
{
    public partial class People : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            repChemicals.ItemCreated += RepChemicalsOnItemCreated;

            var chemicals = new[] {"Hydrogen", "Helium", "Lithium", "Beryllium", "Boron"};

            if(!IsPostBack)
            {
                repChemicals.DataSource = chemicals;
                repChemicals.DataBind();
            }

            var dropDownChecklist = "$(document).ready(function () { $('select').dropdownchecklist(); });";
            ScriptManager.RegisterStartupScript(this,GetType(),"initDropDownChecklist",dropDownChecklist,true);
        }

        private void RepChemicalsOnItemCreated(object sender, RepeaterItemEventArgs repeaterItemEventArgs)
        {
            var lst = repeaterItemEventArgs.Item.FindControl("lstAttributes") as ListBox;

            if (lst == null)
                return;

            lst.DataSource = new[] {"Option 1", "Option 2", "Option 3"};
        }
    }
}

CodeRunで動作を確認してください。

于 2012-07-13T03:47:09.063 に答える