2012-05-16 176 views
0

我正在使用中繼器顯示數據行。每一行都有一個刪除圖像按鈕。我想用jQuery UI添加一個確認對話框。當單擊刪除圖像按鈕時,對話框將正確顯示。我不確定的是當在對話框中單擊OK按鈕時,如何從jQuery調用Image按鈕的事件處理程序。ASP.Net圖像按鈕使用jQuery UI對話框刪除確認

回答

0

你可以做一些這樣的事情,檢查Jquery Dialogbox示例, 綁定Repeater時附加事件處理程序。這樣

yourbutton.Attributes.Add("onclick","Deletbox('" + yourDeleteID + "'))"; 

javascript函數:

var deleteId;//this the global variable to hold the value 


function Deletebox(ID) 
{ 
    ("#YourDialog").data('DeleteID',ID).dialog('open'); 
} 

這對於對話框初始化

 $("#YourDialog").dialog({ 
        modal: true, //this will make a modal form 
           open:function() 
           { 
             deleteId=$(this).data('DeleteID'); 
           }, 
        buttons: { // this is the buttons which you are going to show in box 
         "Delete all items": function() { 
          CallYourdeletionMethodFromServer(deleteId)// by using $.Ajax function 
         }, 
         Cancel: function() { 
          $(this).dialog("close"); 
         } 
        } 
       }); 
+0

我有一個repeater_ItemCommand事件處理程序有線了其獲取從CommandArgument缺失的ID,然後調用刪除記錄的方法。我如何直接從jQuery調用這個事件處理程序。 – user917179

+0

您可以將ID傳遞給對話框,我會更新答案。 –

+0

@ user917179檢查我更新了答案 –

0

你可以叫你的OK按鈕單擊處理__doPostBack功能。您需要保留最初點擊的按鈕的ID以打開對話框並將其作爲第一個參數傳遞。

0
<div class="Parent"> 
     <div> 
      test1 
     </div> 
     <div> 
      <input type="button" value="Delete" onclick="Deletemessage(1,this);" /> 
     </div> 
    </div> 
    <div class="Parent"> 
     <div> 
      test2 
     </div> 
     <div> 
      <input type="button" value="Delete" onclick="Deletemessage(1,this);" /> 
     </div> 
    </div> 


function Deletemessage(id, obj) { 
      $('<div></div>').appendTo('body') 
        .html('<div><h6>Are you want to delete this part?</h6></div>') 
        .dialog({ 
         modal: true, title: 'Delete message', zIndex: 10000, autoOpen: true, 
         width: 'auto', modal: true, resizable: false, 
         buttons: { 
          Ok: function() { 
           $(obj).removeAttr('onclick'); 

           //        $.ajax({ 
           //         url: '/yourPath', type: 'Post', dataType: 'json', 
           //         data: { 'id': id }, 
           //         success: function (data) { 
           $(obj).parents('.Parent').remove(); 

           //Or 

           //window.location.reload(); 

           //         } 
           //        }); 

           $(this).dialog("close"); 
          }, 
          Cancel: function() { 
           $(this).dialog("close"); 
          } 
         }, 
         close: function (event, ui) { 
          $(this).remove(); 
         } 
        }); 
     };   

現場演示中看到此鏈接:http://jsfiddle.net/nanoquantumtech/9NKXq/

+0

函數Deletemessage(id,name,obj) - > Deletemessage(1,'test name',this); – Thulasiram