Amran
Amran

Reputation: 657

jQuery .submit() - No Response

I am Unable to submit a form using jQuery .submit() function. On my website, I have:

  1. index.php
  2. view-detail.php
  3. form-process.php

On index.php page, is a list of records that user can click to view full details of the records.

The view-detail.php page show the record details and also a form if user want to update the status approval.

form-process.php will be the form processing for update record

Codes

index.php

<script>
    jQuery(document).ready(function($){     
        function myForm(e){
            e.preventDefault();
            var data = $(this).serialize();
            alert(data);
            $.ajax({
                type: "POST",
                url: 'form-process.php',
                data: data,
                success: function(response) {
                    alert("success");
                    console.log(response);
                },
                error: function() {
                    alert('Error Submitting');
                }
            })
        }

        $(".view_detail").click(function(e){
            e.preventDefault();
            url = $(this).attr('href');

            $.get(url, function(data){
                $("#section").html(data);
                $("form").submit(myForm);    
            });
        });

    });
</script>

<div id="section"> 
   <!-- records from db and link to view full detail -->
   <a href="view-detail.php?id='.$permohonan_id.'" class="view_detail">View</a>
</div> 

view-detail.php

<form id="myForm" name="kelulusan" action="<?php echo 'form-process.php'; ?>" method="post">
    <div class="sokongan">
        <input type="radio" name="kelulusan" id="dp" value="Dalam Proses"> Dalam Proses<br>
        <input type="radio" name="kelulusan" id="ll" value="Lulus"> Lulus<br>
        <input type="radio" name="kelulusan" id="tl" value="Tidak Lulus"> Tidak Lulus 
    </div>
    <p><input type="hidden" name="pid"  value="<?php echo $pid;?>"></p>
    <input type="submit" name="submit"  value="Submit"> 
</form>

form-process.php

<?php
if(isset($_POST['kelulusan'])){
    $status = $_POST['kelulusan'];
    echo "Update : $status ";
}
// validate and update database query
?>

When I click on the submit button, there is response from the form. May I know why and how to resolve it?

Upvotes: 2

Views: 262

Answers (1)

Louys Patrice Bessette
Louys Patrice Bessette

Reputation: 33933

Since you don't want to submit the form using the "normal" form behavior, you better use a button.
It can be as simple as this:

<input type="button" onclick="myForm();">

Or you can use an event handler and an id like this:

<input type="button" id="SubmitTheForm">

$("#SubmitTheForm").on("click",function(){
  myForm();
});

Then, It is true that preventDefault() will be useless.
It is, if you use a submit button.

Upvotes: 2

Related Questions