Databases
StackOverflow2013
Postsdbo
PObutton onclick not triggered when clicking on a button created in asp.net (changed the div.innerhtml with a html string)
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PObutton onclick not triggered when clicking on a button created in asp.net (changed the div.innerhtml with a html string)
    text
    copied!<p>So, basically the question is in the title,</p> <p>I have a div (loginP within loginDiv) for loging in. after the user logs in, the innerHtml of loginP changes via Asp.net. I also use jquery to let the user of the site move the loginDiv (that contains the loginP) up and down, maybe that matters.</p> <p>here is the normal html part of the code:</p> <pre><code>&lt;div id="loginDiv" runat="server"&gt; &lt;div id="loginP" runat="server"&gt; username:&lt;br /&gt; &lt;asp:TextBox runat="server" ID="user" Rows="1" class="textboxL" /&gt;&lt;br /&gt; password:&lt;br /&gt; &lt;asp:TextBox TextMode="Password" runat="server" ID="pass" Rows="1" class="textboxL" /&gt;&lt;br /&gt; &lt;div id="bottomDiv"&gt; &lt;asp:Button ID="RegiButton" runat="server" UseSubmitBehavior="false" CssClass="buttonC" Text="Register" OnClick="RegisterBtnClick" /&gt; &lt;asp:Button ID="LogButton" runat="server" UseSubmitBehavior="true" CssClass="buttonC" Text="Login" OnClick="LoginBtnClick" /&gt;&lt;br /&gt; &lt;asp:CheckBox runat="server" ID="rememberME" /&gt; &lt;p id="rememberMe"&gt; &lt;font size="1" face="verdana"&gt;remember me&lt;/font&gt; &lt;/p&gt; &lt;asp:Label Width="180px" Height="40px" Visible="true" runat="server" Text="" ID="errorLabel" /&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>here is the jquery part</p> <pre><code> var ldiv = $("#loginDiv"); ldiv.offset({ top: 10 }); var drag = { y: 0, state: false }; var delta = { y: 0 }; $("#user").mousedown(function () { drag.state = false; $("#user").focus() }); $("#pass").mousedown(function () { drag.state = false; $("#pass").focus() }); //$("#LogOutBtn").mousedown(function () { // drag.state = false; // return false; //}); $(document).ready(function () { $("#LogOutBtn").click(function () { $.ajax({ type: "POST", url: "sMaster.Master/LogoutBtnClick", data: "{}", contentType: "application/json; charset=utf-8", dataType: "json", }); }); }); ldiv.mousedown(function (e) { if (!drag.state == true) { drag.y = e.pageY; drag.state = true; } return false; }); $(document).mousemove(function (e) { if (drag.state == true) { delta.y = e.pageY - drag.y; var cur_offset = $("#loginDiv").offset(); if (ldiv.cssNumber("top") + $("#loginP").cssNumber("padding-top") + delta.y &gt; -40 &amp;&amp; ldiv.cssNumber("top") + $("#loginP").cssNumber("padding-top") + $("#loginP").cssNumber("height") + delta.y + 60 &lt; $(window).height()) { if ($(window).width() &gt;= 1305) { $("#loginDiv").offset({ top: (cur_offset.top + delta.y) }); drag.y = e.pageY; } } } }); $(document).mouseup(function () { drag.state = false; }); $("#user").mousedown(function () { drag.state = false; $("#user").focus() }); $("#pass").mousedown(function () { drag.state = false; $("#pass").focus() }); </code></pre> <p>and there is also this part of the jQuery code that moves the loginDiv when the window is too small:</p> <pre><code> $(document).ready(function () { var dLeft = $("#greenPart").width(); dLeft += ($(window).width() - $("#greenPart").width()) / 2; dLeft += 10; $("#loginDiv").css("marginLeft", dLeft); var he = $(window).height() * 2; $("#loginDiv").css({ "height": he + "px" }); he = -($(window).height()); $("#loginDiv").css({ "top": he + "px" }); he = $(window).height(); $("#loginP").css({ "padding-top": he + "px" }); if ($(window).width() &lt; 1305) { $("#loginDiv").offset({ top: 10 }); $("#loginDiv").css({ "height": 120 + "px" }); $("#loginP").css({ "padding-top": 0 + "px" }); var dLeft = $("#greenPart").width(); dLeft += ($(window).width() - $("#greenPart").width()) / 2; dLeft -= (20 + $("#loginP").width()); $("#loginDiv").css("marginLeft", dLeft - 100); $("#lines").height("20px"); $("#lines").width("100px"); $("#bottomDiv").css("marginLeft", 165); $("#bottomDiv").css("marginTop", -90); $("#bottomDiv").css("width", 70); $("#hello").css("font-weight", "bold"); $("#hello").css("color", "White"); } return false; }); $(window).resize(function () { var dLeft = $("#greenPart").width(); dLeft += ($(window).width() - $("#greenPart").width()) / 2; dLeft += 10; $("#loginDiv").css("marginLeft", dLeft); var he = $(window).height() * 2; $("#loginDiv").css({ "height": he + "px" }); he = -($(window).height()); $("#loginDiv").css({ "top": he + "px" }); he = $(window).height(); $("#loginP").css({ "padding-top": he + "px" }); $("#bottomDiv").css("marginLeft", 0); $("#bottomDiv").css("marginTop", 0); $("#bottomDiv").css("width", 170); $("#hello").css("font-weight", "normal"); $("#hello").css("color", "Black"); $("#loginP").css("padding-left", 0); if ($(window).width() &lt; 1305) { $("#loginDiv").offset({ top: 10 }); $("#loginDiv").css({ "height": 120 + "px" }); $("#loginP").css({ "padding-top": 0 + "px" }); var dLeft = $("#greenPart").width(); dLeft += ($(window).width() - $("#greenPart").width()) / 2; dLeft -= (20 + $("#loginP").width()); $("#loginDiv").css("marginLeft", dLeft - 100); $("#lines").height("20px"); $("#lines").width("100px"); $("#bottomDiv").css("marginLeft", 165); $("#bottomDiv").css("marginTop", -90); $("#bottomDiv").css("width", 70); $("#loginDiv").css("paddingLeft", 0); if ($("#hello").length != 0) { $("#hello").css("font-weight", "bold"); $("#hello").css("color", "White"); $("#loginP").css("padding-left", 120); } } return false; }); </code></pre> <p>and the Asp.net part, the changeLoginDiv() changes the div and creates the problem:</p> <pre><code> protected void LoginBtnClick(object sender, EventArgs e) { string username = user.Text; string password = pass.Text; if (username != "" &amp;&amp; username != null) { if (password != "" &amp;&amp; password != null) { if (db.IsExist("SELECT * FROM users WHERE username='" + username + "'")) { if (db.IsExist("SELECT * FROM users WHERE [password]='" + password + "'")) { errorLabel.Text = "Loged in successfully."; if (rememberME.Checked == true) { Response.Cookies["userInfo"]["username"] = username; Response.Cookies["userInfo"]["lastVisit"] = DateTime.Now.ToString(); Response.Cookies["userInfo"].Expires = DateTime.Now.AddDays(365); } else { Session["username"] = username; } changeLoginDiv(); } else errorLabel.Text = "Wrong password."; } else errorLabel.Text = "The username doesn't exist. \n\n\nIf you don't have a user, please register."; } else errorLabel.Text = "Please enter a password"; } else errorLabel.Text = "Please enter a user name"; } protected void LogoutBtnClick(object sender, EventArgs e) { Session["username"] = ""; Response.Cookies["userifnfo"]["username"] = ""; Response.Redirect(Request.RawUrl); } protected void MyProfileBtnClick(object sender, EventArgs e) { } public void changeLoginDiv() { string sessionST = (string)Session["username"]; string cookiesST = (string)Request.Cookies["userifnfo"]["username"]; if ((sessionST != null &amp;&amp; sessionST != "")) { //loginP changes; string newHTML = "&lt;span id='hello' height='22px'&gt; Hello " + sessionST + "&lt;br /&gt;"; newHTML += "&lt;img id='lines' src='images/lines.png' /&gt;&lt;/span&gt;"; newHTML += "&lt;span&gt;&lt;input type='button' id='ProfileBtn' height='30px' width='40px' runat='server' class='buttonC' value='My Profile' onclick='MyProfileBtnClick' /&gt;&lt;br /&gt;"; newHTML += "&lt;input type='button' id='LogOutBtn' height='30px' width='40px' runat='server' Class='buttonC' value='Logout' onclick='LogoutBtnClick' /&gt;&lt;/span&gt;"; //newHTML += "&lt;asp:Button ID='LogOutBtn' Height='22px' Width='50px' runat='server' UseSubmitBehavior='false' CssClass='buttonC' Text='Logout' OnClick='LogoutBtnClick' /&gt;&lt;/span&gt;"; loginP.InnerHtml = newHTML; loginP.Attributes.Add("style", "text-align: center;"); } if ((cookiesST != null &amp;&amp; cookiesST != "")) { //loginP changes; string newHTML = "&lt;span height='22px'&gt; Hello " + cookiesST + "&lt;br /&gt;"; newHTML += "&lt;img id='lines' src='images/lines.png' /&gt;&lt;/span&gt;"; newHTML += "&lt;span&gt;&lt;input type='button' id='ProfileBtn' height='30px' width='40px' runat='server' class='buttonC' value='My Profile' onclick='MyProfileBtnClick' /&gt;&lt;br /&gt;"; newHTML += "&lt;input type='button' id='LogOutBtn' height='30px' width='40px' runat='server' Class='buttonC' value='Logout' onclick='LogoutBtnClick' /&gt;&lt;/span&gt;"; loginP.InnerHtml = newHTML; loginP.Attributes.Add("style", "text-align: center;"); } } </code></pre> <p>thanks =]</p> <p>PS. as you can see i also tried to use trigger the onclick event in jQuery with ajax and some other function:</p> <pre><code>//$("#LogOutBtn").mousedown(function () { // drag.state = false; // return false; //}); $(document).ready(function () { $("#LogOutBtn").click(function () { $.ajax({ type: "POST", url: "sMaster.Master/LogoutBtnClick", data: "{}", contentType: "application/json; charset=utf-8", dataType: "json", }); }); }); </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload