1

私のJavaScript:

/* Modal */

function DefaultModal() {
    $(".ModalBox").dialog("open");
}

$(function () {
    // Modal.
    $(".ModalBox").dialog({
        autoOpen: false,
        height: 410,
        resizable: false,
        draggable: false,
        width: 602,
        modal: true,
        open: function (type, data) {
            // include modal into form
            $(this).parent().appendTo($("form:first"));
        },
        buttons: {
            "Confirm": function () {

            }
        },
        close: function () {
//clear all text.
            $(this).find(':text').val('');
        }
    });
});

モーダルを呼び出す方法は 2 つあります。

これは完璧に動作します:

<li><a href="javascript:void(0)" onclick="DefaultModal();">ADD contact</a></li>

これはそうではありません。一時テーブルからモーダルに編集するボタンが 1 つ必要です。


            <asp:GridView ID="gvContato" runat="server" AutoGenerateColumns="False" OnRowCommand="RunComm"
                    DataKeyNames="IDCliente" AllowPaging="True" PageSize="10" Width="600px">
                    <Columns>
                <asp:BoundField DataField="IDCliente" Visible="false" />
                        <asp:BoundField DataField="Name" HeaderText="Name" SortExpression="Name" />
                        <asp:BoundField DataField="Phone" HeaderText="Phone" SortExpression="Phone" />
                        <asp:BoundField DataField="Email" HeaderText="E-mail" SortExpression="Email" />

                        <asp:ButtonField ButtonType="Button" CommandName="Edit" Text="Edit">
                            <ItemStyle HorizontalAlign="Center" />
                        </asp:ButtonField>
                    </Columns>
                </asp:GridView>
protected void RunComm(object sender, GridViewCommandEventArgs e)
        {
            int IDSelecionado = (int)gvContato.DataKeys[Convert.ToInt32(e.CommandArgument)].Values[0];

            switch (e.CommandName)
            {
                case "Edit":
                    if (IDSelecionado > 0)
                    {
                        ScriptManager.RegisterClientScriptBlock(this.upModalContato, this.upModalContato.GetType(), "Modal", "DefaultModal();", true);
                    }
                    break;
            }

        }

私の編集ボタンはこれを行っています:

彼は私のダイアログを開くだけでなく、それを私の体に表示します(モーダルとしてだけでなく、私のグリッドビューの下のDIVとしても)。それに加えて、情報を保存せずに(編集ボタンを使用して)ダイアログを開いたり閉じたりし続けると、すべてのテキストボックスにコンマが作成され続けます。JavaScriptで配列を行うときのように。

どうしてか分かりません!?

何か案は?ここで自分を理解できるようにしたかどうかはわかりません。そうでない場合は、行方不明だと言ってください。

ありがとうございます。それでは、お元気で。

編集:

PS: 私は UpdatePanel を使用しています!

EDIT2:タイプミス

EDIT3:なぜ私はこれをやっているのですか?

私の目標:

  • データベースからのデータ (実際のデータ) を含む 1 つのグリッド ビューを読み込みます。
  • 私のモーダル(一時データ)から保存されたこのグリッドビュー一時データに入れます。
  • 一時データを永久に (モーダルで) 除外/編集します。
  • 一時的に、実際のデータを (モーダルで) 除外/編集します。

すべての変更後、データベースに最終データ (一時データと実データ) を保存しました。

これを達成するために、データをビューステートに保存しています(私はひどいことを知っていますが、現時点ではアイデアがありません)

@NerdFuryソリューションに従って、私はこれを作成しました:(これはまだ必要として機能しません!彼はモーダルを開きますが、フィールドにデータをロードしません。このコードも、html 本文でテーブル (モーダル) を開きます。データ。)

Cシャープ:


        protected void btnEditModal_Click(object sender, EventArgs e)
        {
            this.ddlDepartamentoContato.SelectedIndex = 1;
            this.ddlCargoContato.SelectedIndex = 2;
            this.ckAprovadorContato.Checked = true;

        }

