mattd8752 Posted January 14, 2007 Share Posted January 14, 2007 I have a rather large script which I will attach. Basically the script writes to a notepad, and everytime onkeyup() is triggered from the text area, it is saved to the database. I would also like to add a save as button. I can code this button in php myself to make it change the name of the text file in the database, however I would like to make it so that when the button is clicked in the bottom box/div (the code is hosted at http://mattdsworld.theicy.net/note/form.html ) the top section which I would place in a div (the text area) turns into a screen where the user has to put in their info. Just a few fields. Possibly just 1 (the file name). I don't need help coding it. I do need help making clicking that button replace that text area with a form, and then being able to return to the same data. (reloading back to a new dataset). I have no idea how I would do this, but I am willing to learn if someone can tell me what to learn. I will upload all files except the php since there is no need for that.[attachment deleted by admin] Link to comment https://forums.phpfreaks.com/topic/34168-ajax-php-notepad-how-do-i/ Share on other sites More sharing options...
ScotDiddle Posted January 29, 2007 Share Posted January 29, 2007 mattd8752,I'm not sure if I understand exactly what you want, but I think what you want is to use <div> hide and show code.Below you will find your code modified to include a "Save" button. Also, I changed the onKeyUp to onBlur, so the data only gets sent once ( when the user is finished filling in the text area. )When the user hits the Save button, the current <div> is hidden by a small javascript, and the <textarea> data is sent off for AJAX processing. AJAX calls fillInTheBlanks.php, which is just a simple form I found on the net. The call to the PHP script also parrots back the user data from your <textarea> from the first page, and gives the user a chance to fill in some blanks... This will sit on top of your original ( now hidden ) <textarea> <div>. You can now save your data to your database. After the user fills in the blanks ( whatever input fields you want ) and hits Submit, you can output anything you want.Hope this is what you are looking for.If not, let me know and I can investigate further.Scot L. Diddle, Richmond VA AJAXForm.html:[code]<html><head><script type="text/javascript"><!--function toggleBox(szDivID, iState) // 1 visible, 0 hidden{ if(document.layers) //NN4+ { document.layers[szDivID].visibility = iState ? "show" : "hide"; } else if(document.getElementById) //gecko(NN6) + IE 5+ { var obj = document.getElementById(szDivID); obj.style.visibility = iState ? "visible" : "hidden"; } else if(document.all) // IE 4 { document.all[szDivID].style.visibility = iState ? "visible" : "hidden"; }}// --></script><script type="text/javascript" src="javascript/AJAXForm.js"></script></head><body> <div id="searchResults" style="width:295px; padding:5px; border:0px solid #000000"> <TEXTAREA name="q" cols="100" rows="25" id="q" type="text" id="q" onBlur="sendRequest(this.value);"> </TEXTAREA> The document has not been saved yet. <input type="button" onClick=" sendRequest(document.getElementById('q').value);" value="Save"> </div></body></html>[/code]AJAXForm.js [code] function createRequestObject() { var req; if(window.XMLHttpRequest){ // Firefox, Safari, Opera... req = new XMLHttpRequest(); } else if(window.ActiveXObject) { // Internet Explorer 5+ req = new ActiveXObject("Microsoft.XMLHTTP"); } else { // There is an error creating the object, // just as an old browser is being used. alert('Problem creating the XMLHttpRequest object'); } return req; } // Make the XMLHttpRequest object var http = createRequestObject(); function sendRequest(q) { // Open PHP script for requests http.open('get', 'fillInTheBlanks.php?content='+q+'&username=public&file=ad.txt&key=000001'); // http.open('get', 'explode.php'); http.onreadystatechange = handleResponse; http.send(null); } function handleResponse() { if(http.readyState == 4 && http.status == 200){ // Text returned FROM the PHP script var response = http.responseText; if(response) { // UPDATE ajaxTest content document.getElementById("searchResults").innerHTML = response; } } }[/code]fillInTheBlanks.php[code]<?php$Fname = $_POST["Fname"];$Lname = $_POST["Lname"];$gender = $_POST["gender"];$food = $_POST["food"];$quote = $_POST["quote"];$education = $_POST["education"];$TofD = $_POST["TofD"];if (!isset($_POST['submit'])) { // if page is not submitted to itself echo the form?><html><head><title>Personal INFO</title></head><body><div id="formArea"><form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>">First Name:<input type="text" size="12" maxlength="12" name="Fname">:<br />Last Name:<input type="text" size="12" maxlength="36" name="Lname">:<br />Gender::<br />Male:<input type="radio" value="Male" name="gender">:<br />Female:<input type="radio" value="Female" name="gender">:<br />Please choose type of residence::<br />Steak:<input type="checkbox" value="Steak" name="food[]">:<br />Pizza:<input type="checkbox" value="Pizza" name="food[]">:<br />Chicken:<input type="checkbox" value="Chicken" name="food[]">:<br /><textarea rows="5" cols="20" name="quote" wrap="physical">Enter your favorite quote!</textarea>:<br />Select a Level of Education:<br /><select name="education"><option value="Jr.High">Jr.High</option><option value="HighSchool">HighSchool</option><option value="College">College</option></select>:<br />Select your favorite time of day::<br /><select name="TofD" size="3"><option value="Morning">Morning</option><option value="Day">Day</option><option value="Night">Night</option></select>:<br /><input type="submit" value="submit" name="submit"><br /></form><br /><?php echo "<br /> \n"; echo "Here is what we got back from the AJAX Request: <br /><br /> \n";print_r($_GET);}else {echo "Hello, ".$Fname." ".$Lname.".<br />";echo "You are ".$gender.", and you like ";foreach ($food as $f) {echo $f."<br />";}echo "<i>".$quote."</i><br />";echo "You're favorite time is ".$TofD.", and you passed ".$education."!<br />";}?></div></body></html>[/code] Link to comment https://forums.phpfreaks.com/topic/34168-ajax-php-notepad-how-do-i/#findComment-172103 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.