Jquery and webserver controls_问答_开发者_运维开发者技术经验分享

开发者 https://www.devze.com 2023-02-12 20:05 出处：网络

I am learning jQuery and as part of that i tried following code.. It was simple exercise to see if i can manipulate server controls using Jquery.

相关专题：jquery

I am learning jQuery and as part of that i tried following code.. It was simple exercise to see if i can manipulate server controls using Jquery.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="TestForm.aspx.cs"     Inherits="TestForm" %>
<!DOCTYPE html>
<html>
<head>
<title></title>
  <script src="http://code.jquery.com/jquery-1.5.js" type="text/jscript"></script>
</head>
<body>

  <p>Hello</p>
  <a href="#">Click to hide me too</a>
  <p>Here is another paragraph</p>
  <input id="HTMLButton" type="button" value="HTML Button"  />

<script type="text/jscript" >
  //Desired Behavior. The Command button outside Form Attribute works are desired. 
  $("input").click(function () {
    $("#NameText").toggle()
  });

  $("#<%=WebCtrlJScript.ClientID%>").click(function () {
    alert("Button btnToggleDiv from Name Clicked");
    $("#NameText").toggle();
  });

  //This is simple HTML butt开发者_如何学运维on inside Form Element.
  $("#HTMLInsideForm").click(function () {
    alert("Button HTMLInsideForm Clicked");
      $("#NameText").toggle()
  });


</script>

<script type="text/javascript">
  function NameText() {
    alert("WebCtrlOnClientClick Clicked");
    $("#NameText").hide();
    this.blur();
  }

</script>
<form id="Form1" runat="server">
<div id="NameText">
  <table>
    <tr>
      <td>
        <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
      </td>
      <td>
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
      </td>
    </tr>
  </table>
</div>
<div>
  <asp:Button ID="WebCtrlOnClientClick" runat="server" Text=".Net Button" OnClientClick="NameText()"/>
  <asp:Button ID="WebCtrlJScript" runat="server" Text="JScript Button"/>
  <input id="HTMLInsideForm" type="button" value="HTML Button(Inside Div)" />
</div>
</form>
</body>
</html>

It seems like anything i had inside form tags is not working.. for example first button with value="HTML Button" can toggle div element with ID ="NameText" where as other buttons irrespective of whether they are HTML or server controls cannot hide the div. I am not sure what i am missing.

Thanks CSC

You need to use

$('#<%= Button1.ClientID %>')...

Unless you're using .Net 4.0. In which case you can use the solution presented here: http://weblogs.asp.net/asptest/archive/2009/01/06/asp-net-4-0-clientid-overview.aspx