当前位置: 首页 > 面试题库 >

使用jQuery Ajax将JSON发送到PHP服务器-JSON错误

权烨磊
2023-03-14
问题内容

我的网页上的表单有问题。我正在尝试使用ajax和json将表单值发送到php服务器,但是我无法正确地创建json对象。

我的JS代码

function sendJsonOpenPopout () {
    $('.submitBtn').click(function(e){
        e.preventDefault();

        var subject = $('.subject').val();
        var email = $('.email').val();
        var message = $('.message').val();

        var dataObject = {
            subject: subject,
            email: email,
            message: message
        }

        $.ajax({
        type: 'POST',
        url: '../../kontakt.php',
        contentType: "application/json",
        dataType: 'json',
        data: dataObject,

        success: function(data){
             alert('Items added');
        },

        error: function(){
            console.log('You have fail');
        }

        //success: function(){
            //var createdDiv = '<div class="divToBeCentered"><p class="dataText">Wiadomość została wysłana pomyślnie.\brDziękuję za kontakt.</p></div>';
             //$('body').append(createdDiv);
         //}
    });
});

我的PHP代码

<?php 
    $str_json = file_get_contents('php://input'); //($_POST doesn't work here)
    $response = json_decode($str_json, true); // decoding received JSON to array
    $subject = $response[0];
    $from = $response[1];
    $message = $response[2];

    $to = "lubycha@gmail.com"; 
    $subject = $_POST['subject'];
    $from = $_POST['email'];
    $message = $_POST['message'];
    $headers = "Content-Type: text/html; charset=UTF-8"; 
    mail($to,$subject,$message,$headers);
?>

我知道已经问过类似的问题,但是答案并没有帮助我。

感谢您的帮助。


问题答案:

我能够获取json对象并在php端进行解析。某些变量的名称可能有所不同,部分原因是其中一些是预先编写的代码。这是我采取的步骤。

资料夹结构

js/script.js
php/get_data.php
index.html

Index.html 一种基本形式。

<div id="feedback_panel" class="panel panel-default">
    <form id="feedbackform" name="feedbackform" method="post">
            <div class="form-group" id="email_wrapper" data-toggle="popover" data-container="body" data-placement="right">
                <label class="control-label" for="email">E-mail:</label>
                <input type="email" class="form-control" id="email" name="email" placeholder="email@example.com" required>
                <span class="help-block"> </span>
            </div>
            <div class="form-group" id="subject_wrapper" data-toggle="popover" data-container="body" data-placement="right">
                <label class="control-label" for="subject">Subject:</label>
                <input type="text" class="form-control" id="subject" name="subject" placeholder="Subject" required>
                <span class="help-block"> </span>
            </div>
            <div class="form-group" id="description_wrapper" data-toggle="popover" data-container="body" data-placement="right">
                <label class="control-label" for="message">message:</label>
                <textarea type="text" class="form-control" id="message" name="message" placeholder="message." required></textarea>
                <span class="help-block"> </span>
            </div>
            <button type="submit" id="feedback_submit" class="btn btn-success">Submit</button>
    </form>
</div>

*提交时, *script.js 收集数据并将其设置为对象,然后通过ajax发送到php。

$(function() {
    // process the form
    $('#feedbackform').submit(function(event) {

        // get the form data - obj that will POSTED to get_data.php
        var formData = {
            'email'       : $('#email').val(),
            'subject'     : $('#subject').val(),
            'message'     : $('#message').val()
        };

        // process the forum
        $.ajax({
            type        : 'POST', // define the type of HTTP verb we want to use (POST for our form)
            url         : 'php/get_data.php', // the url where we want to POST
            data        : formData, // our data object
            dataType    : 'json', // what type of data do we expect back from the server
            encode      : true
        })
            // using the done promise callback
            .done(function(data) {
                // log data to the console so we can see
            if ( ! data.success) {
                console.log(data);
            } else {
                console.log(data);
            }

        });

        // stop the form from submitting the normal way and refreshing the page
        event.preventDefault();
    });

});

get_data.php 从script.js接收数据,进行一些验证,然后发送并发送电子邮件。

<?php

$errors         = array();      // array to hold validation errors
$data           = array();      // array to pass back data

// validate the variables ======================================================
    // if any of these variables don't exist, add an error to our $errors array

$email;
$subject;
$message;


//check to see if the data exist, else write an error message,
function check_data(){
    $user_inputs = array();

    if (empty($_POST['email'])){
        $errors['email'] = 'Email is required.';
        return false;
    }else{
        $email = $_POST['email'];
        array_push($user_inputs,$email);
    }

    if (empty($_POST['subject'])){
        $errors['subject'] = 'subject is required.';
        return false;
    }else{
        $subject = $_POST['subject'];
        array_push($user_inputs,$subject);
    }

    if (empty($_POST['message'])){
        $errors['message'] = 'message is required.';
        return false;
    }else{
        $message = $_POST['message'];
        array_push($user_inputs,$message);
    }

    return $user_inputs;
}

//getting array of data from check_data
$verify_data = check_data();


// return a response ===========================================================

// if there are any errors in our errors array, return a success boolean of false
if ( ! empty($errors)) {

    // if there are items in our errors array, return those errors
    $data['success'] = false;
    $data['errors']  = $errors;
    echo json_encode($data);
} else {
    // show a message of success and provide a true success variable
    $data['success'] = $verify_data;
    $data['message'] = 'Success!';

    //if everything is good, sent an email.
    if($verify_data != false){
        send_email($verify_data);
    }
}

function send_email($info_data){
    // person who it going
    $to      = 'Email, Some <some_email@mailinator.com>';

    //subject of the  email
    $subject = $info_data[1];
    $result = str_replace(' ', '&nbsp;', $info_data[2]);
    $result = nl2br($result);
    $result = wordwrap($result, 70, "\r\n");

    //body of the email.
    $message = "<html><body>";
    $message .= "<p style = 'width: 400px;'>" . $result . "</p>";
    $message .= "<br/>";
    $message .= "</body></html>";
    $headers = "From: Email, Some <some_email@mailinator.com>" . "\r\n" . 'Reply-To: '. $info_data[0] . "\r\n" ."X-Mailer: PHP/" . phpversion();
    $headers .= "MIME-Version: 1.0\r\n";
    $headers .= "Content-Type: text/html; charset=UTF-8";


    //sent mail: check to see if it was sent.
    if(mail($to, $subject, $message, $headers)){
        $data["went"] = "went";
        $data['message'] = 'Success!';
    }else{
        $data["went"] = "didn't go";
        $data['message'] = 'Sorry!';
    }

    // echo the log
    echo json_encode($data);

}

?>

有很多要掩饰的,如果您有任何问题,请告诉我。我很乐意回答。



 类似资料:
  • 问题内容: 最近5个小时,我一直在尝试将json对象发布到PHP脚本中。我已经阅读了所有文档,似乎代码应该可以,但事实并非如此。发出并接收到请求,但是我无法访问发布的json数据,甚至不知道它是否已正确发送。我不断得到一个空的php数组,而不是json数据。 这是php脚本(test.php) 我正在使用来自https://github.com/pokeb/asi-http- request.gi

  • 问题内容: 我目前正在尝试从Android应用程序向php服务器发送数据(两者均由我控制)。 应用程序中的表单上收集了很多数据,这些数据已写入数据库。所有这一切。 在我的主代码中,首先我创建一个JSONObject(在此示例中,我已在此处将其裁剪): 接下来,我将对象传递给发送对象,并接收响应: HTTPPoster类: 这将获得响应,但是服务器返回403-禁止响应。 我试过稍微更改doPost函

  • 问题内容: 我想以json格式向php发送一些数据,并在php中进行一些操作。我的问题是我无法通过Ajax将json数据发送到我的php文件。请帮助我该怎么做。我已经尝试过这种方式.. 在PHP中,我使用: 在php文件中添加print_r($ _ POST)时,它在firebug中显示array(0){}。 问题答案: 输了。您没有将JSON发送到服务器,而是发送了普通的POST查询(恰好包含J

  • 我正在尝试使用POST提交表单,但我有一些来自 标记的额外数据,这些数据已存储到JS对象中。当我从JavaScript中点击时,我想把它发送到服务器。 我尝试做的是用事件发送

  • 问题内容: 我正在尝试在本地网络上的Android应用程序与WampServer之间建立通信。 当我想从服务器读取数据时,我已经成功了,但是当我尝试将数据发送到服务器时却遇到了问题。 我正在使用服务来建立通信: } 和我的PHP文件: 当我运行我的应用程序时,没有任何内容添加到我的数据库中。我认为里面没有东西。 请告诉我我的代码有什么问题? 问题答案: 最后,我成功将JSONObject发送到服务

  • 问题内容: 我正在使用jQuery将JSON发布到Java服务器,但是我认为JSON一定是错误的。这是我的数据及其发送方式的示例: 我正在使用Wicket的AbstractAjaxBehavior接收数据,并希望获得一个我可以解析的JSON字符串。当我获得传递的参数的映射时,键集如下所示: 显然,我可以轻松获取名称和描述的值,但是我的项目数组的键弄乱了。我敢肯定这很简单,但是我似乎一直在解决这个问