请求的JSON解析因多个数据而失败

时间:2017-10-17 13:14:21

标签: javascript jquery json django

我被困:我试图使用AJAX提交django表单,但我找不到通过AJAX调用发送多个数据字段的方法。

$(document).ready(function() {
        $("#dental").click(function() {
            $.ajax({
                url: " ",
                type: "POST",
                dataType: "json",
                data: {
                    left:leftList,
                    right:rightList,
                    bottom:bottomList,
                    center:centerList,
                    top:topList,
                    csrfmiddlewaretoken: document.getElementsByName('csrfmiddlewaretoken')[0].value
                    },
                success : function(json) {
                    alert("Successfully sent the URL to Django");
                },

                 error: function(jqXHR, exception){
                    var msg = '';
                    if (jqXHR.status === 0) {
                        msg = 'Not connect.\n Verify Network.';
                    } else if (jqXHR.status == 404) {
                        msg = 'Requested page not found. [404]';
                    } else if (jqXHR.status == 500) {
                        msg = 'Internal Server Error [500].';
                    } else if (exception === 'parsererror') {
                        msg = 'Requested JSON parse failed.';
                    } else if (exception === 'timeout') {
                        msg = 'Time out error.';
                    } else if (exception === 'abort') {
                        msg = 'Ajax request aborted.';
                    } else {
                        msg = 'Uncaught Error.\n' + jqXHR.responseText;

                    }
                    $('#messages').html(msg);
                    console.log(msg);
                },
            });
        });
    });

它只显示Requested JSON parse failed.当我尝试单独显示时,leftList, rightList, bottomList, centerList的各个值都很好。

在我的AJAX调用中调用多个数据的正确语法是什么?

我使用this

格式化了数据

**更新1:**这些是我的样本变量值列表:

var topList = ["C11"]
   var rightList = ["L12", "L11"]
   var bottomList = ["R14", "R13", "R12", "R11"]
   var leftList = ["B13", "B12", "B11"]
   var centerList = ["T15", "T14", "T13", "T12", "T11"]

更新2 :以下是我用django调用HTML的方法:

<tr>
   {% with '48 47 46 45 44 43 42 41 31 32 33 34 35 36 37 38' as list_lower %}
   {% for y in list_lower.split %}
   <td>
      <svg width="50" height="50" >
         <ellipse onClick="centerArea(this.id)" id="centerArea_C{{ y }}"  name="centerArea_{{ y }}"   class="ngipon" />
         <path onClick="leftArea(this.id)" id="leftArea_L{{ y }}"  name="leftArea_{{ y }}" class="ngipon/>
         <path onClick="topArea(this.id)" id="topArea_T{{ y }}" name="topArea_{{ y }}" class="ngipon"/>
         <path onClick="bottomArea(this.id)" id="bottomArea_B{{ y }}" name="bottomArea_{{ y }}" class="ngipon"/>
         <path onClick="rightArea(this.id)" id="rightArea_R{{ y }}" name="rightArea_{{ y }}" class="ngipon" />
      </svg>
   </td>
   {% endfor %}
</tr>
<tr>

单击svg的对象时,将调用与其位置对应的js函数。下面是单击toArea的示例。按下时,这个想法与其他区域相同。

function topArea(object) {
    var ngipon4 = object.slice(8, 11);
    console.log(ngipon4);
    var property = document.getElementById(object);
    if (property.style.fill == orange) {
        property.style.fill = filled;
        counter+=1;
        for (i = 0; i < counter; i++) {
            topList.push(ngipon4);  //add items in centerList
        }
        //remove duplicate item in array
        topList = topList.filter( function( item, index, inputArray ) { return inputArray.indexOf(item) == index; });
    }
    else property.style.fill = orange;
}

当我查看我的Google网络检查器时,会显示解析错误。

0 个答案:

没有答案