Keep form input text on submit

I have a form which when filled in displays a quotation for the product on the same page. I need the first two text fields of the form to retain their values after the submit button is clicked.

This is the form

                                        <form id="myForm2" method="post" onsubmit="return false" > 
                                          <p class="white">HOW MANY YEARBOOKS DO YOU NEED?</p>
                                          <input  class="color4 center" style="font-size: 16px; " name="copies" id="copies" size="6"  /><br /><br />  
                                          

                                           
                                          <p class="white">HOW MANY PAGES IN EACH YEARBOOK?</p>
                                          <input  class="color4 center" style="font-size: 16px; " name="pages" id="pages" size="6" />
                                          
                                          
                                          <br /> <br />  
                                        <div class="funkyradio pt0 mt0 conditional"> 
                                              <p class="white pb0 mb0">PLEASE SELECT THE STYLE OF YEARBOOK YOU WANT</p>                                   
                                              <div class="funkyradio-default">
                                                  <input  type="radio" name="cover" id="radio1" value="soft" />
                                                  <label for="radio1">SOFTBACK</label>
                                              </div>
                                              <div class="funkyradio-default">
                                                  <input   type="radio" name="cover" id="radio2" value="hb" />
                                                  <label for="radio2">LEATHERETTE HARDBACK</label>
                                              </div>
                                              <div class="funkyradio-default">
                                                  <input type="radio" name="cover" id="radio3" value="hbdc" />
                                                  <label for="radio3">LEATHERETTE HARDBACK &amp; DUSTCOVER</label>
                                              </div>
                                              <div class="funkyradio-default">
                                                  <input type="radio" name="cover" id="radio4" value="hbprint" />
                                                  <label for="radio4">LAMINATED HARDBACK</label>
                                              </div>
                                        </div>
                                    </div>
                                    <div class="col-md-5">
                                            <div class="conditional p50" data-cond-option="cover" data-cond-value="soft" > 
                                                 <img  class="img-responsive"  src="images/yearbook-min.png" />
                                            </div>
                                            <div class="conditional p50" data-cond-option="cover" data-cond-value="hb"> 
                                                  <img class="img-responsive" src="images/yearbook-option3-min.png" />
                                            </div>
                                            <div class="conditional p50" data-cond-option="cover" data-cond-value="hbdc"> 
                                                  <img class="img-responsive" src="images/yearbook-option4-min.png" />
                                            </div>
                                            <div class="conditional p50" data-cond-option="cover" data-cond-value="hbprint"> 
                                                  <img class="img-responsive" src="images/yearbook-option2-min.png" />
                                            </div>  
                                    </div>
                          </div>
                          <input type="button" id="submitFormData" class="btn-orange p10 m10 ml0" style="font-weight: bold; border-radius: 10px;" 
                                onclick="SubmitFormData2();" value="SHOW MY QUOTE" />
                          </form>

When the submit button is clicked a function is called which collects the data and sends it to a page submit2.php
This is the function…


function SubmitFormData2() {
    var copies = $("#copies").val();
    var pages = $("#pages").val();
    var phone = $("#phone").val();
    var cover = $("input[type=radio]:checked").val();
    $.post("submit2.php", { copies: copies, pages: pages, phone: phone, cover: cover },
    function(data) {
	 $('#results2').html(data);
	 
	 $('#myForm2')[0].reset();
    });
    

}

The page submit2.php accesses a database with price tiers and using the data displays a quotation along with details of the order on the page next to the form.

Is there any way to keep input values in the first two text fields so that the user doesn’t need to refill these if looking for another quote?
Thanks in advance.

1 Like

Hi m_hutley I can’t view your reply, it only shows as a repeat of my question.

It’s an answer that requires recognition to see it as such.

Specifically, what does reset() do?

1 Like

I removed reset() and it made no difference.

It’s now working, must have been the server cache as this has been causing problems lately. Thanks for your help

2 Likes

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.