Archive
Posts Tagged ‘Ajax’
How to jQuery to show hide a panel based on a condition
July 29, 2010
Leave a comment
Please add a generic hanlder (Right click on Web Project > Add > New Item > Web > Generic Hanlder). In this case I have created a folder called Hanlder for Generic handlers.
Generic Hanlder:
/// <summary> /// Summary description for CheckAccountInfo /// </summary> public class CheckAccountInfo : IHttpHandler { public void ProcessRequest(HttpContext context) { string accountId = context.Request.QueryString.Get("AccountId"); if (!string.IsNullOrEmpty(accountId)) { /// /// Validate account here I have just taken fake condition /// to show the diffrence /// if (DateTime.Now.Second % 2 == 0) context.Response.Write("true"); else context.Response.Write("false"); } else context.Response.Write("false"); } public bool IsReusable { get { return false; } } }
Consuming Page:
<%@ Page Language="C#" %> <html xmlns="http://www.w3.org/1999/xhtml"> <head id="Head1" runat="server"> <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> <script language="javascript" type="text/javascript"> var accountId = "-1"; function checkStatus() { if (accountId == "-1") accountId = $(".AccountId").attr("value"); $.ajaxSetup({ cache: false }); $.ajax({ url: "Handlers/CheckAccountInfo.ashx?AccountId=" + accountId, success: function (data) { if (data == "false") $(".AccountInformation").hide("slow"); else $(".AccountInformation").show("slow"); } }); } </script> <script runat="server"> protected override void OnInit(EventArgs e) { base.OnInit(e); this.ckboxAccountStatus.Attributes.Add("onclick", "javascript:checkStatus()"); } </script> </head> <body> <form id="form1" runat="server"> <div> <asp:CheckBox runat="server" ID="ckboxAccountStatus" Text="Account Closed" /> <asp:Panel runat="server" ID="pnlAccountInformation" CssClass="AccountInformation"> <asp:TextBox runat="server" ID="txtAccountNo" Text="ACC12345676" CssClass="AccountId"></asp:TextBox> <asp:TextBox runat="server" ID="txtMemeberNo" Text="MEM12345678"></asp:TextBox> </asp:Panel> </div> </form> </body> </html>
How to use ajax (update panel) to enable disbale panel based on selection
July 29, 2010
Leave a comment
<%@ Page Language="C#" %> <html xmlns="http://www.w3.org/1999/xhtml"> <head id="Head1" runat="server"> <script runat="server"> public void SetAccountInfoStatus(object sender, EventArgs e) { this.pnlAccountInformation.Enabled = !this.ckboxAccountStatus.Checked; } </script> </head> <body> <form id="form1" runat="server"> <div> <asp:ScriptManager runat="server" ID="ScriptManager1"></asp:ScriptManager> <asp:UpdatePanel runat="server" ID="upnlAccountInformation"> <ContentTemplate> <asp:CheckBox runat="server" ID="ckboxAccountStatus" Text="Account Closed" AutoPostBack="true" OnCheckedChanged="SetAccountInfoStatus" /> <asp:Panel runat="server" ID="pnlAccountInformation"> <asp:TextBox runat="server" ID="txtAccountNo" Text="ACC12345676"></asp:TextBox> <asp:TextBox runat="server" ID="txtMemeberNo" Text="MEM12345678"></asp:TextBox> </asp:Panel> </ContentTemplate> </asp:UpdatePanel> </div> </form> </body> </html>