ASP.NET AJAX模态弹出 - 动态控制值

时间:2011-07-26 12:40:38

标签: c# asp.net dynamic postback modal-dialog

我正在为ASP.NET页面添加模式弹出窗口。弹出窗口将为用户提供一些填写的文本框,其中包含“取消”和“提交”按钮。

我遇到的问题是文本框是动态创建的,因为所需的文本框数量和要求的内容将根据页面上点击的内容而改变。尝试检索在模态窗口上单击“提交”后输入的值(未与模态窗口绑定以便进行回发)时,文本框将消失,无法检索数据。 / p>

以下是模态弹出窗口的代码:

                <div id="divModalContainer">
                    <div id="PromptContentHeader">
                        <asp:Label ID="lblHeader1" runat="server">
                        </asp:Label>
                        <br />
                        <asp:Label ID="lblHeader2" runat="server">
                        </asp:Label>
                        <asp:Label ID="lblPassFileName" runat="server">
                        </asp:Label>
                    </div>

                    <!--<ul id="ulTabModalPrompt" class="tabnav" runat="server">
                    </ul>-->
                    <div id="divModalPrompts" runat="server">
                        <table id="PromptTable" runat="server">
                        </table>
                    </div>
                    <div id="divModalButtons" style="width:230px;">
                        <div style="float:left">
                            <asp:Button ID="btnCancelDocPrompts" runat="server" Text="Cancel" OnClick="btnCancelDocPrompts_Click" />
                        </div>
                        <div style="float:right">
                            <asp:Button ID="btnSubmitDocPrompts" runat="server" Text="Submit" OnClick="btnSubmitDocPrompts_Click" />
                        </div>
                    </div>
                </div>
            </asp:Panel>

            <ajaxtoolkit:ModalPopupExtender ID="modalDocPrompt" runat="server"
                    TargetControlID="btnOpenPromptWindow" 
                    PopupControlID="panelPrompts" 
                    OkControlID="btnHiddenOkButton"
                    CancelControlID="btnCancelDocPrompts"
                    BackgroundCssClass="ModalPromptBackground"
                    DropShadow="true" />

            <asp:Button ID="btnOpenPromptWindow" runat="server" Text="Test Modal" Style="display: none;" />
            <asp:Button ID="btnHiddenOkButton" runat="server" Text="Test Modal" Style="display: none;" />

在显示模式弹出窗口之前,行将添加到PromptTable,每行中都有一个标签和文本框。

btnSubmitDocPrompts_Click方法将尝试遍历PromptTable中的每一行并检索输入的值,但单击Submit后,就不再有行了。

感谢您的帮助!

1 个答案:

答案 0 :(得分:2)

您可以尝试使用JavaScript将文本框的值写入HiddenField(如果页面加载时它将存在,则会回发)。

您必须对值进行编码并以逗号分隔它们(或类似),然后将值解析出服务器端。

修改: 示例

好的,我个人使用jQuery作为JavaScript部分,但我会假设你正在做'原始'。

说你的标记(添加一些动态文本框)如下所示:

<input type="hidden" id="hdnFormValues" />
<div id="dynamicForm">
    <div id="textBoxArea">
        <input type="text" id="newField1" /><br />
        <input type="text" id="newField2" /><br />
        <input type="text" id="newField3" /><br />
        <input type="text" id="newField4" /><br />
    </div>
    <input type="submit" onclick="saveValues()" value="Save Values" />
</div>

你有一个看起来像这样的JavaScript函数:

    function saveValues()
    {
        theBoxes = document.getElementById('textBoxArea').getElementsByTagName('input');
        hdnValues = document.getElementById('hdnFormValues');
        hdnValues.value = "";

        for(var i = 0; i < theBoxes.length; i++)
        {            
                hdnValues.value += escape(theBoxes[i].value) + '|';           
        }        
    }

然后,当按下提交按钮时,HiddenField的值将成为以管道分隔的编码值字符串。

例如,如果文本框1到4具有值:

I'm

encoding

dynamic

values!

然后HiddenField的值将变为I%27m|encoding|dynamic|values%21|

请记住,您需要从ASP.NET服务器端输出上述功能。查看ScriptManager文档,了解如何执行此操作。原因是HiddenField的ID是动态的,所以你不能(可靠地)在运行之前预测它。

最后,在接收回发的服务器端代码中,拆分分隔的字符串并取消编码,然后使用值执行所需的操作。

这里最大的警告是安全性和验证 - 虽然我已经对字符串进行了编码,但您需要进行自己的验证和安全检查!