jQuery通过JSON提交数据后不显示响应答案

【问题标题】：jQuery does not show response after submitting data by JSONjQuery通过JSON提交数据后不显示响应
【发布时间】：2018-12-05 09:55:57
【问题描述】：

我在使用 JSON 提交数据时遇到 jQuery 显示响应的问题。

这是我的 HTML

<input required="" width="100%" name="category_id" id="category_id" 
class="form-control">

<input required="" width="100%" name="agent_id" id="agent_id" 
class="form-control">

<input required="" width="100%" name="year" id="year" 
class="form-control">

<button type="button" onclick="historyForm()" title="fetch history"> 
view</button>

<div id="ajax-content">
</div>

这是我的脚本

    <script type="text/javascript">
    function historyForm() {

    $.ajax({
        url: '<?php echo base_url();?>index.php?staff/fetch_history',
        method: 'POST',
        dataType: 'json',
        data: {
            category_id: $("#category_id").val(),
            agent_id: $("#agent_id").val(),
            year: $("#year").val(),
        },
        success: function (response) {
            jQuery('#ajax-content').html(response);
        }
    });
   }

  </script>

这是我的控制器

function fetch_history()
{
    $response = array();
    $category_id = $_POST["category_id"];
    $agent_id = $_POST["agent_id"];
    $year = $_POST["year"];
    $page_data['category_id']    =   $category_id;
    $page_data['agent_id']    =   $agent_id;
    $page_data['year']    =   $year;
    $response = $this->load->view('backend/staff/history_result' , 
 $page_data);
    echo json_encode($response);
}

我没有看到任何响应和任何错误，但是当我尝试手动编写 $page_data 时说 $year = '2018', $agent_id = 1 and $category_id = 2 我得到了响应。

可能是什么问题？

【问题讨论】：

如果用 javascript 编写会得到什么：console.log(response) in success 方法？
另外url 在ajax 中也可以吗？
@Snake，感谢您的评论。 console.log(response) 也不显示任何内容。
来自 ajax 的 url 正确吗？ $_POST[...] 给你正确的信息？
@Snakes，当我假设$year = '2018'、$category_id = 1 和$agent_id = 2 我得到了很好的回应。但是当我使用 JSON 提交结果时，什么都没有返回。

标签： jquery json ajax codeigniter

【解决方案1】：

您正在尝试通过 json 发送 HTML 页面...将 dataType 从 $.ajax 更改为：

$.ajax({
    url: '<?php echo base_url();?>index.php?staff/fetch_history',
    method: 'POST',
    dataType: 'html',  // here is the change
    data: {
        category_id: $("#category_id").val(),
        agent_id: $("#agent_id").val(),
        year: $("#year").val(),
    },
    success: function (response) {
        jQuery('#ajax-content').html(response);
    }
});

【讨论】：

谢谢@Snake，现在一切都很好。

【解决方案2】：

在您的控制器中尝试以下代码

function fetch_history()
{
    $response = array();
    $category_id = $_POST["category_id"];
    $agent_id = $_POST["agent_id"];
    $year = $_POST["year"];
    $page_data['category_id']    =   $category_id;
    $page_data['agent_id']    =   $agent_id;
    $page_data['year']    =   $year;
    $response = $this->load->view('backend/staff/history_result' , 
 $page_data);

    $newResponse = ['result'=>$response];

    echo json_encode($newResponse);
}

并使用

成功获取结果

response.result

检查是否有帮助..

【讨论】：

感谢您的回答，但 newResponse 也没有显示任何内容
能否在$response = $this->load->view('backend/staff/history_result' , $page_data) 中显示数据；
试试这个：1）从js中删除“dataType：'json'”并添加“response = $.parseJSON(response);”走向成功
我收到以下错误VM417:1 Uncaught SyntaxError: Unexpected token < in JSON at position 0 at Function.parse [as parseJSON] (<anonymous>) at Object.success (index.php?staff/history:999) at u (jquery.min.js:2) at Object.fireWith [as resolveWith] (jquery.min.js:2) at k (jquery.min.js:2) at XMLHttpRequest.<anonymous> (jquery.min.js:2)，更改为success: function (response) { response = $.parseJSON(response); console.log(response); jQuery('#ajax-content').html(response); }
你不能在 json 中发送 HTML ！

【解决方案3】：

您在页面视图中缺少 TRUE 作为第三个参数，因此它被直接输出而不是保存到 $response。

所以改变这一行

$response = $this->load->view('backend/staff/history_result',$page_data);

添加第三个参数TRUE，防止它直接输出到屏幕上，这将出现在您的响应中。

$response = $this->load->view('backend/staff/history_result',$page_data, TRUE);

【讨论】：