Menu
My below code is working fine when used in HTML. The same code I tried to place it inside a form and it stopped working. How to fix this issue?
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script src="jquery-1.7.1.min.js" ></script>
<title>Chat scroll test</title>
<style type="text/css">
#chat
{
width: 200px;
height: 200px;
border: 1px solid black;
overflow-y: auto;
}
</style>
<script>
jQuery(document).ready(function ($) {
monitor = function () {
var $this = $(this),
wrap = $this.find('.wrapper'),
height = $this.height(),
maxScroll = wrap.height() - height,
top = $this.scrollTop();
if (maxScroll === top) {
$this.addClass('atBottom');
} else {
$this.removeClass('atBottom');
}
}
window.setInterval(function () {
monitor.call($('#chat').get(0));
}, 350);
$('#chat').bind('addMessage', function (e, message) {
var $this = $(this),
top = $this.scrollTop(),
scroll = $this.hasClass('atBottom');
$this.find('.wrapper').append(message);
if (scroll) {
var wrap = $this.find('.wrapper'),
height = $this.height(),
maxScroll = wrap.height() - height
$this.scrollTop(maxScroll);
}
})
$('button').click(function () {
$('#chat').trigger('addMessage', 'asdgagasdg<br/>');
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="chat">
<div class="wrapper">
adsgasgda<br/>
adsgasg<br/>
asd<br/>
adsgasgda<br/>
adsgasg<br/>
adsgasgda<br/>
adsgasg<br/>
adsgasgda<br/>
adsgasg<br/>
adsgasgda<br/>
adsgasg<br/>
adsgasgda<br/>
adsgasg<br/>
adsgasgda<br/>
adsgasg<br/>
</div>
</div>
<button>Add a line</button>
</form>
</body>
</html>
When form tag is removed it again starts back to work.
254
For .NET 4.0 add ClientIDMode Static for tags to appear on client side the sameway they appear on server side.
Something like
<form id="form1" runat="server" ClientIDMode="Static">
For old .net use '<%= Control.ClientID %>' in your jQuery/Javascript code whenever you are refering to a control
Something like
'<%= form1.ClientID %>'
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
