title: Form with star rating insert to mysql through ajax
body: <p>I'm developing a feedback app for a tablet with phonegap-android.
  On the main page I have a registration form and on the secondary page I have a star rating with six questions where the user must rate each question. I want to store the results in MySQL. My question is how could I connect the data from the pages because I want to know exactly what each person vote to make a report.</p>
  
  <p>First page looks aprox. like this:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt; 
  &lt;html&gt; 
      &lt;head&gt; 
          &lt;title&gt;Contact with Validation&lt;/title&gt; 
          &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt; 
          &lt;script type="text/javascript" src="js/jquery.js"&gt;&lt;/script&gt; 
          &lt;script type="text/javascript" src="js/jquery.validate.js"&gt;&lt;/script&gt; 
           &lt;script type="text/javascript" src="js/jquery.form.js"&gt;&lt;/script&gt; 
  
          &lt;script type="text/javascript"&gt;
              $('document').ready(function(){
  
              $('#form').validate({
                      rules:{
                          "name":{
                              required:true,
                              maxlength:40
                          },
  
                          "email":{
                              required:true,
                              email:true,
                              maxlength:100
                          },
  
                          "message":{
                              required:true
                          }},
  
                      messages:{
                          "name":{
                              required:"This field is required"
                          },
  
                          "email":{
                              required:"This field is required",
                              email:"Please enter a valid email address"
                          },
  
                          "message":{
                              required:"This field is required"
                          }},
  
                      submitHandler: function(form){
                        $(form).ajaxSubmit({
          target: '#preview', 
          success: function() { 
          $('#formbox').slideUp('fast'); 
          } 
      }); 
  
                      }
  
              })
  
          });
          &lt;/script&gt; 
  
  
          &lt;style type="text/css"&gt;
          ul
              {
                  list-style:none;
                  width:100%;
                  margin: 0;
                  padding: 0;
              }
              ul li
              {   
                  padding-top:5px;
                  padding-bottom:5px;
                  margin-bottom:10px;
                  clear:left;
                  position: relative;
  
              }
              ul li label
              {
                  width:20%;
                  display: block;
                  margin-right:2%;
                  text-align:left;
                  line-height:22px;
              }
              ul li span.error
              {
                  font: 11px arial;
                  color:red;
                  margin-left:8px;
                  line-height:22px;
              }
              ul li span.passerror
              {
                  display: block;
                  font: 11px arial;
                  color:red;
                  margin-left:8px;
                  line-height:22px;
              }
              ul li .shortfield{
                  width: 45px;
              }
  
           &lt;/style&gt; 
      &lt;/head&gt; 
      &lt;body&gt; 
      &lt;a href="http://9lessons.info"&gt;http://9lessons.info&lt;/a&gt;
         &lt;div id="preview"&gt;&lt;/div&gt;
          &lt;div id="formbox"&gt; 
              &lt;form name="form" id="form" action="submit.php" method="post"&gt;
                  &lt;ul id="ngothastyle3"&gt;
                      &lt;li&gt;
                          &lt;label&gt;Name&lt;/label&gt;
                          &lt;input type="text" name="name" class="" maxlength="40" /&gt;
                      &lt;/li&gt;
  
                      &lt;li&gt;
                          &lt;label&gt;Email&lt;/label&gt;
                          &lt;input type="text" name="email" class="" maxlength="100" /&gt;
                      &lt;/li&gt;
                      &lt;li&gt;
                          &lt;label&gt;Message&lt;/label&gt;
                          &lt;textarea name="message" rows="5" cols="45" class=""&gt;&lt;/textarea&gt;
                      &lt;/li&gt;
                      &lt;li&gt;
                          &lt;label&gt;&amp;nbsp;&lt;/label&gt;
                          &lt;input type="submit" value="Submit"&gt;
                      &lt;/li&gt;
                  &lt;/ul&gt;
  
              &lt;/form&gt;            &lt;/div&gt; 
  
  
  
  
  
  
      &lt;/body&gt; 
  
  &lt;/html&gt; 
  </code></pre>
  
  <p>And this is the second one with the star rating:</p>
  
  <pre><code>&lt;/head&gt;
  &lt;body&gt;
  &lt;div id="tab-Testing"&gt;
  
  &lt;script&gt;
  $(function(){
   $('#tab-Testing form').submit(function(){
    $('.test',this).html('');
    $('input',this).each(function(){
     if(this.checked) $('.test',this.form).append(''+this.name+': '+this.value+'&lt;br/&gt;');
          });
    return false;
   });
  });
  &lt;/script&gt;
  
  &lt;div class="Clear"&gt;&amp;nbsp;&lt;/div&gt;
  &lt;form id="form1"&gt;
  &lt;strong style='font-size:150%'&gt;Test 1&lt;/strong&gt; - A blank form
  &lt;table width="100%" cellspacing="10"&gt; &lt;tr&gt;
    &lt;td valign="top" width=""&gt;
     &lt;table width="100%"&gt;
      &lt;tr&gt;
       &lt;td valign="top" width="50%"&gt;
  &lt;div class="Clear"&gt;
  
      Intrebarea 1:bla bla bla
  
     &lt;input class="star required" type="radio" name="test-1-rating-1" value="1"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-1" value="2"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-1" value="3"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-1" value="4"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-1" value="5"/&gt;
     &lt;/div&gt;
     &lt;br/&gt;
     &lt;div class="Clear"&gt;
  
      Intrebarea 2:bla bla bla
  
      &lt;input class="star required" type="radio" name="test-1-rating-2" value="1"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-2" value="2"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-2" value="3"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-2" value="4"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-2" value="5"/&gt;
     &lt;/div&gt;
     &lt;br/&gt;
     &lt;div class="Clear"&gt;
  
          Intrebarea 3:bla bla bla
  
      &lt;input class="star required" type="radio" name="test-1-rating-3" value="1"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-3" value="2"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-3" value="3"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-3" value="4"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-3" value="5"/&gt;
     &lt;/div&gt;
   &lt;br&gt;
     &lt;div class="Clear"&gt;
  
          Intrebarea 4:bla bla bla
  
      &lt;input class="star required" type="radio" name="test-1-rating-4" value="1" title="Worst"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-4" value="2" title="Bad"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-4" value="3" title="OK"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-4" value="4" title="Good"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-4" value="5" title="Best"/&gt;
     &lt;/div&gt;
     &lt;br/&gt;
     &lt;div class="Clear"&gt;
  
          Intrebarea 5:bla bla bla
  
      &lt;input class="star required" type="radio" name="test-1-rating-5" value="1"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-5" value="2"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-5" value="3"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-5" value="4"/&gt;
      &lt;input class="star" type="radio" name="test-1-rating-5" value="5"/&gt;
     &lt;/div&gt;
     &lt;br/&gt;
     &lt;div class="Clear"&gt;
  
          Intrebarea 6:bla bla bla
  
      &lt;input class="star required" type="radio" name="test-1-rating-6" value="1" /&gt;
      &lt;input class="star" type="radio" name="test-1-rating-6" value="2" /&gt;
      &lt;input class="star" type="radio" name="test-1-rating-6" value="3" /&gt;
      &lt;input class="star" type="radio" name="test-1-rating-6" value="4" /&gt;
      &lt;input class="star" type="radio" name="test-1-rating-6" value="5" /&gt;
     &lt;/div&gt;
       &lt;/td&gt;
      &lt;/tr&gt;
     &lt;/table&gt;
    &lt;/td&gt;
    &lt;td valign="top" width="5"&gt;&amp;nbsp;&lt;/td&gt;  &lt;td valign="top" width="50"&gt;
     &lt;input type="submit" value="Submit scores!" /&gt;  &lt;/td&gt;
    &lt;td valign="top" width="5"&gt;&amp;nbsp;&lt;/td&gt;  &lt;td valign="top" width="160"&gt;
     &lt;u&gt;Test results&lt;/u&gt;:&lt;br/&gt;&lt;br/&gt;
     &lt;div class="test Smaller"&gt;
      &lt;span style="color:#FF0000"&gt;Results will be displayed here&lt;/span&gt;
     &lt;/div&gt;
    &lt;/td&gt;
   &lt;/tr&gt;
  &lt;/table&gt;
  &lt;/form&gt;
  
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>