0

I am Having an HTML Form which is having more than 20 Fields that needs to be saved every 15 seconds. Currently I have given a submit button to save the data at the End. Is there a way to perform this operation (Form Submission) automatically Every 15 Seconds and show a message to the user mentioning "Data Saved Automatically" ?

Current form (Simplified with Few fields) 

//function to send the form data
$("#mainFrm").submit(function (e) {

 e.preventDefault(); // avoid to execute the actual submit of the form.

 var form = $(this);
 var url = form.attr('action');

 $.ajax({
  type: "POST",
  url: url,
  data: form.serialize(), // serializes the form's elements.
  success: function (data) {
   alert(data); // show response from the php script.
  }
 });


});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="mainFrm" type="POST" action="myFile.php">

    <input id="cusname" type="text" name="cusname" placeholder="Customer Name"  required />
    <br/>
    
    <input id="address" type="text" name="address" placeholder="Customer Address"  required />
    <br/>
    
    <input id="Branch Name" type="text" name="brName" placeholder="Branch Address"  required />
    <br/>
    
    <label for="name">Who Presently Occupies*</label>
    <select id="occupies" name="occupies" required>
        <option value="Owner">Owner</option>
        <option value="Tenent">Tenent</option>
        <option value="Owner & Tenent">Owner & Tenent</option>
    </select>
    <br/>
    
    <label for="name">Description of Area * </label>
    <select id="desarea" name="desarea" required>
        <option value="Urban">Urban</option>
        <option value="Rural">Rural</option>
        <option value="Residential">Residential</option>
        <option value="Residential">Industrial</option>
        <option value="Residential">Agricultural</option>
        
    </select>
    
    <button type="submit" href="/">Save</button>
    
</form>
cs-87
  • 186
  • 1
  • 6
  • 18
  • 1
    Does this answer your question? [Periodically autosave form](https://stackoverflow.com/questions/5804528/periodically-autosave-form) – Juhil Somaiya Jan 21 '20 at 04:28
  • 1
    All you need to do is use window.setTimeout() once your user edits something that should be autosaved, and have that timeout call the javascript frameworks standard AJAX stuff – Jayshri Ghoniya Jan 21 '20 at 04:31

0 Answers0