Ouvrir la boîte de dialogue Jquery à l'aide du modèle de grille GridView d'asp.net Champ

Question

Comment puis-je ouvrir la boîte de dialogue Jquery avec un bouton d'image placé dans Gridview Template Field?

<asp:TemplateField HeaderText="افزودن"> 
            <ItemTemplate> 
             <asp:ImageButton ID="add" runat="server" CausesValidation="false" CommandName="adddetail" 
              ImageUrl="~/Tadarokat/Images/add.png" Text="افزوردن" CommandArgument='<%# eval("mprid") %>' /> 
            </ItemTemplate> 
            <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" /> 
           </asp:TemplateField> 

ma fonction est jquery:

<script type="text/javascript"> 
    // increase the default animation speed to exaggerate the effect 
    $.fx.speeds._default = 1000; 
    $(function test() { 
     $('#Div2').dialog({ 
      autoOpen: false, 
      show: 'slide', 
      hide: 'clip', 
      width: 'auto', 
      height: 'auto' 
      , 
      modal: true, 
      resizable: false 
     }); 

     $('#opener').click(function test() { 
      $('#Div2').dialog('open'); 
      return false; 
     }); 
    }); 
</script> 

ouvre est un bouton HTML. Je veux utiliser mon bouton d'image asp.net à la place de l'ouvreur. Est-ce que ma question est claire?

Answer 1

:) Résolu

<ItemTemplate> 
         <asp:ImageButton ID="ImageButton1" runat="server" OnClientClick="showDialog('editPerson');" 
          ImageUrl="~/css/ui-lightness/images/ui-bg_highlight-soft_75_ffe45c_1x100.png" /> 
        </ItemTemplate> 
       </asp:TemplateField> 

Jquery Fonction:

<script type="text/javascript"> 
    $(document).ready(function() { 
     //setup new person dialog 
     $('#newPerson').dialog({ 
       autoOpen: false, 
       draggable: true, 
       title: "Add New Person", 
       open: function(type, data) { 
        $(this).parent().appendTo("form"); 
       } 
      }); 

      //setup edit person dialog 
      $('#editPerson').dialog({ 
       autoOpen: false, 
       draggable: true, 
       title: "Edit Person", 
       open: function(type, data) { 
        $(this).parent().appendTo("form"); 
       } 
      }); 
    }); 

    function showDialog(id) { 
     $('#' + id).dialog("open"); 
    } 

    function closeDialog(id) { 
     $('#' + id).dialog("close"); 
    } 

</script>