Submitting a PHP form from JavaScript -

-

i have html file, javascript file , php file. javascript used validate user input , pass form php page.

the validation function working great, form not submit javascript php file.

after spending 2 days on this, still can not figure out have wrong , why javascript not submit form data php file , how php page appear after submitting

html:

<div class = "formtext"> <p> <form id = "formtext" name="survey" method="post" action="formtext.php"> <table id="surveytable" width="300" border="1"> <tr> <td>     name:          <input type = "text" id="username"  name="name" onkeyup="document.getelementbyid('mirror').innerhtml=this.value" />     <br/ >     name: <span id="mirror"></span> </td> </tr>  <tr> <td>     number:          <input type = "text" id="usernumber"  name="number" onkeyup="document.getelementbyid('mirror1').innerhtml=this.value" />     <br />     number: <span id="mirror1"></span> </td> </tr>  <tr> <td>     email:          <input type = "text" id="useremail"  name="email" onkeyup="document.getelementbyid('mirror2').innerhtml=this.value" />     <br />     email: <span id="mirror2"></span> </td> </tr>  <tr> <td>     gender:<br />     <input type="radio" name="gen" id="usergender" value="decline" checked/> decline<br />         <input type="radio" name="gen" id="usergender" value="male" />male<br />         <input type="radio" name="gen" id="usergender" value="female" /> female  <tr> <td>     major:         <select name="major" id="usermajor">     <option value="" selected="selected">select major</option>         <option value="computer science">computer science</option>         <option value="information technology">information technology</option>         <option value="engineering">engineering</option>         <option value="biology">biology</option>     <option value="other">other</option>         </select> </td> </tr>  <tr> <td>     hobbies:<br />          <input name="hob" id="userhobby" type="checkbox" value="running,  " + " " />running<br />          <input name="hob" id="userhobby" type="checkbox" value="sleeping,  " + " "/>sleeping<br />     <input name="hob" id="userhobby" type="checkbox" value="fishing,  " + " "/>fishing<br />     <input name="hob" id="userhobby" type="checkbox" value="other" />other </td> </tr> </table>         <p>         <input type="button" value="enter" onclick="survey()"/>     </p>     </form>      </div> </form>

javascript:

function survey() { if (!validateform()) {         return false; }   else { var username = document.forms[0].name.value+"<br />";  var usernumber = document.forms[0].number.value+"<br />";  var useremail= document.forms[0].email.value+"<br />";  var sex;   if (document.forms[0].gen[0].checked)     sex=document.forms[0].gen[0].value;   else if (document.forms[0].gen[1].checked)     sex=document.forms[0].gen[1].value;   else if (document.forms[0].gen[2].checked)     sex=document.forms[0].gen[2].value;  var usergender = sex+"<br />";  var usermajor = document.forms[0].major.value+"<br />";   var hobby=new array() var counter=0;    (i=0;i<document.forms[0].hob.length;i++)   {     if (document.forms[0].hob[i].checked)     {         hobby[counter]=document.forms[0].hob[i].value;         counter++;     }    }  var hobpick=""; (n=0;n<hobby.length;n++)     hobpick+=hobby[n];  var userhobby = hobpick;  document.getelementbyid("printname").innerhtml = username document.getelementbyid("printnumber").innerhtml = usernumber document.getelementbyid("printemail").innerhtml = useremail document.getelementbyid("printgender").innerhtml = usergender document.getelementbyid("printmajor").innerhtml = usermajor document.getelementbyid("printhobby").innerhtml = userhobby   document.getelementbyid('formtext').submit(); } }  function validateform()  {  if (document.forms[0].name.value.length === 0)  { alert("name required");      return false;  }  else if (document.forms[0].number.value.length === 0)  { alert("number required");      return false; }  else if (document.forms[0].email.value.length === 0)  { alert("email required");      return false; }  else if (document.forms[0].usermajor.value === "") {     alert("major required");          return false; }  else if (document.forms[0].userhobby[0].checked === false &&  document.forms[0].userhobby[1].checked=== false && document.forms[0].userhobby[2].checked === false && document.forms[0].userhobby[3].checked === false) {     alert("hobby required");          return false; } else {    return true; } }

