TypeError: r.teams is undefined - Codeigniter + jQuery Ajax + Aropupu Bracket library

TypeError: r.teams is undefined - Codeigniter + jQuery Ajax + Aropupu Bracket library

我在 jQuery 中使用 ajax 调用从服务器端获取变量以在 jQuery Bracket 库 (http://www.aropupu.fi/bracket/) 中使用,但是插件无法识别来自服务器的响应。如果我直接在 jquery 中使用结果,效果很好。

服务器端:

function sortear_atletas() {
        $competicao_id = $this->input->post('competicao_id');
        //Example
        $atletas = array("A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "L", "M", "N", "O", "P", "Q");

        if (!empty($competicao_id)) {
            $atletasx = null;

            $team = $this->sorteios->sortear_grelha($atletas);
            $atletasx.= '{"teams": [';
            foreach ($team as $key => $value) {
                $atletasx.= '["' . $value[0] . '","' . $value[1] . '"],';
            }
            $atletasx.= ']}';

            echo $atletasx;

        }
    }

客户端:

$("#gerar_grelha_inscritos_btn").on("click", function () {
                    $.ajax({
                        url: "<?php echo base_url(); ?>" + "competicoes/grelha_competicao/sortear_atletas",
                        data: {competicao_id: competicao_id},
                        type: "POST",
                        success: function (response) {
                            $('#minimal').bracket({
                                init: response
                            });

                        },
                        error: function (response) {
                            alert(response.Error);
                        }
                    });
                });

观点:

<div id="minimal" class="demo"></div>

错误:

类型错误:r.teams 未定义

在您的 ajax 请求中,您没有指定响应类型,例如 json、xml 等。类似地,在服务器端您回显一个字符串。而这个插件需要数组。

我在服务器端解决了这个问题:

header('Content-Type: application/json');
echo json_encode($atletasx);

在客户端:

$("#gerar_grelha_inscritos_btn").on("click", function () {
                    $.ajax({
                        url: "<?php echo base_url(); ?>" + "competicoes/grelha_competicao/sortear_atletas",
                        data: {competicao_id: competicao_id},
                        type: "POST",
                        contentType: "application/json",
                        datatype: "json",
                        success: function (response) {
                            alert(response);
                            var atletas = response;
                            alert(atletas);
                            $('#minimal').bracket({
                                init: {"teams": atletas}
                            });

                        },
                        error: function (response) {
                            alert(response.Error);
                        }
                    });
                });