Wednesday, 18 September 2013

Don't refresh when typing jquery and coldfusion

Don't refresh when typing jquery and coldfusion

I have a simple page:
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$(function () {
$('#myform').on('submit', function (e) {
$.ajax({
type: 'post',
url: 'test2.cfm',
data: $('form').serialize(),
success: function () {
//alert('form was submitted');
$("#alldetails").load('details.cfm?randval='+ Math.random());
document.myform.tekst.value = "";
}
});
e.preventDefault();
});
});
</script>
</head>
<body>
<form id="myform" name="myform">
<input type="text" name="text"><br>
<input name="submit" type="submit" value="Submit">
</form>
<br>
<div id="alldetails">Loading</div>
<!--- stop when typing comment check and auto refresh --->
<script>
var isTyping = false;
$("#input-box").focus(function() {
isTyping = true;
});
$("#input-box").blur(function() {
isTyping = false;
});
$(document).ready(function() {
$("#alldetails").load("details.cfm");
$(document).ready(function() {
var refreshId = setInterval(function() {
if (!isTyping) {
$("#alldetails").load('details.cfm?randval='+ Math.random());
}}, 20000);
});
$.ajaxSetup({ cache: false });
});
</script>
</body>
</html>
the details are loaded in the div (allDetails) and that is working fine so
far. Now on my details.cfm page I'm showing the messages and people can
react on them. So far so good, but what I want to do is stop the
autorefresh when some is typing a comment. I have try this, see the
comment in the code above 'stop when typing and auto rerfesh'. Because the
comment input field is on the comment.cfm page, it is ignoring this
script.
Hope you understand the question.
Regards!
Edit:
the code of details.cfm:
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$(function () {
$('#testform').on('submit', function (e) {
$.ajax({
type: 'post',
url: 'save_comment.cfm',
data: $('form').serialize(),
success: function () {
alert('form was submitted');
}
});
e.preventDefault();
});
});
</script>
<cfquery datasource="#ns#" name="getdata">
select text, timeline_id
from timeline
order by t_datum desc
</cfquery>
<cfoutput query="getdata">
<p>#tekst#</p>
<cfform id="testform">
<cfinput type="hidden" value="#timeline_id#" name="timeline_id">
<cfinput type="text" name="comment#timeline_id#" id="input-box"><input
type="submit">
</cfform>
</cfoutput>

No comments:

Post a Comment