JavaScript Learning (a): onclick () and onclientclick () event

onclick is an event that calls the server-side, is written in the CS file.

onclientclick refers to the call to control the output HTML code javascript events.

Write your own code verification passed, if a button there are the two events at the same time, it is the first implementation of onclientclick then execute onclick event.

Very often are the first to do the verification onclientclick. Before proceeding with the background server-side onclick event later if verified. This time we should pay attention to the use of the onclientclik.

Use a:

If the verification fails in onclentclick event in returns false, it would not execute the onclick event background.

//html代码
<asp:Button ID="btnSubmit" Text="submit" runat="server"      OnClick="btnSubmit_Click"  
OnClientClick="if(!validate()) return false;"/>

// javascript codes
<script type="text/javascript">
      function validate(){
        alert("all right. you got me.");
        return true;
       //return false;
    }

</script>

 

Use two: onclientclick return the function result javascript,

//html code
<div id="divSection1" align="center">
    <div>
    </div>
    <table>
        <tr>
            <td>
                <asp:Label ID="Label1" runat="server">number one: </asp:Label>
            </td>
            <td>
                <input id="Text2" type="text" />
            </td>
        </tr>
        <tr>
            <td>
                <asp:Label ID="Label2" runat="server">number two: </asp:Label>
            </td>
            <td>
                <input id="Text3" type="text" />
            </td>
        </tr>
        <tr>
            <td>
                <asp:Label ID="Label3" runat="server">Operation: </asp:Label>
            </td>
            <td>
                <asp:DropDownList ID="DropDownList1" runat="server">
                    <asp:ListItem Enabled="true" Text="Select Operation" Value="-1"></asp:ListItem>
                    <asp:ListItem Text="Plus" Value="0"></asp:ListItem>
                    <asp:ListItem Text="Minus" Value="1"></asp:ListItem>
                    <asp:ListItem Text="Multiply" Value="2"></asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:Button ID="btnSubmit" Text="submit" runat="server" OnClick="btnSubmit_Click"
                    OnClientClick="return validate()" />
            </td>
        </tr>
        <tr>
            <td>
                <asp:Label ID="Label4" runat="server">Result: </asp:Label>
            </td>
            <td>
                <input id="Text1" />
            </td>
        </tr>
    </table>
</div>

//javascript code
<script type="text/javascript">
    debugger;
    function validate() {
        var result = true;
        if ($('#<%=DropDownList1.ClientID%>').val() != -1) {
            alert("all right. you are doing the right thing.");
            result = true;
        }
        else {
            alert("please select the operation.")
            result = false;
        }
        return result;

    }

</script>

 

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

And winform is not the same as the message appears directly messagebox in asp.net. It can be achieved using javascript.

        protected void btnSubmit_Click(object sender, EventArgs e)
        {
            ClientScriptManager clientScript = Page.ClientScript;
            string message = "this is called the event from the client side.";
            StringBuilder sb = new StringBuilder();
            sb.Append("<script type='text/javascript'>");
            sb.Append("alert('");
            sb.Append(message);
            sb.Append("')");
            sb.Append("</script>");
            clientScript.RegisterClientScriptBlock(this.GetType(), "alert", sb.ToString());
          
        }

 

 

Reproduced in: https: //www.cnblogs.com/Jenny90/p/3569225.html