提交表格并重新加载

Question

Currently I have a form with multi-select checkboxes. When submitted it posts to a PHP script with an array similar to: &id%5B%5D=3&id%5B%5D=7

HTML:

<form id="frm-example" action="vmwaressl_admin_process.php" method="POST">

The php script loops through the array and does a SQL update for each row that is selected. The script then uses the header() function to redirect back to the page.

PHP:

<?php
foreach ($_POST['id'] as $key => $idValue) {
    $host_id_sql = "query";
    $stmt        = sqlsrv_query($conn, $host_id_sql);
    if ($stmt === false) {
        die(print_r(sqlsrv_errors(), true));
    }
    while ($row = sqlsrv_fetch_array($stmt, SQLSRV_FETCH_ASSOC)) {
    $host_id = $row['HOST_ID'];

    }
    $host_update_sql = "update query";
    $stmt            = sqlsrv_query($conn, $host_update_sql);
    if ($stmt === false) {
        die(print_r(sqlsrv_errors(), true));
    }
    $host_id_sql = null;
    $stmt        = null;
}

header('Location: home_page.php');
?>

My question is about the page refresh. Is there any way to submit the form but not refresh the page? I'm thinking ajax but I'm not sure how to accomplish it.

Thanks.

Answer 1

Change your form tag to just :-

<form id="frm-example">

and add this in a script tag :-

$('#frm-example').on('submit', function (e) {
        if (!e.isDefaultPrevented()) {
            var url = "vmwaressl_admin_process.php";

            $.ajax({
                type: "POST",
                url: url,
                data: $(this).serialize(),
                success: function (data)
                {
                    //Whatever You want to do on success
                }
            });
            return false;
        }
    })