CODEWITHSUNDEEP
javascriptphpjqueryhtml
Varuna Lakshan
Varuna Lakshan

Reputation: 47

how to clear form after submit the form and pass the data to php file without reloading page

how to clear form after submit the form and pass the data to php file without reloading page...the form data is pass the php file and it stored the data base.but i was unable to clear the form data after submit the form.if i reset the form using javascrip but data not pass the data base.if i pass the data to php the form is not clear.is there a way for me achive both target?thank you.. here my snipt code...

<iframe name="votar" style="display:none;"></iframe>     
<form action="confirm.php" id="sfm" method="POST" target="votar">
<input type="text" placeholder="Name" name="name" value="" required/>
<input type="submit" value="Submit My Project " />
</form>

Upvotes: 0

Views: 446

Answers (6)

Jagjeet Singh
Jagjeet Singh

Reputation: 1572

You can do like this, first get form inputs value and then reset

You can also able to reset after success response

$(function () {
  $('form').on('submit', function (e) {
    e.preventDefault();
    var that = $(this);
    var params = that.serialize();
    that.get(0).reset();
    console.log(params);
    $.ajax({
      type: 'GET',
      url: 'submit.php',
      data: params,
      success: function (data) {
        console.log(data);
      }
    });
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="confirm.php" id="sfm" method="POST" target="votar">
  <input type="text" placeholder="Name" name="name" value="" required/>
  <input type="submit" value="Submit My Project " />
</form>

SERVER SIDE

<?php
 $name = $_GET['name'];
 echo 'success';
 exit();
?>

Upvotes: 0

Abu Bin Oalid
Abu Bin Oalid

Reputation: 31

you can try this

in index.php

  <html>
  <head>
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script>

      $(function () {
        $('form').on('submit', function (e) {
          e.preventDefault();
          $.ajax({
            type: 'get',
            url: 'ajax.php',
            data: $('form').serialize(),
            success: function (data) {
              $('#name').val('');
              alert('data');
              //your return value in data
            }
          });

        });

      });
    </script>
  </head>
  <body>
    <form action="ajax.php" id="sfm" method="POST" target="votar">
        <input type="text" placeholder="Name" name="name" id="name" value="" required/>
        <input type="submit" value="Submit My Project " />
    </form>
  </body>
</html>

and in ajax.php

<?php
$name = $_GET['name'];
//do what you want to do using name
echo "what you need to return";

Upvotes: 1

vishal melwani
vishal melwani

Reputation: 314

After getting success response you can clear form input

   $('#sfm').submit(function () {
   var form = $(this);
   $.ajax({
      url: 'phpfile.php',
      data: form.serialize(),
      type: "POST",
      success: function (data) {
        $('input[type="text"]').val('');
      }
   });
   return false;
 });

Upvotes: 0

parth parikh
parth parikh

Reputation: 33

Using AJAX you can do this.

$('#submitBtn').click(function () {
       $.ajax({
          url: 'confirm.php',
          data: $('#sfm').serialize(),
          type: "post",
          success: function (data) {
            $('input[type="text"]').val('');
          }
       });
       return false;
   });

Upvotes: 1

Exterminator
Exterminator

Reputation: 1246

try making $_POST array empty after submitting and saving the form

$_POST='';

Upvotes: 0

rtang92340801
rtang92340801

Reputation: 1

Have you thought about to use Ajax to handle the form submit?

Form submit with AJAX passing form data to PHP without page refresh

Upvotes: 0

Related Questions