Question

我尝试接收Ajax响应，但响应为空。

我的HTML看起来像这样

<form method="post" action="<?php $_SERVER['PHP_SELF'] ?>">
        <select class="form-control" class="form-control" id="choose_country">
                            <option value="">Select a prefered language</option>
                            <option value="en">EN</option>
                            <option value="fr">FR</option>
                            <option value="de">DE</option>
                            <option value="nl">NL</option>
                        </select>
                        </form>


<div id="table_load"></div>  <!-- loads search table -->

我的Javascript看起来像这样

    <script>
    $('#table_load').load('<?php echo base_url(); ?>admin/manage_article/search');

          $("#choose_country").change(function(){
            var choose_country = $("#choose_country").val();
            $.ajax({
            url: "<?php echo base_url(); ?>admin/manage_article/search",
            type: "post",
            data: {choose_country: choose_country},
            dataType: 'json',
            async: false,
            success: function (response) {
                if(response.success == true){
alert('success');
            $('#table_load').load('<?php echo base_url(); ?>admin/manage_article/search');
                }else{
                    alert('fail');
                    }
            },
            });
          });
    </script>

我的控制器看起来像这样

public function search(){   

            $choose_language = $this->input->post('choose_country');    

            $this->load->view('admin/manage_article/search');

        }
    }

我想将选择框的值传递给控制器并返回页面中的选定值$ this-＆gt; load-＆gt; view（'admin / manage_article / search'）;

我已尝试过上述代码，但响应警告“失败”。

如果编码中有任何错误，我是ajax的新手，请原谅我。

Answer 1

在控制器中试试这个

public function search() {
    $choose_language = $this->input->post('choose_country');
    $result = ($choose_language) ? true : false;
    $this->output->set_content_type('application/json')->set_output(json_encode(array('choose_country' => $choose_language, 'result' => $result)));
}

你的jquery将如下

<script type="text/javascript">
    $(document).ready(function() {
        $("#choose_country").change(function() {
            var choose_country = $("#choose_country").val();
            $.ajax({
                url: "<?php echo base_url(); ?>admin/manage_article/search",
                type: "post",
                data: {
                    choose_country: choose_country
                },
                dataType: 'json',
                async: false,
                success: function(response) {
                    if (response.result) {
                        alert('success');
                        $('#table_load').html(response.choose_country);
                    } else {
                        alert('fail');
                    }
                },
            });
        });
    });
</script>

我不知道你为什么使用ajax，你可能在控制器中有业务逻辑，你没有显示。如果没有，那么您只需在table_load中加载choose_country的值，如下所示。

<script type="text/javascript">
    $(document).ready(function() {
        $("#choose_country").change(function() {
            var choose_country = $("#choose_country").val();
            $('#table_load').text(choose_country);
        });
    });
</script>

Answer 2

没有理由对服务器进行两次调用 - 一次用于ajax调用，然后再次加载html。

要通过AJAX将html返回并加载到浏览器中，请在javascript中执行此操作。

$("#choose_country").change(function () {
    var choose_country = $("#choose_country").val();
    $.ajax({
        url: "<?php echo base_url('admin/manage_article/search'); ?>",
        type: "post",
        data: {choose_country: choose_country},
        dataType: 'html', 
        // Forcing synchronous strongly discouraged, 
        // as it can cause the browser to become unresponsive.
        //async: false, 
        success: function (response) {
            $('#table_load').html(response);
        },
        error: function(xhr, textStatus, errorThrown){
            console.log(textStatus, errorThrown);
        }
    });
});

您的控制器将以您在问题中显示它的方式工作，除了我没有看到使用发布的var的位置，因此您可能无法获得您想要的语言特定的HTML（如果这是您正在尝试的做）。

如果您确实觉得需要让返回包含一个名为result的属性，您可以使用if (response.result) {...进行检查，那么您需要对parth对您的问题的回答进行修改。您可以在控制器中将html添加到返回的json中。

public function search()
{
    //What do you do with this?
    //You don't show how this is used so I'm mostly going to ignore it.
    $choose_language = $this->input->post('choose_country');

    $result = !empty($choose_language) ? true : false;

    ///get the view file as a string of html markup
    $html = $this->load->view('admin/manage_article/search', NULL, TRUE);
    $out = array('result' => $result, 'html' => $html);
    $this->output
        ->set_content_type('application/json')
        ->set_status_header('200')
        ->set_output(json_encode($out));
}

然后你的success功能会像这样

success: function(response) {
    if (response.result === true) {
        alert('success');
        $('#table_load').html(response.html);
    } else {
        alert('fail');

如何在Codeigniter中通过ajax获取post值

2 个答案: