how to fire javascript on a button inside item template_问答_开发者

when i click on the button which is inside the item template of gridview then onclientclick event should fire and then call the javascript function but my problem is that there no onclientclick event is fire in item template button.

<%@ Page Language="C#" AutoEventWireup="true" EnableEventValidation="false" CodeFile="Default.aspx.cs"
    Inherits="_Default" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Untitled Page</title>
    <style type="text/css">
        .dvBroker
        {
            display: none;
            position: absolute;
            left: 0;
            top: 0;
            height: 100%;
            width: 100%;
            background-image: url(image/broker_bg.png);
            background-repeat: repeat;
        }
        .collection_heading2
        {
            font-family: verdana;
            font-size: 12px;
            font-weight: bold;
            color: #000000;
            background-image: url(image/gray_bg.gif);
            background-repeat: repeat-x;
            height: 20px;
            width: 386px;
            margin-left: 30%;
            margin-top: 50px;
            padding: 7px 7px 0px 7px;
            border: 3px solid #000000;
            border-bottom: none;
            text-align: center;
        }
        .broker_window
        {
            border: 3px solid #000000;
            height: 250px;
            overflow: auto;
            width: 400px;
            background-color:White;
            margin-left: 30%;
            border-top: none;
            padding-top: 10px;
            text-align: left;
        }
    </style>
</head>
<body>

    <script type="text/javascript" language="javascript">
    function Show()
    {
     document.getElementById("dvStage").style.display='block';
     return false;
    }    
    function Close()
    {
    document.getElementById("dvStage").style.display='none';
    return false;
    }

    </script>

    <form id="form1" runat="server">
    <asp:ScriptManager ID="sc1" runat="server" EnablePartialRendering="true">
    </asp:ScriptManager>
    <div>
        <asp:Label ID="lblmsg" runat="server" ForeColor="#FF3300"></asp:Label>
        <asp:LinkButton ID="lbnaddnewcharge" runat="server" OnClientClick="return Show();"
            Text="Show"></asp:LinkButton>
    </div>
    <div>
        ROLL NO:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <asp:TextBox ID="txtrollno" runat="server"></asp:TextBox>
        <div>
            STUDENT NAME:&nbsp;
            <asp:TextBox ID="txtname" runat="server"></asp:TextBox>
            &nbsp;&nbsp;&nbsp;
            <asp:Button ID="Button1" runat="server" Text="ADD" BorderStyle="Ridge" OnClick="btnadd_Click" /></div>
        <asp:GridView ID="gvstudent" runat="server" AutoGenerateColumns="False" Width="857px"
            OnRowDataBound="gvstudent_RowDataBound" OnSelectedIndexChanged="gvstudent_SelectedIndexChanged1">
            <Columns>
                <asp:BoundField HeaderText="ROLL NO" DataField="roll_no" />
                <asp:BoundField HeaderText="NAME" DataField="name" />
                <asp:BoundField HeaderText="TOTAL" DataField="total" />
                <asp:BoundField HeaderText="STATUS" DataField="status" />
                <asp:TemplateField>
                    <ItemTemplate>
                        <asp:Button CommandName="Click" ID="btnclick" OnCommand="btnclick_Click" CommandArgument='<%#Eval("roll_no") %>'
  开发者_如何学Python                          OnClientClick="return Show('aspnetForm','[gvstudent]');" runat="server" Text="Click" />
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>
        </asp:GridView>
    </div>
    <div id="dvstage" class="dvBroker">
        <div class="collection_heading2">
            <div style="float: left">
                SUBJECT
            </div>
            <div style="float: right">
                <asp:ImageButton ID="btnclose" runat="server" ImageUrl="~/image/delete.png" OnClientClick="return Close();" />
            </div>
        </div>
        <div class="broker_window">
            <asp:UpdatePanel ID="up1" runat="server" UpdateMode="Conditional">
                <ContentTemplate>
                    <asp:PopupControlExtender ID="PopupControlExtender1" runat="server" TargetControlID="gvchild"
                        PopupControlID="btnclick" Position="Center">
                    </asp:PopupControlExtender>
                    <asp:GridView ID="gvchild" OnRowDataBound="gvChild_RowDataBound" runat="server" AutoGenerateColumns="false"
                        EmptyDataText="NO Row in grid view">
                        <Columns>
                            <asp:BoundField HeaderText="Subject" DataField="subject_name" />
                            <asp:TemplateField>
                                <ItemTemplate>
                                    <asp:TextBox ID="txtsubject" runat="server" Text='<%#Bind("marks") %>'></asp:TextBox></ItemTemplate>
                            </asp:TemplateField>
                        </Columns>
                    </asp:GridView>
                    <asp:Button ID="btnaddchild" runat="server" Text="ADD" OnClick="btnaddchild_Click" />&nbsp;
                    <asp:Button ID="btncancle" runat="server" Text="CANCLE" OnClick="btncancle_Click1" />
                </ContentTemplate>
            </asp:UpdatePanel>
        </div>
    </div>
    </form>
</body>
</html>

Use a client-side framework like jQuery. Don't put all the onclick client-side events inline. It bloats your markup and it's harder to maintain. Bind the events instead, e.g. http://api.jquery.com/bind and/or http://api.jquery.com/live.

Since its ASP.NET WebForms, your HTML elements id attributes are rendered as the ClientID property of the server controls, so if that causes problems for you getting a reference to the elements to bind events to via id using a jQuery selector, use jQuery's selectors, http://api.jquery.com/category/selectors .

e.g.

$("input[id$='btnClose'").live("click", function(event) {
      $("#dvStage").hide();
      event.stopPropagation();
});

$("a[id$='lbnaddnewcharge']").live("click", function(event) {
          $("#dvStage").show();
          event.stopPropagation();
    });