html:

                        <asp:TemplateField>
                            <ItemTemplate>
                                <asp:Button ID="btnEditModal" runat="server" Text="Edit" OnClientClick="DefaultModal();" CausesValidation="false" OnClick="btnEditModal_Click" />
                            </ItemTemplate>
                        </asp:TemplateField>

しかし、私はまだモーダルに問題があり、ダイアログが開きますが、テーブルも画面に表示されます。ボタンイベントでいくつかの静的データを使用して、それが機能しているかどうかを確認しました。彼はこのデータをモーダルではなくテーブルにロードしました。

PS: 私は考えました (少なくとも私は信じています)、問題は何ですか。

asp:UpdatePanel

コードから削除すると、データが読み込まれ、すべてが問題なく動作しますが、ポストバックが行われ、モーダルはほとんど表示されません! 彼は私の画面で「まばたき」するだけです。

私の実際のコードを見てください:

<asp:UpdatePanel ID="upModalContact" runat="server">
<ContentTemplate>
    <table>
        <tr>
            <td>
                <ul id="contatoModalButtonList">
                    <li><a href="javascript:void(0)" onclick="DefaultModal();">Add contact</a></li>
                </ul>
            </td>
        </tr>
        <tr>
            <td>
                <asp:GridView ID="gvContact" runat="server" AutoGenerateColumns="False" OnPageIndexChanging="gvContact_PageIndexChanging"
                    DataKeyNames="IDCliente" AllowPaging="True" PageSize="10" Width="600px">
                    <Columns>

                        <asp:BoundField DataField="IDClient" Visible="false" />
                        <asp:BoundField DataField="Name" HeaderText="Name" SortExpression="Name" />
                        <asp:BoundField DataField="Phone" HeaderText="Phone" SortExpression="Phone" />
                        <asp:BoundField DataField="Email" HeaderText="E-mail" SortExpression="Email" />

                        <asp:TemplateField>
                            <ItemTemplate>
                                <asp:Button ID="btnEditContactmodal" runat="server" Text="Edit" CausesValidation="false" OnClick="btnEditModal_Click" OnClientClick="DefaultModal();" />
                            </ItemTemplate>
                        </asp:TemplateField>
                    </Columns>
                </asp:GridView>
            </td>
        </tr>
    </table>

</ContentTemplate>
</asp:UpdatePanel>

<table class="ModalBox" title="Contact">
<tr>
    <td colspan="2">
        <p class="validateTips"> Fields required (*).</p>
    </td>
</tr>
<tr>
    <td align="left" width="130px">
        <asp:Label Text="Name:" runat="server" ID="lblNameContact" />
    </td>
    <td>
        <asp:TextBox runat="server" ID="txtNameContact" CssClass="classNameContact" Width="400px" MaxLength="50" /> &nbsp; <label>*</label>
    </td>
</tr></table>
4

2 に答える 2

2

CommandNameマークアップでは、を「Editar」に設定してから、イベント ハンドラでCommandName「Edit」をチェックしています。

id 値を使用している場所はどこにもありませんが、データ/動作を確定する前に最初にポップアップを機能させようとしている可能性があります。しかし、私の他の提案は、ボタンフィールドの代わりにテンプレート フィールドを使用することを検討し、代わりにボタンで OnClientClick イベントを使用することです。

于 2011-04-01T19:39:03.933 に答える
1

やったよ!!!

私はこれを達成するために2つの更新パネルを使用します。このリンクに基づいて(ありがとうございます!)

<div class="ModalContact" style="display:none;width:375px;" title="Contact">
<asp:UpdatePanel ID="upModalContact" runat="server">
    <ContentTemplate>
        <table>

        </table>
    </ContentTemplate>
</asp:UpdatePanel>

更新パネルはダイアログdiv内にネストされていることに注意してください。また、リストを表示するためのGridViewも更新パネル内にあります

于 2011-04-06T12:45:38.427 に答える