Question

我有用于发送短信的表单现在我将提交的数据发送到sms.php页面并执行该过程。现在我需要以表格的形式提交数据，而无需转到sms.php页面。它应该在表单页面本身通过使用ajax方法执行，但它也重定向到sms.php。我需要它完成，同一页面和获得的json响应应存储在数据库中。

我该怎么做？帮助我提前谢谢。

用于发送短信的表单：

   <form role="form" method="POST" action="sms.php">
        <div class="form-group row">
            <label class="col-sm-4 form-control-label">Select Date Range<span class="text-danger">*</span>
            </label>
            <div class="col-sm-7">
                <div class="input-daterange input-group" id="date-range">
                    <input type="text" class="form-control" name="start" />
                    <span class="input-group-addon bg-custom b-0">to</span>
                    <input type="text" class="form-control" name="end" />
                </div>
            </div>
        </div>
        <div class="form-group row">
            <label class="col-sm-4 form-control-label">Select Brand<span class="text-danger">*</span>
            </label>
            <div class="col-sm-7">
                <select class="form-control" name="brand" id="brand" required>
                    <option value="">Select Brand</option>
                    <option value="3">test1</option>
                    <option value="2">test2</option>
                    <option value="1">test3</option>
                </select>
            </div>

        </div>

        <div class="form-group row">
            <div class="col-sm-8 col-sm-offset-4">
                <input type="submit" class="btn btn-primary  btn-sm" value="Submit">
            </div>
        </div>
    </form>

用于发送数据的Ajax

$('sms').on('submit', function (e) {

          e.preventDefault();

          $.ajax({
            type: 'post',
            url: 'sms.php',
            data: $('form').serialize(),
            success: function () {
              alert('form was submitted');
            }
          });

        });

sms.php

<?php

    if(isset($_POST['submit'])){
       $senderid =$_POST['senderid'];
       // echo $senderid;
       $message = rawurlencode($_POST['message']);
       $mobile = isset($_POST['mobilenumber']) ? $_POST['mobilenumber'] : '';
       sendSMS($mobile,$message,$senderid);
    }

function sendSMS($mobile,$message,$senderid){

$user = "asdhaskbdjasdjbfjk";
$url = 'http://login.smsgatewayhub.com/api/mt/SendSMS?APIKey='.$user.'&senderid='.$senderid.'&channel=2&DCS=0&flashsms=0&number='.$mobile.'&text='.$message.'&route=16;';

$ch=curl_init($url);

curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
curl_setopt($ch,CURLOPT_POST,1);
curl_setopt($ch,CURLOPT_POSTFIELDS,"");
curl_setopt($ch, CURLOPT_RETURNTRANSFER,2);
$data = curl_exec($ch);
print($data); /* result of API call*/

}

?>

获得的回复：

{"ErrorCode":"000","ErrorMessage":"Success","JobId":"112591825","MessageData":[{"Number":"0123456789","MessageId":"mU9WfV6hLEyNAQQI63BzNw"}]}

Answer 1

jquery代码$('sms')中的选择器是错误的。要停止更改页面，您应该使用click事件并停止实际提交表单，如下所示：

$('.btn-sm').on('click', function (e) {
    e.preventDefault();
    $.ajax({
        type: 'post',
        url: 'sms.php',
        data: $('form').serialize(),
        success: function () {
          alert('form was submitted');
        }
    });
});

您可以从上面给出的代码段中看到，我使用了提交按钮的click事件，并在第一行写了e.preventDefault()，因此它会停止提交表单但是它只会发起ajax电话。因此，短信将被发送，您将在同一页面上。不会有重定向。

Answer 2

在您的代码中，我发现您在页面中添加了操作：

 <form role="form" method="POST" action="sms.php">

从表单删除 操作和发布，因为您已包含在脚本标记内

Ajax表单提交并存储响应数据？

2 个答案: