在模态和更新页面中提交表单后更新值,无需重新加载

问题描述:

I will try to be as clear as I can.

I'm creating a simple example page where employee can review there age. On the page user have the choice to click on a button to change there age.

The page load the age from a use in a Database. So I select from the table employee the age matching the $name value.

<?php 

        $query = "SELECT * FROM employee";

        $rs = mysql_query($query);

        while ($row = mysql_fetch_assoc($rs)) {
            echo "Name " . $row['name'] . "<br/>Age " . $row['age'] . "<br/>";
        } 
    ?>

Under that I have a bootstrap modal button so the employee can click and update there age.

<div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">

                <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
                  <h4 class="modal-title" id="myModalLabel">Change your age</h4>
                </div>

                <div class="modal-body">

                    <?php
                    $name = "Mathieu";

                    $query = sprintf("SELECT age From employee Where name = '%s'", 
                    mysql_real_escape_string($name));

                    $rs = mysql_query($query);

                    while ($row = mysql_fetch_object($rs)) {
                        $age = $row->age;
                    }
                    ?>

                    <form action="update.php" method="post"class="form-inline">
                        <input class="form-control" id="disabledInput" type="text" placeholder="<?php echo $name; ?>" disabled>
                        <br/><br/>
                        <input type="text" class="form-control" placeholder="<?php echo $age; ?>" value="<?php echo $age; ?>">
                        <br/><br/>
                        <button type="submit" class="processing btn">Update</button>
                    </form>
                </div>

            </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
    </div>


    <div class="bs-example" style="padding-bottom: 24px;">
        <a data-toggle="modal" href="#myModal" class="btn btn-primary btn-large">Update your age</a>
    </div>

I have 2 problem. 1. What is the best way to update the value in my database then close the modal. 2. How do I refresh my page without a reload.

I did some trial and error but nothing work at all.

The best way for me to update the value from the database without reloading is that you should be using a Live Edit Using Jquery & ajax hope this helps.

use header("Location: index.php");