使用Jquery时无法读取数据库，Ajax提交表单而不刷新页面

Posted 2023-05-09

【中文标题】使用Jquery时无法读取数据库，Ajax提交表单而不刷新页面

【英文标题】：Cannot read the database when using Jquery, Ajax to submit the form without refreshing the page

【发布时间】：2021-04-28 05:36:24

【问题描述】：

在不刷新页面的情况下提交表单时无法读取数据库。直接用php直接返回也没关系。但无法从数据库中读取。我在这个主题上搜索了很多。但我找不到解决方案。作为初学者，我在这里向所有专家寻求帮助。

这是js代码：

$(document).ready(function()   
    $("#createGuestForm").submit(function(event)
        submitForm();
        return false;       
        
    );
);

function submitForm()
     $.ajax(
        type: "POST",
        url: "individual_orders.php",
        cache:false,
        data: $('form#createGuestForm').serialize(),
        success: function(response)
            $("#myAjax_one").html(response)
            $("#indivi_modal1").modal('show')
            $("#createGuestForm")[0].reset();
        ,
        error: function()
            alert("Error");
        
    );

    <form method="post" id = "createGuestForm" role="form">
      <div class="modal-body">
        <div class="alert alert-success result" id="myAjax_one"></div>
         <div class="form-inline">
                <input type="text" name="name" id="fname" tabindex="1" class="form-control my-1 mr-sm-1"
                       placeholder="name" value="" required>

                <input type="phone" name="phone" id="phone" tabindex="1" class="form-control my-1 mr-sm-1"
                       placeholder="TEL: [phone]" value="" required>
            </div>
            <div class="form-inline">
                <input type="text" name="username" id="username" tabindex="1" class="form-control my-2 mr-sm-1"
                       placeholder="Login-id" value="" readonly>

                 <label for="cityFormControlSelect1"></label>
                <select class="form-control form-control my-2 mr-sm-1" id="cityFormControlSelect1" name="city" required>
                    <option selected hidden value="">city...</option>
                    <option value="1">city1</option>

                </select>
            </div>                                
            <hr>
            <div class="form-group">
                <input type="email" name="email" id="register_email2" tabindex="3"
                       class="form-control" placeholder="Email" value="">
            </div>
            <div class="form-group">
                <input type="address" name="address" id="Address" tabindex="3"
                       class="form-control" placeholder="Мекен-жайы (Міндетті емес)" value="">
            </div> 
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="submit" class="btn btn-primary" name="register-submit" id="indi_save_btn1" form="createGuestForm">Save</button>
      </div>
      </form>

【问题讨论】：

你没有在这里关闭引号"individual_orders.php.关闭那个。另外，你在浏览器控制台中看到任何错误吗？

【参考方案1】：

您的 jQuery 代码有错误，请先纠正。

function submitForm()
     $.ajax(
        type: "POST",
        url: "individual_orders.php", //You have missed quates here....
        cache:false,
        data: $('form#createGuestForm').serialize(),
        success: function(response)
            $("#myAjax_one").html(response)
            $("#indivi_modal1").modal('show')
            $("#createGuestForm")[0].reset();
        ,
        error: function()
            alert("Error");
        
    );

【讨论】：

谢谢！虽然我纠正了你提到的错误（url: "individual_orders.php",），但问题并没有解决。