JavaScript / DHTML / AJAX RSS JavaScript / DHTML / AJAX RSS

Javascript problem in Ajax

Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
Thread Solved
1 2

•
•
Join Date: Nov 2009
Posts: 7
Reputation: manofspider is an unknown quantity at this point 
Solved Threads: 0
manofspider manofspider is offline Offline
Newbie Poster

Javascript problem in Ajax

 
0
  #1
22 Days Ago
clienthint.js
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. var xmlhttp;
  2. var parameters="";
  3.  
  4. function showHint(url) {
  5.  
  6. 	var myform = document.forms[0];
  7. 	if (myform != undefined) {
  8. 		parameters = getRequestBody(myform);
  9. 	}
  10.  
  11. 	if (url.length == 0) {
  12. 		document.getElementById("txtHint").innerHTML = "";
  13. 		return;
  14. 	}
  15. 	xmlhttp = GetXmlHttpObject();
  16. 	if (xmlhttp == null) {
  17. 		alert("Your browser does not support XMLHTTP!");
  18. 		return;
  19. 	}
  20.  
  21. 	xmlhttp.onreadystatechange = stateChanged;
  22. 	xmlhttp.open("POST", url, true);
  23.  
  24. 	xmlhttp.send(parameters);
  25.  
  26. }
  27.  
  28. function stateChanged() {
  29. 	if (xmlhttp.readyState == 4) {
  30. 		document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
  31. 	}
  32. }
  33.  
  34. function GetXmlHttpObject() {
  35. 	if (window.XMLHttpRequest) {
  36. 		// code for IE7+, Firefox, Chrome, Opera, Safari
  37. 		return new XMLHttpRequest();
  38. 	}
  39. 	if (window.ActiveXObject) {
  40. 		// code for IE6, IE5
  41. 		return new ActiveXObject("Microsoft.XMLHTTP");
  42. 	}
  43. 	return null;
  44. }
  45.  
  46. function getRequestBody(oForm) {
  47.     var aParams = new Array();
  48.  
  49.     for (var i=0 ; i < oForm.elements.length; i++) {
  50.         var sParam = encodeURIComponent(oForm.elements[i].name);
  51.         sParam += "=";
  52.         sParam += encodeURIComponent(oForm.elements[i].value);
  53.         aParams.push(sParam);
  54.     }
  55.  
  56.     return aParams.join("&") + "&sid=" + Math.random();
  57. }

test.jsp
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. this is test.jsp <br>
  2.  
  3. <script>
  4.  
  5. 	function myfunc1() {
  6. 		alert("button click");	
  7. 	}
  8.  
  9.  
  10. </script>
  11.  
  12. <input name="mybutton" value="Click to Alert" type="button" onclick="myfunc1();">

index.jsp

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. <html>
  2. <head>
  3.  
  4. 	<script src="clienthint.js"></script>	
  5.  
  6. </head>
  7. <body>
  8.  
  9. Test Ajax <br><br>
  10.  
  11. <input type="button" value="test.jsp" onclick="showHint('test.jsp');"/> 
  12. <hr/>
  13.  
  14. <div id="txtHint" style="background:gray;height:200px;"></div>
  15.  
  16. </body>
  17. </html>

Test Flow 1:

. When open page test.jsp directly
. Click on button "Click to Alert"
. Message "button click" appears

Test Flow 2:

. When open page index.jsp
. Click on button "test.jsp"
. Contents of DIV appears (contents of test.jsp)

Question (on Test Flow 2):

1. When Click on button "Click to Alert" at DIV section, but the message "button click" doesn't appears ?
2. Why JavaScript on test.jsp doesn't work ?
3. Is this JavaScript problem through Ajax ?
4. By keeping the function myfunc1() in test.jsp, how to make this function myfunc1() worked at side of index.jsp page?


Thanks in advance!
Reply With Quote Quick reply to this message  
•
•
Join Date: Sep 2009
Posts: 45
Reputation: chandru7 is an unknown quantity at this point 
Solved Threads: 8
chandru7 chandru7 is offline Offline
Light Poster
 
0
  #2
22 Days Ago
just put one debugger and check its executing or not
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. function myfunc1() {	
  2. debugger;
  3. alert("button click");		}
Chandru
SilverlightScripting.com
Reply With Quote Quick reply to this message  
•
•
Join Date: Nov 2009
Posts: 7
Reputation: manofspider is an unknown quantity at this point 
Solved Threads: 0
manofspider manofspider is offline Offline
Newbie Poster
 
0
  #3
18 Days Ago
With or without the statement debugger, we still the same result:

