如何通过ajax发送2个json数组到django中查看

时间:2016-05-14 17:31:30

标签: jquery python ajax django

我正在使用ajax将json数组传递给django中的视图。我的索引页左右分为2列,每列都有一些文本输入,我有一个“保存”按钮,将左侧和右侧的文本输入的所有值保存到db中。我创建了2个json数组来存储2列的值,然后通过ajax传递它们。但是在view.py中只收到了一个json数组。

这是我的代码ajax和view.py中的代码:

var jsonArrLeft = [];
var jsonArrRight = [];
$('#btnSave').on('click', function () {
    $('.form-group right').each(function () {
        debugger;
        value = $(this).find("input[name='ValueRight']").val()
        label = $(this).find("input[name='LabelRight']").val()
        jsonArrRight.push({
            label: label,
            value: value
        })
        var jsonRight = JSON.stringify(jsonArrRight);
        $.ajax({
            url: '{% url 'add_label_value' %}',
            method: 'POST',
            dataType: 'JSON',
            data: {
                'csrfmiddlewaretoken': $('input[name="csrfmiddlewaretoken"]').val(),
                'jsonRight ': jsonRight 
            },
            success: function (data) {
                alert(data);
            }
        });
    })
     $('.form-group left').each(function () {
        debugger;
        value = $(this).find("input[name='ValueLeft']").val()
        label = $(this).find("input[name='LabelLeft']").val()
        jsonArr.push({
            label: label,
            value: value
        })
        var jsonLeft = JSON.stringify(jsonArrLeft);
        $.ajax({
            url: '{% url 'add_label_value' %}',
            method: 'POST',
            dataType: 'JSON',
            data: {
                'csrfmiddlewaretoken': $('input[name="csrfmiddlewaretoken"]').val(),
                'jsonLeft ': jsonLeft 
            },
            success: function (data) {
                alert(data);
            }
        });
    })

})

这是我的view.py代码:

def add_label_value(request):
if request.method == 'POST':
try:
    if request.is_ajax():
        order_header = OrderHeader()
            jsonRight = json.loads(request.POST.get('jsonRight'))
            for x in jsonRight:
                order_header.label = x.label
                order_header.value = x.value
                order_header.position = 'right'
                order_header.save()
           jsonLeft = json.loads(request.POST.get('jsonLeft'))
            for y in jsonLeft:
                order_header.label = y.label
                order_header.value = y.value
                order_header.position = 'left'
                order_header.save()
except OSError as e:
    error = messages.add_message(request, messages.ERROR, e, extra_tags='add_label_value')
    html = '<p>This is not ajax</p>'
    return HttpResponse(html)

1 个答案:

答案 0 :(得分:0)

请在One ajax post请求中包含这两种情况并将其发送到您的视图。您在此处所犯的错误是您发送了两个不同的请求。

    var jsonArrLeft = [];
    var jsonArrRight = [];
    $('#btnSave').on('click', function () {
        $('.form-group right').each(function () {
            debugger;
            value = $(this).find("input[name='ValueRight']").val()
            label = $(this).find("input[name='LabelRight']").val()
            jsonArrRight.push({
                label: label,
                value: value
            })
        $('.form-group left').each(function () {
            value = $(this).find("input[name='ValueLeft']").val()
            label = $(this).find("input[name='LabelLeft']").val()
            jsonArr.push({
              label: label,
              value: value
           })
            var   jsonLeft = JSON.stringify(jsonArrLeft);
            var jsonRight = JSON.stringify(jsonArrRight);
            $.ajax({
                url: '{% url 'add_label_value' %}',
                method: 'POST',
                dataType: 'JSON',
                data: {
                    'csrfmiddlewaretoken':  $('input[name="csrfmiddlewaretoken"]').val(),
                    'jsonRight ': jsonRight ,
                    'jsonLeft': jsonLeft      


},
            success: function (data) {
                alert(data);
            }
        });
    })