php:

<table id='userinputtbl' width='600' border='1'>  <tr>  <td id='tblname' colspan='6'>  <strong>you submitted: </strong><br /> </td> </tr>  <tr> <td><strong>name:</strong><br /> </td> <td> <?echo $_post["printname"]?></td> </tr>  <tr> <td><strong>number:</strong><br /></td> <td> <?echo $_post['printnumber']?></td> </tr>  <tr> <td><strong>email:</strong><br /></td> <td> <?echo $_post['printemail']?></td> </tr>  <tr> <td><strong>gender:</strong><br /></td> <td> <? echo $_post['printgender']?></td> </tr>  <tr> <td><strong>major:</strong><br /></td> <td> <? echo $_post['printmajor']?></td> </tr>  <tr> <td><strong>hobbies:</strong><br /></td> <td> <? echo $_post['printhobby']?></td> </tr>  </table>

your problem lies in part:

document.getelementbyid("printname").innerhtml = username document.getelementbyid("printnumber").innerhtml = usernumber document.getelementbyid("printemail").innerhtml = useremail document.getelementbyid("printgender").innerhtml = usergender document.getelementbyid("printmajor").innerhtml = usermajor document.getelementbyid("printhobby").innerhtml = userhobby

no such ids exist! way , id should unique means 1 element should have userhobby id.

<td>     hobbies:<br />          <input name="hob" id="userhobby" type="checkbox" value="running,  " + " " />running<br />          <input name="hob" id="userhobby" type="checkbox" value="sleeping,  " + " "/>sleeping<br />     <input name="hob" id="userhobby" type="checkbox" value="fishing,  " + " "/>fishing<br />     <input name="hob" id="userhobby" type="checkbox" value="other" />other </td>

Comments

Post a Comment

Popular posts from this blog

c# - How Configure Devart dotConnect for SQLite Code First? -

-
can configure following sample code ? when run following code, error : no entity framework provider found ado.net provider invariant name 'devart.data.sqlite' setting in machine.config <system.data> <dbproviderfactories> <add name="dotconnect sqlite" invariant="devart.data.sqlite" description="devart dotconnect sqlite" type="devart.data.sqlite.sqliteproviderfactory, devart.data.sqlite, version=4.6.287.0, culture=neutral, publickeytoken=09af7300eec23701" /> </dbproviderfactories> </system.data> after add below block code in app.config <?xml version="1.0"?> <configuration>   <configsections> <!-- more information on entity framework configuration, visit http://go.microsoft.com/fwlink/?linkid=237468 --> <section name="entityframework" type="system.data.entity.internal.configfile.entityframeworksection, entit...
Read more

java - Copying object fields -

-
what best way of copying classes when need have 2 independent variables? have simple class: public class myclass { boolean = false; string b= "not empty"; } do need make method : assign(myclass data ) { a= data.a; b= data.b; } is there automatic method copy (duplicate) objects in java? do need make method : pretty close. instead of making method, should make constructor. such constructors called copy constructor , , create them this: myclass(myclass data) { = data.a; b = data.b; } and create copy of instance, use constructor this: myclass obj1 = new myclass(); myclass obj2 = new myclass(obj1); copy constructor can tedious : using copy constructor create deep-copy can tedious, when class has mutable fields. in case, assignment create copy of reference, , not object itself. have create copy of fields (if want deep copy). can go recursive. a better way create deep copy serialize , deserialize object. why not use clone()? ...
Read more

c++ - Clear the memory after returning a vector in a function -

-
i have function processes , stores lot of data in , returns results vector of class. amount of data stored in function tremendous , want clear storage memory of function after finished job. necessary (does function automatically clear memory) or should clear memory function? update: vector<customers> process(char* const *filename, vector<int> id) { vector<customers> list_of_customers; (perform actions) return list_of_customers; } variables defined locally within function automatically released @ end of function scope. destructors objects called, should free memory allocated objects (if objects coded correctly). example of such object std::vector . anything you've allocated new must have corresponding delete release storage. try avoid doing own allocation , use raii instead, i.e. containers or smart pointers.
Read more