Error: myfunc1 is not defined (at the Error Console)
Reply With Quote Quick reply to this message  
•
•
Join Date: May 2009
Posts: 71
Reputation: Alxandr is an unknown quantity at this point 
Solved Threads: 9
Alxandr's Avatar
Alxandr Alxandr is offline Offline
Junior Poster in Training
 
0
  #4
17 Days Ago
At clienthint.js, before line 30, try adding: alert(xmlhttp.responseText);
Reply With Quote Quick reply to this message  
•
•
Join Date: Nov 2009
Posts: 7
Reputation: manofspider is an unknown quantity at this point 
Solved Threads: 0
manofspider manofspider is offline Offline
Newbie Poster
 
0
  #5
15 Days Ago
All done:

. alert(xmlhttp.responseText);
. Or alert innerHTML of div (all contents of test.jsp)
Reply With Quote Quick reply to this message  
•
•
Join Date: May 2009
Posts: 71
Reputation: Alxandr is an unknown quantity at this point 
Solved Threads: 9
Alxandr's Avatar
Alxandr Alxandr is offline Offline
Junior Poster in Training
 
0
  #6
13 Days Ago
So when you do alert(xmlhttp.responseText) you get the script-tags as well? Then try this:
JavaScript Syntax (Toggle Plain Text) 
  1. function evalScript(html, div)
  2. {
  3.     var script = '';
  4.     var newHtml = html.replace(/<script[^>]*>([\s\S]*?)<\/script>/gi, function() {
  5.          scripts += arguments[1] + '\n'; return '';
  6.     });
  7.     div.innerHTML = newHtml;
  8.     eval(scripts);
  9. }
Last edited by Alxandr; 13 Days Ago at 1:28 pm.
Reply With Quote Quick reply to this message  
•
•
Join Date: Nov 2009
Posts: 7
Reputation: manofspider is an unknown quantity at this point 
Solved Threads: 0
manofspider manofspider is offline Offline
Newbie Poster
 
0
  #7
11 Days Ago
Yes , alert(xmlhttp.responseText) will get the script-tags as well.

But I don't how to test with your function ? how to place and use it in my examples above?
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. var script = ''; // or var scripts = ''; ?
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. arguments[1] // what is it ?
Last edited by manofspider; 11 Days Ago at 12:15 am.
Reply With Quote Quick reply to this message  
•
•
Join Date: May 2009
Posts: 71
Reputation: Alxandr is an unknown quantity at this point 
Solved Threads: 9
Alxandr's Avatar
Alxandr Alxandr is offline Offline
Junior Poster in Training
 
0
  #8
11 Days Ago
•
•
•
•
Originally Posted by manofspider View Post
clienthint.js
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. function stateChanged() {
  2. 	if (xmlhttp.readyState == 4) {
  3. 		document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
  4. 	}
  5. }
This is your stateChanged-function. What I suggest is that you replace it's content (inside the if) with
JavaScript Syntax (Toggle Plain Text) 
  1. evalScript(xmlhttp.responseText, document.getElementById('txtHint'));
•
•
•
•
Originally Posted by Alxandr View Post
JavaScript Syntax (Toggle Plain Text) 
  1. function evalScript(html, div)
  2. {
  3.     var script = '';
  4.     var newHtml = html.replace(/<script[^>]*>([\s\S]*?)<\/script>/gi, function() {
  5.          scripts += arguments[1] + '\n'; return '';
  6.     });
  7.     div.innerHTML = newHtml;
  8.     eval(scripts);
  9. }
What this function does is to strip the html of script-tags, then it takes the leftover html and insert it into div, and last it evaluates (run) the scripts.
•
•
•
•
Originally Posted by manofspider View Post
Yes , alert(xmlhttp.responseText) will get the script-tags as well.

But I don't how to test with your function ? how to place and use it in my examples above?
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. var script = ''; // or var scripts = ''; ?
Variable-names has no effect on the execution of JavaScript as long as they're named legally.
•
•
•
•
Originally Posted by manofspider View Post
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. arguments[1] // what is it ?
If you don't understand that I suggest you look up JavaScript, because it's something you as a webdeveloper should know. This line only mean the second argument of the function, but it's probably a good idea to get a understanding about how functions work in JavaScript.

HTH
Reply With Quote Quick reply to this message  
•
•
Join Date: Nov 2009
Posts: 7
Reputation: manofspider is an unknown quantity at this point 
Solved Threads: 0
manofspider manofspider is offline Offline
Newbie Poster
 
0
  #9
10 Days Ago
update state-Changed function:

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. function stateChanged() {
  2.  
  3. 	if (xmlhttp.readyState == 4) {
  4.  
  5. 		//document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
  6. 		evalScript(xmlhttp.responseText, document.getElementById('txtHint'));
  7.  
  8. 	}
  9.  
  10. }


