Javascript does not work upon AJAX call -
i have page ajax call , loads entire page. page gets loaded has javascript. javascript works on page when loaded, when gets loaded ajax, javascript not work. dont know missing.
the code of loaded page
<html> <script type="text/javascript"> function showfield(name){ if(name=='lstbox')document.getelementbyid('div1').style.display="block"; else document.getelementbyid('div1').style.display="none"; } function hidefield() { document.getelementbyid('div1').style.display='none'; } </script> <head> </head> <body onload="hidefield()"> <form action = "test2.php" method = "post"> please enter name app <input type = "text" name = "name"> <table border = "1"><tr><th>choose label</th><th>choose element</th></tr> <tr><td><input type = "text" name = "label1" /></td> <td> <select name = "elementtype1" id="elementtype1" onchange="showfield(this.options[this.selectedindex].value)"> <option value = 'select'> select </option> <option value='txtbox'>text box</option> <option value='lstbox'>list box</option> <option value='chkbox'>check box</option> <option value='radio'>radio button</option> </select></td><td><div id="div1">enter listbox options: <input type="text" name="whatever1" /></div></td></tr> </table> <input type = "submit" value = "submit"> </form> </body> </html> the code of loading(ajax) page is
<html> <head> </head> <body> <script src="ajax.js" type="text/javascript"></script> <script src="responsehtml.js" type="text/javascript"></script> <div id="storage" style="display:none;"> </div> <div id="displayed"> <form name="ajax" method="post" action=""> <p> <input type="button" value="get panel" onclick="loadwholepage('appcreator.php')"> </p> </form> </div> </body> </html> the ajax.js code
function createxhr() { var request = false; try { request = new activexobject('msxml2.xmlhttp'); } catch (err2) { try { request = new activexobject('microsoft.xmlhttp'); } catch (err3) { try { request = new xmlhttprequest(); } catch (err1) { request = false; } } } return request; } the responsehtml.js code
function getbody(content) { test = content.tolowercase(); // eliminate case sensitivity var x = test.indexof("<body"); if(x == -1) return ""; x = test.indexof(">", x); if(x == -1) return ""; var y = test.lastindexof("</body>"); if(y == -1) y = test.lastindexof("</html>"); if(y == -1) y = content.length; // if no html grab till end return content.slice(x + 1, y); } /** loads html page put content of body tag current page. arguments: url of other html page load id of tag has hold content */ function loadhtml(url, fun, storage, param) { var xhr = createxhr(); xhr.onreadystatechange=function() { if(xhr.readystate == 4) { //if(xhr.status == 200) { storage.innerhtml = getbody(xhr.responsetext); fun(storage, param); } } }; xhr.open("get", url , true); xhr.send(null); } /** callback assign directly tag */ function processhtml(temp, target) { target.innerhtml = temp.innerhtml; } function loadwholepage(url) { var y = document.getelementbyid("storage"); var x = document.getelementbyid("displayed"); loadhtml(url, processhtml, x, y); } /** create responsehtml acces dom's methods */ function processbydom(responsehtml, target) { target.innerhtml = "extracted id:<br />"; // not work chrome/safari //var message = responsehtml.getelementsbytagname("div").nameditem("two").innerhtml; var message = responsehtml.getelementsbytagname("div").item(1).innerhtml; target.innerhtml += message; target.innerhtml += "<br />extracted name:<br />"; message = responsehtml.getelementsbytagname("form").item(0); target.innerhtml += message.dyn.value; } function accessbydom(url) { //var responsehtml = document.createelement("body"); // bad opera var responsehtml = document.getelementbyid("storage"); var y = document.getelementbyid("displayed"); loadhtml(url, processbydom, responsehtml, y); }
the script outside body tag, , loader picks out code inside body tag, script not part of add page.
Comments
Post a Comment