Member_2_5230414
asked on
ajax and Protected Sub Submit_Click not working together
Hello i am using ajax to load data entered into a textbox but i also need to use a button onclick function to enter it into the database.... but the ajax works but the button onlick does not...
Its as if the button onlcik does not get exicuted due to the ajax.
Below is the code:
Its as if the button onlcik does not get exicuted due to the ajax.
Below is the code:
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="members_Default" %>
<!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">
<link href="../Styles/Site.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="../Scripts/jquery-1.4.1.js"></script>
<script type="text/javascript" >
$(function () {
$(".submit").click(function () {
var comment = $("#textbox").val();
var dataString = '&textbox=' + comment;
if (comment == '') {
alert('Please Give Valid Details');
}
else {
$("#flash").show();
$("#flash").fadeIn(400).html('<img src="ajax-loader.gif" />Loading Comment...');
$.ajax({
type: "POST",
url: "Default2.aspx",
data: dataString,
cache: false,
success: function (html) {
$("ol#update").append(html);
$("ol#update li:last").fadeIn("slow");
$("#flash").hide();
}
});
} return false;
});
});
// THIS IS THE JAVASCRIPT FOR THE TEXTBOX THAT EXPANDS ON CLICK!
$(document).ready(function() {
$("#button-box").hide();
$("#textbox").focus(function()
{
$("#textbox").animate({"height": "75px","width": "635px"}, "slow" );
$("#button-box").fadeIn("slow");
$(this).val('');
return false;
});
$("#close").click(function()
{
$("#textbox").animate({"height": "25px","width": "635px"}, "slow" );
$("#button-box").fadeOut("slow");
return false;
});
});
// This will count char within the textbox
$(document).ready(function () {
$("#textbox").keyup(function () {
var box = $(this).val();
var count = 140 - box.length;
if (count > 0) {
$('#count').html(count);
$(".submit").attr("disabled", false);
$('#count').css("color", "black");
}
else {
$('#count').html(+count);
$('#count').css("color", "red");
$(".submit").attr("disabled", true);
}
});
});
</script>
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div >
<br />
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<div id="profilenewsfeed"><div id="shoutinput" >
<asp:TextBox name="textbox" id="textbox" TextMode="MultiLine" runat="server"></asp:TextBox>
<div id="button-box">
<asp:Button Text="Submit" class="submit" type="submit" id="Submit" value="Submit" runat="server" />
<asp:Button Text="Close" class="button" type="submit" id="close" value="Cancel" runat="server" />
<div align="left" id="character-count">
<div id="count">140</div>
</div></div>
<div id="flash"></div>
<ol id="update" class="timeline">
</ol>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
</html>Partial Class members_Default
Inherits System.Web.UI.Page
Protected Sub Submit_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Submit.Click
Label1.Text = "hello"
End Sub
End Class<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default2.aspx.vb" Inherits="test_Default2" %>
<!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></title>
<link href="../Styles/Site.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<form id="form1" runat="server">
<div>
<li class="box">
<div class="shoutbox">
<div class="shoutbox-image"> <asp:Image ID="Image4" runat="server" ImageUrl="~/images/50profiles.jpg" /></div>
<div class="shoutbox-other">fuehu rufhuie hreuhv euihreuh trueiurehur ehureht urehuthruthruihtuirhtuirhtuirhtur hurhuriehg iruhruiehgfruei rueghruehurrg grrgrgreg</div>
<div class="shoutbox-reply">Like Reply <font colour="#5b5b5b" size="1pt">19min ago </FONT></div>
</div>
</li>
</div>
</form>
</body>
</html>
Nasir Razzaq
Add a "AutoPostBack=True" to button
ASKER
it does not have that option
Did you set a breakpoint in the code behind sub to see if its being called or not?
ASKER
no never and i dont understand why as code seems great to do it ... but will the ajax stop this?
No. Try setting a breakpoint on the handler and see if its beeing hit. What AJAX will do is that it will stop the page from doing a full post back and you wont see browser go white and then reload the page.
ASKER
yes it does not seem to even go to the handler... So wat will my option be now?
Change line 31 in your initial code from
} return false;
to
} return true;
} return false;
to
} return true;
ASKER
this then stops the javascript working but then steps through the buttonclick fine.
here is the website so you can see it in action http://runningprofiles.com/test/
here is the website so you can see it in action http://runningprofiles.com/test/
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.