Add new function:

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. function evalScript(html, div)
  2.  
  3. {
  4.  
  5. 	alert('html : ' + '\n' + html);
  6.  
  7. 	var scripts = '';
  8.  
  9. 	var newHtml = html.replace(/<script[^>]*>([\s\S]*?)<\/script>/gi, function() {
  10.  
  11. 		scripts += arguments[1] + '\n'; return '';
  12.  
  13. 	});
  14.  
  15.  
  16. 	alert('newHtml : ' + '\n' + newHtml);
  17. 	alert('scripts : ' + '\n' + scripts);
  18.  
  19. 	div.innerHTML = newHtml;
  20.  
  21. 	alert('div.innerHTML : ' + '\n' + div.innerHTML);
  22.  
  23. 	eval(scripts);
  24.  
  25. }

debug: alert('html : ' + '\n' + html);

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. html :   
  2.       this is test.jsp <br>
  3.  
  4.       <script>
  5.  
  6.       function myfunc1() {
  7.  
  8.       alert("button click");
  9.  
  10.       }
  11.  
  12.       </script>
  13.  
  14.       <input name="mybutton" value="Click to Alert" type="button" onclick="myfunc1();">

debug: alert('newHtml : ' + '\n' + newHtml);

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. newHtml :    
  2.       this is test.jsp <br>
  3.  
  4.  
  5.       <input name="mybutton" value="Click to Alert" type="button" onclick="myfunc1();">

debug: alert('scripts : ' + '\n' + scripts);

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. scripts : 
  2.       <script>
  3.  
  4.       function myfunc1() {
  5.  
  6.       alert("button click");
  7.  
  8.       }
  9.  
  10.       </script>

debug: alert('div.innerHTML : ' + '\n' + div.innerHTML);

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. div.innerHTML :    
  2.       this is test.jsp <br>
  3.  
  4.  
  5.       <input name="mybutton" value="Click to Alert" onclick="myfunc1();" type="button" >

Test Flow:
1. Click on 'Click to Alert'
2. Not work -> Error Console ( Error: myfunc1 is not defined )
Reply With Quote Quick reply to this message  
•
•
Join Date: May 2009
Posts: 71
Reputation: Alxandr is an unknown quantity at this point 
Solved Threads: 9
Alxandr's Avatar
Alxandr Alxandr is offline Offline
Junior Poster in Training
 
0
  #10
10 Days Ago
•
•
•
•
Originally Posted by manofspider View Post
debug: alert('scripts : ' + '\n' + scripts);

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. scripts : 
  2.       <script>
  3.  
  4.       function myfunc1() {
  5.  
  6.       alert("button click");
  7.  
  8.       }
  9.  
  10.       </script>
The error lies here. The script-tags should be gone, only the content should be left. When you run eval on you're script-variable it'll fail, therefore myfunc1 is never created. But I can't find the error in your code...

Just to make shure I didn't mistype something; here is a direct copy of working code:

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
  1. var newHtml = html.replace(/<script[^>]*>([\s\S]*?)<\/script>/gi, function() {
  2.     script += arguments[1];
  3.     return '';
  4. });

Somewhere in that line there has to be an error, though I can't find it, but this one is working for me (just tested it). If that doesn't work I'm afraid I don't know how to help you, because as said it's working here (I even tried with your html).

HTH
Reply With Quote Quick reply to this message  
Reply
1 2

Tags
•
•
•
•
Tags
ajax, javascript, problem

Quick Reply to Thread
This thread has been marked solved.
Perhaps start a new thread instead?
•
•
•
•
•
•
•
•
Message:
•
•
•
•



Similar Threads
Other Threads in the JavaScript / DHTML / AJAX Forum
Thread Tools Search this Thread



.net adobe adobeacrobat ajax alphafive amf android api array asp asp.net avg beta box browser bug bugs c# c++ cart class close code codebox codeinjection codes compatible createrange() css database debugger dependent developer development dom eclipse element error explorer external findcontrol firefox flash glitch google gui hiddenvalue highlightedword html ie8 iframe images internet java javascript jquery jsf jsp listbox masterpage math method microsoft mosaic mouse mp4 msdn news office pdf php post practice preview print problem processor python registry ruby runtime scroll security shopping size software sql sticky stop subdomain text textfield threads treeview validation vista w3c web zend zeroday
About Us | Contact Us | Advertise | DaniWeb | Acceptable Use Policy | RSS Feed

©2003 - 2009 DaniWeb® LLC