grasperstail Posted August 22, 2008 Share Posted August 22, 2008 So, I have a php/HTML form file. I validate the input in javascript. Once the validation is complete I want to send the HTML/CSS formatted form from the php file to the mail() function. I've loaded PEAR Mail_mime and am using that. I don't want to write the whole form out again. I would like to simply email the validated and formatted HTML already written. Any suggestions?Where can I go for instructions on this? Link to comment Share on other sites More sharing options...
Jesdisciple Posted August 22, 2008 Share Posted August 22, 2008 The only way I can think of is AJAX. Give your form an onsubmit that validates it and ultimately uses AJAX to submit the data to the server, then returns false. I actually happen to have a similar script from helping someone else, except it neither has validation nor submits the entire HTML. But I'm sure the validation and page submission can be tweaked into it (although I would remove, on the server side, the page's JS that's irrelevant to the email before sending). <html> <head> <title>Titled Document</title> <script type="text/javascript" language="javascript"><!-- function AjaxForm(form, display){ var that = this; this.form = typeof form == 'string' ? document.forms[form] : form; this.form.onsubmit = function (){ that[that.form.method.toLowerCase()](); return false; }; this.display = typeof display == 'string' ? document.getElementById(display) : display; } AjaxForm.prototype = { request: null, post: function(){ var that = this; this.request = null; var parameters = []; for(var i = 0; i < this.form.elements.length; i++){ var element = this.form.elements[i]; parameters.push(element.name + '=' + element.value); } parameters.push('ajax=true'); if (window.XMLHttpRequest) { // Mozilla, Safari,... this.request = new XMLHttpRequest(); if (this.request.overrideMimeType) { // set type accordingly to anticipated content type //http_request.overrideMimeType('text/xml'); this.request.overrideMimeType('text/html'); } } else if (window.ActiveXObject) { // IE try { this.request = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { this.request = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) {} } } if (!this.request) { alert('Cannot create XMLHTTP instance'); return false; } this.request.onreadystatechange = function () { if (that.request.readyState == 4) { if (that.request.status == 200) { var result = that.request.responseText; //alert(result); that.display.innerHTML = result; } else { alert('There was a problem with the request.'); } } }; parameters = parameters.join('&'); this.request.open('POST', this.form.action, true); this.request.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); this.request.setRequestHeader("Content-length", parameters.length); this.request.setRequestHeader("Connection", "close"); this.request.send(parameters); } }; window.onload = function(){ var form1 = new AjaxForm('addfriend', 'addfriend'); var form2 = new AjaxForm('addfavourite', 'addfavourite'); }; //--></script> </head> <body> <form action="addFriend.php" method="POST" name="addfriend" id="addfriend"> <input type="hidden" name="userID" id="userID" value="{me.id}"> <input type="hidden" name="friendID" id="friendID" value="{user.id}"> <input type="submit" name="submit" value="Add to friends" class="ajaxbutton"> </form> <form action="addFavourite.php" method="POST" name="addfavourite" id="addfavourite"> <input type="hidden" name="userID" id="userID" value="{me.id}"> <input type="hidden" name="friendID" id="friendID" value="{user.id}"> <input type="submit" name="submit" value="Add to favorites" class="ajaxbutton"> </form> </body></html> Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.