Sunday, 15 January 2012

javascript - Load content into div using ajax -



javascript - Load content into div using ajax -

i'm loading in content view_login.php index.php´s div id="display" using ajax javascript

var hr=new xmlhttprequest(); hr.open("get", 'view_login.php', true); hr.onreadystatechange = function(){ if(hr.readystate == 4 && hr.status == 200){ var return_data = hr.responsetext; document.getelementbyid('display').innerhtml = return_data; } } hr.send();

rather echo $output target div itself.

php/html

$output = ' <div id="visible"> <form> <input type="text" name="name"/> <input type="submit" /> </form> </div>'; echo $output;

is possible target div visible , contents instead of every ouput on page? without using jquery , plain/raw javascript.

there few ways of doing in plain javascript. 1 way append html document fragment, separate document, utilize queryselector on pull out div want.

demo

var frag = document.createdocumentfragment(); var div = document.createelement('div'); // create div contain html div.innerhtml = return_data; // insert html div frag.appendchild(div); // append div document fragment var visiblediv = frag.queryselector("#visible"); // find #visible div // append div main document document.getelementbyid('display').appendchild(visiblediv);

other options are:

domparser (supported ie9+). append div main document, you'll need create sure it's hidden view, div , remove it.

javascript php ajax html-parsing

No comments:

Post a Comment