ASP.NET GridView：確認按鈕單擊回發與jQueryUI對話框

Question

我希望有人能幫我弄明白這一點。我已經看到四周還沒有找到一個能幫助我的例子。我有一種感覺，我在這個超級接近...

我有一個asp：gridview在每行的末尾有一個linkbutton。在運行onrowcommand之前，我需要做一個確認對話框。這是我必須做的代碼...我錯過了什麼？

function confirmProcessing(event) { 
    event.preventDefault(); 

    $("#dialog") 
     .dialog({ 
      title: "Confirm Transaction", 
      buttons: { 
       "Process": function() {           
        $("#dialog").dialog('close'); 

       }, 
       Cancel: function() { 
        $("#dialog").dialog('close'); 
        return false; 
       } 
      }, 
      close: function() {        
       return false; 
      }, 
      modal: true, 
      appendTo: "form" 

     }) 
     .parent() 
     .css('z-index', '1005'); 

} 

ASPX代碼

<div class="row"> 
    <asp:GridView runat="server" ID="ccList" CssClass="table table-striped table-responsive" ShowHeader="True" AutoGenerateColumns="False" OnRowDataBound="ccList_OnRowDataBound" OnRowCommand="ccList_OnRowCommand"> 
     <Columns> 
      <asp:BoundField DataField="Street" ItemStyle-CssClass="Street" HeaderText="Street"/> 
      <asp:BoundField DataField="ZipCode" ItemStyle-CssClass="ZipCode" HeaderText="Zip"/> 
      <asp:BoundField DataField="MB4P" ItemStyle-CssClass="MB4P" HeaderText="MB4P"/> 
      <asp:BoundField DataField="MB4S" ItemStyle-CssClass="MB4S" HeaderText="MB4S"/> 
      <asp:BoundField DataField="BAL" ItemStyle-CssClass="BAL" HeaderText="BAL"/> 
      <asp:TemplateField> 
       <ItemTemplate> 
        <asp:LinkButton runat="server" ID="btnProcess" OnClientClick="confirmProcessing(event);" Text="Process Payment" CommandName="Process" CommandArgument="<%# ((GridViewRow) Container).RowIndex %>"/>  
       </ItemTemplate> 
      </asp:TemplateField> 
     </Columns> 
    </asp:GridView> 
</div> 

<div id="dialog" style="display:none">   
    <b>Are you sure you want to process this record?</b> 
</div> 

OnRowCommand代碼

protected void ccList_OnRowCommand(object sender, GridViewCommandEventArgs e) 
{ 
    if (e.CommandName == "Process") 
    { 
     //Do the processing stuff here after confirm dialog. 
    }   
} 

如果我刪除的preventDefault它觸發通過向其預期OnRowCommand。我只是不知道如何讓模態對話框中的Process按鈕發出命令......我在這裏丟失了什麼？

在此先感謝。

Answer 1

LinkBut​​ton的的OnClientClick屬性可以在GridView的RowDataBound事件處理程序被設置，與該按鈕作爲參數的UniqueID到confirmProcessing：

protected void ccList_RowDataBound(object sender, GridViewRowEventArgs e) 
{ 
    if (e.Row.RowType == DataControlRowType.DataRow) 
    { 
     LinkButton btnProcess = e.Row.FindControl("btnProcess") as LinkButton; 
     btnProcess.OnClientClick = string.Format("return confirmProcessing('{0}');", btnProcess.UniqueID); 
     ... 
    } 
} 

JavaScript的事件處理程序然後可以修改爲如下：

function confirmProcessing(btnUniqueID) { 
    $("#dialog").dialog({ 
     title: "Confirm Transaction", 
     buttons: { 
      "Process": function() { 
       $("#dialog").dialog('close'); 
       __doPostBack(btnUniqueID, ''); 
      }, 
      Cancel: function() { 
       $("#dialog").dialog('close'); 
       return false; 
      } 
     }, 
     close: function() { 
      return false; 
     }, 
     modal: true, 
     appendTo: "form" 

    }).parent().css('z-index', '1005'); 

    return false; 
} 

當點擊LinkBut​​ton的，顯示對話框，函數返回false取消初始回發。如果通過單擊Process關閉對話框，則會使用LinkBut​​ton的UniqueID調用__doPostBack以導致回發。

注意：我認爲UniqueID可以藉助name屬性在客戶端代碼中檢索。它適用於Button控件，但不適用於LinkBut​​ton。這就是爲什麼我建議在代碼隱藏中設置OnClientClick屬性。