Page 1 of 1
Adding to a div (and AJAX)
Posted: Sat Mar 01, 2008 7:36 pm
by toasty2
I'm trying to make it so that I can type things in and it will add them to a div, but it isn't working.
Code: Select all
<html><head> <script language="JavaScript"> function addto() { var cmd = document.getElementById('cmd').value; var el = document.getElementById('shell'); el.innerHTML = el.innerHTML + cmd; } </script></head><body onload="document.forms.cmdform.cmd.focus()"> <div style="width:100%;" name="shell"> </div><hr /><form name="cmdform">><input type="text" name="cmd" onUnfocus="addto('shell');" size="120" /><input type="submit" value="Enter" /></form></body></html>
Re: Adding to a div
Posted: Sat Mar 01, 2008 9:10 pm
by Chalks
I had this same issue. Here's how I solved it:
Code: Select all
<script type="text/JavaScript">var ray1 = new Array();var ray2 = new Array();var currloc = 0; function gennew(length){ currloc = genrand(length); if(ray1[currloc]) { document.getElementById('display1').innerHTML = ray1[currloc]; document.getElementById('display2').innerHTML = ray2[currloc]; document.getElementById('show').style.visibility = 'visible'; document.getElementById('wordsleft').innerHTML = ray1.length + " words left"; } else { document.getElementById('display1').innerHTML = "All data tested! Click 'Return' or 'Reset'."; document.getElementById('show').style.visibility = 'hidden'; document.getElementById('wordsleft').innerHTML = "0 words left"; } document.getElementById('display2').style.visibility = 'hidden'; document.getElementById('right').style.visibility = 'hidden'; document.getElementById('wrong').style.visibility = 'hidden';} //more stuff</script></head><body onload="gennew(ray1.length); boring();"> <div id="content"> <div id="wordsleft"></div><div id="display1"></div><div id="display2" style="visibility: hidden;"></div> <div id="show"><input type="button" value="Show" onclick="show()" /></div><div id="wrong"><input type="button" value="Wrong" onclick="wrong()" /></div><div id="right"><input type="button" value="Right" onclick="right()" /></div> </div></body></html>
If you want to see the full script you can look at
http://spanish.chalksdesign.com/vocab then click either the challenge button, or the study button... then view source. I can't give you a direct link because I programmed it so you have to submit a form to get there.
Edit: read your post more carefully. I don't think we had _exactly_ the same issue, but this should help.
Re: Adding to a div
Posted: Sat Mar 01, 2008 9:17 pm
by toasty2
I seem to have fixed it. I've added some AJAX and now I've got another problem. It reloads the page when I submit the form.
Code: Select all
<html><head> <title>rrshell</title> <style type="text/css"> body {background:black;color:white;font-family:courier new;} </style> <script language="JavaScript"> function cmd() { var cmd = document.getElementById('cmd').value; var url = '/shell.php?cmd=' + cmd; if (document.getElementById) { var x = (window.ActiveXObject) ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest(); } if (x) { x.onreadystatechange = function() { if (x.readyState == 4 && x.status == 200) { el = document.getElementById(id); el.innerHTML = el.innerHTML + '<br />' + x.responseText; } } x.open("GET", url, true); x.send(null); } } </script></head><body onload="document.forms.cmdform.cmd.focus()"><div style="width:100%;height:400px;border:0;color:white;" name="shell" id="shell"></div><hr /><form name="cmdform" onSubmit="cmd();return false;"><span style="padding:2px;border:1px solid white;">><input type="text" name="cmd" id="cmd" style="border:0;color:white;background:black;font-family:courier new;" size="75" /></span><br /><br /><input type="submit" value="Enter" /></form></body></html>
If you're curious, this is part of a PHP AJAX shell I'm trying to make.
Re: Adding to a div (and AJAX)
Posted: Sun Mar 02, 2008 8:59 pm
by toasty2
Basically, my problem is that I need something to happen when the form is "submitted" without it reloading the page. The form also has to be submittable by pressing enter.