Question

我正在尝试弹出一个窗口来输入值以使用回发值。

我在互联网上搜索了很多并且能够为服务器控件构建弹出代码，下面是我的代码。

但是在构建这么多之后我无法从对话框“充电”按钮触发按钮点击事件（回发）以及如何使用输入的值。

我试过用来自“充电”的document.getElementById("<%=Open.ClientID %>").click();没有使用，也没有使用$(e.currentTarget).unbind('click'); e.currentTarget.click();。但没有工作。

    $(document).ready(function() {  

    $('#Open').click(function(e){
                e.preventDefault();
                $( "#Open-dialog" ).dialog( "open" );
    });

 $( "#Open-dialog" ).dialog({
            modal: true,
            autoOpen: false,
            height: 255,
            width: 300,
            buttons: {
                "Charge": function() {
                     var amount = $('#Amount').val();                                                                                  
                     $( this ).dialog( "close" ); 
                     return true;               
                },
                Cancel: function() {
                    $( this ).dialog( "close" );
                }
            },
    });   
});

    <form id="form1" runat="server">   
    <asp:Button id="Open" Text="Charge" runat="server" OnClick="Open_Click"/>
    <asp:Label ID="txt" Text="hi" runat="server" Visible="false"></asp:Label>
    <div id="Open-dialog" style="display: none;" title="Enter Amount">
        <label for="Amount">Amount</label>
        <input type="text" name="Amount" id="Amount" class="text ui-widget-content ui-corner-all" value="$" />
    </div>
    </form>

我无法在任何问题中找到任何清晰的图片，有人可以帮助我并提示如何继续......

提前致谢..

Answer 1

打开按钮是服务器控件，你需要捕获客户端ID，你需要调用_dopostback（action，param）来应用手动回发＆＃39;更改＆＃39;按钮单击。

<script>
        $(document).ready(function () {

            $('[id$=Open]').click(function (e) {
                e.preventDefault();
                $("#Open-dialog").dialog("open");
            });
            $("#Open-dialog").dialog({
                modal: true,
                autoOpen: false,
                height: 255,
                width: 300,
                buttons: {
                    "Charge": function () {
                        var amount = $('#Amount').val();
                         //manual do post back
                        __doPostBack('btnSave ', amount)
                        $(this).dialog("close");
                        return true;
                    },
                    Cancel: function () {
                        $(this).dialog("close");
                    }
                },
            });
        });
    </script>

在服务器端，您可以按照

抓住帖子

 protected void Page_Load(object sender, EventArgs e)
        {
            if (IsPostBack)
            {
                string amount = Request["__EVENTARGUMENT"]; // parameter
                string btnSave = Request["__EVENTTARGET"]; // actionname
            }

        }

快乐的编码......

如果你在浏览器中得到_dopostback是未定义的错误我想在这里推荐你Hanselman 或者您需要获取the Zip file并将新浏览器文件手动放入App_Browsers中。

Answer 2

最后我能找到解决方案。如果有人正在寻找带回发的Jquery对话框，我会全力以赴。

<script type="text/javascript">
    $(document).ready(function() {
        $('#Open').click(function(e){
                    e.preventDefault();
                    $( "#Open-dialog" ).dialog( "open" );
        });
     $( "#Open-dialog" ).dialog({
                modal: true,
                autoOpen: false,
                height: 255,
                width: 300,
                buttons: {
                    "Charge": function() {  
                         __doPostBack("<%= Open.UniqueID %>", $('#Amount').val()); 
                         $( this ).dialog( "close" );                                    

                    },
                    Cancel: function() {
                        $( this ).dialog( "close" );
                    }
                },
        });
    });
</script>

<form id="form1" runat="server">
<asp:Button ID="Open" Text="Charge" runat="server" OnClick="Open_Click" CausesValidation="false" />
<asp:Label ID="txt" Text="hi" runat="server" Visible="false"></asp:Label>
<div id="Open-dialog" style="display: none;" title="Enter Amount">
    <label for="Amount">
        Amount</label>
    <input type="text" name="Amount" id="Amount" class="text ui-widget-content ui-corner-all"
        value="$" />
</div>
</form>

如果遇到脚本错误

'__ doPostBack'未定义

添加

ClientScript.GetPostBackEventReference(this, string.Empty);

感谢大家在这个帖子中提供的宝贵意见..

Fire按钮单击事件并使用jquery对话框中的值

2 个答案: