Question

我有一个用于在HTML页面中进行客户注册的模式，在用户输入所有数据后我希望模式在表单提交后可用，并且只显示alert message它已成功添加，怎么能这样做了吗？

HTML页面

<div class="modal-body">
<form action="AddNCustomer.php" target="" method="post" enctype="multipart/form-data">
    <div class="row">
        <div class="col-sm-4">
            <label class="Modallabel">First Name:</label>
        </div>
        <div class="col-sm-8">
            <div class="input-group input-group-sm" style="margin-top: -5px;">
                <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
                <input id="FName" type="text" class="form-control ModalInput" name="FName" placeholder="First Name">
            </div><br>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-4">
            <label class="Modallabel">Last Name:</label>
        </div>
        <div class="col-sm-8">
            <div class="input-group input-group-sm" style="margin-top: -5px;">
                <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
                <input id="LName" type="text" class="form-control ModalInput" name="LName" placeholder="Last Name">
            </div><br>
        </div>
    </div>
      //rest of input fields go here....
    <div class="row">
        <button id="submit" name="submit" class="btn btn-success btn-md" style="margin:0;width: 75px;">Add</button>
    </div>
</form>

PHP页面

<?php
  include_once "connect.php";

if(isset($_POST['submit'])){
    $FName = $_POST['FName'];
    $LName = $_POST['LName'];
    $NName = $_POST['NName'];
    $FaceName = $_POST['FaceName'];
    $email = $_POST['email'];
    $BDate = $_POST['BDate'];
    $OName = $_POST['OName'];
    $CelfoneNumber = $_POST['CelfoneNumber'];
    $LandlineNumber = $_POST['LandlineNumber'];
    $Latitude = $_POST['Latitude'];
    $Longitude = $_POST['Longitude'];
    $c_image = $_FILES['fileUpload']['name'];
    $c_image_tmp = $_FILES['fileUpload']['tmp_name'];

    move_uploaded_file($c_image_tmp,"../CustomerImages/$c_image");
    //To check if the customer is already entered before
    $query="SELECT * from Customers where email_address_='".$_POST["email"]."'";
    $queryresult = $conn->query($query)->fetchAll(PDO::FETCH_ASSOC);

    if (count($queryresult) == 0)
    {
        //To get the largest customer id to add a new one
        $sql="SELECT MAX(Cust_id) as max FROM Customers";

        foreach ($conn->query($sql) as $row1)
        {
            $CustID=$row1['max'] + 1;
        } 

        //Inserting the customer details in table customer
        $stmt = "INSERT INTO Customers (first_name_,last_name_,nick_name_,facebook_name_,email_address_,birthdate_,name_of_organization_,celfone_no_,landline_no_,_delivery_location_1_coordinates__longitude,_delivery_location_1_coordinates__latitude,photo_,Cust_id) VALUES (:Fname,:Lname,:Nname,:Facename,:Email,:BDate,:Oname,:Cphone,:Lphone,:latvalue,:lngvalue,:Photo,:CustID)";

        $result=$conn->prepare($stmt);
        $result->bindparam(':Fname', $FName, PDO::PARAM_INT);
        $result->bindparam(':Lname', $LName, PDO::PARAM_INT);
        $result->bindparam(':Nname', $NName, PDO::PARAM_INT);
        $result->bindparam(':Facename', $FaceName, PDO::PARAM_INT);
        $result->bindparam(':Email', $email, PDO::PARAM_INT);
        $result->bindparam(':BDate', $BDate, PDO::PARAM_INT);
        $result->bindparam(':Oname', $OName, PDO::PARAM_INT);
        $result->bindparam(':Cphone', $CelfoneNumber, PDO::PARAM_INT);
        $result->bindparam(':Lphone', $LandlineNumber, PDO::PARAM_INT);
        $result->bindparam(':latvalue', $Latitude, PDO::PARAM_INT);
        $result->bindparam(':lngvalue',$Longitude, PDO::PARAM_INT);
        $result->bindparam(':Photo',$c_image, PDO::PARAM_INT);
        $result->bindparam(':CustID',$CustID, PDO::PARAM_INT);
        if($result->execute()) 
            { 
                echo "<script>alert('Account has been created successfully, Thanks!')</script>";                    
            } 
        else 
            { 
                echo "Failure!"; 
            }
    }
}
?>

Answer 1

看看=＆gt; http://getbootstrap.com/2.3.2/javascript.html#modals

使用

data-backdrop="static"

或

$("#yourModal").modal({"backdrop": "static"});

在你的链接上打开你的模态==＆gt;

<a href="#" onclick="$('#yourModal').modal({'backdrop': 'static'});" class="btn btn-primary">yourModal</a>

Edit2：

http://jsfiddle.net/BVmUL/39/

Answer 2

试试这个

$(document).ready(function(){
    $("#form-id").submit(function(){
        $("#modal-id").modal("hide");
    });
});

Answer 3

您可以序列化表单并通过ajax发送，如下所示：

$("#submit").click(function(){
    $.post('AddNCustomer.php', $('form').serialize())
    .done(function() {
        $("#myLabel").text("added successfully");
    });
)}

我希望它可以帮助你，再见。

表单提交后仍会显示模态

3 个答案: