Question

我正在尝试将Javascript数组传递给我的Django视图。这有效，但我想操纵该数据并将其显示在单独的URL中。所以我有一个产品页面，您可以在其中选择项目。提交表单时，会调用此javascript，我希望它重定向到购物车页面：

$("#getArr").submit(function(){
  var data = {'ab[]' : chosen};
  $.post('cart/', data, function(response){
    if(response == 'success'){ 
      window.location.href="cart/" // references my views
    }
    else{ 
      alert('Error! :('); 
    }
  });
});

views.py

def cart(request):
  if request.method == 'POST':
    chosen = request.POST.getlist('ab[]')
    print(chosen, file=sys.stderr)
    template = loader.get_template('o/cart.html')
    context = {'prodChosen': chosen,
                'e': "hy"}
    return HttpResponse('success')
    # return HttpResponse(template.render(context, request))
else:
    template = loader.get_template('o/cart.html')
    context = {}
    return HttpRepsonse('fail')
    # return HttpResponse(template.render(context, request))

就像在注释掉的HttpResponse行中一样，我需要将数据传递给我的cart.html（它将是我的某个模型中的对象）。我不知道如何将数据传递到我的购物车页面。

行print(chosen, file=sys.stderr)非常有用。以前，当我的代码使用注释掉的返回HttpResponse行时，它会将所需的数组和空数列打印到我的终端。但是，使用此新代码，所需的数组将打印输出，但不会重定向到新页面。我不确定为什么会这样，但我确实知道在我之前的尝试中打印出的空阵列意味着我的购物车页面没有收到正确的数组数据。

编辑：我需要将模型对象传递给新的html页面，（我知道）我无法通过javascript实现

的index.html

<form id="getArr" method="POST">
      {% csrf_token %}
      <button type='submit' id="checkCart">Check Added Items</button>
</form>

Answer 1

如果我正确理解了这个问题，我认为你正在使用JQuery添加一个额外的步骤。

解决方案＃1 - 在jQuery中动态创建表单元素并将该表单提交到Django端点。在Django渲染模板中。

<强>的Javascript

$("#getArr").submit(function(){
  var url = 'cart/';
  var form = '<form action="' + url + '" method="post">';
  for (var i = 0; i < chosen.length; i++) {
      form += '<input type="hidden" name="ab[]" value="' + chosen[i] + '" />'
  };
  form += '</form>'
  var form_element = $(form);
  $('body').append(form_element);
  form_element.submit();
});

然后在您看来，只需像往常一样返回模板：

<强> views.py

def cart(request):
  if request.method == 'POST':
    chosen = request.POST.getlist('ab[]')
    print(chosen, file=sys.stderr)
    template = loader.get_template('o/cart.html')
    context = {'prodChosen': chosen,
                'e': "hy"}
    return HttpResponse(template.render(context, request))
else:
    template = loader.get_template('o/cart.html')
    context = {}
    return HttpRepsonse('fail')
    # return HttpResponse(template.render(context, request))

解决方案＃2 - 使用jQuery .load() function函数并将该表单提交给Django元素。在Django中正常渲染模板（或作为片段以避免重复其他页面元素）。

<强>的Javascript

$("#getArr").submit(function(){
  $('#main-content-div').load('cart/', $("#getArr").serialize());
});

<强> views.py

def cart(request):
  if request.method == 'POST':
    chosen = request.POST.getlist('ab[]')
    print(chosen, file=sys.stderr)
    template = loader.get_template('o/cart.html')
    context = {'prodChosen': chosen,
                'e': "hy"}
    return HttpResponse(template.render(context, request))
else:
    template = loader.get_template('o/cart.html')
    context = {}
    return HttpRepsonse('fail')
    # return HttpResponse(template.render(context, request))

解决方案＃3 - 创建一个包含元素名称ab[]的典型HTML表单，并将该表单提交到Django端点。在Django渲染模板中。

表格：

<强> HTML

<form id="getArr" action="cart/" method="POST">
    <input type="text" name="ab[]" value="product_id_1"/>
    <input type="text" name="ab[]" value="product_id_2"/>
    <input type="text" name="ab[]" value="product_id_3"/>
    <input type="submit" value="Submit" />
</form>

一些Javascript要向表单添加元素：

<强>的Javascript

$('.add_product').click(function(){
    $('#getArr').append('<input type="hidden" name="ab[]" value="' + $(this).attr('product_id') + '"/>')
})

Django观点：

<强> views.py

def cart(request):
  if request.method == 'POST':
    chosen = request.POST.getlist('ab[]')
    print(chosen, file=sys.stderr)
    template = loader.get_template('o/cart.html')
    context = {'prodChosen': chosen,
                'e': "hy"}
    return HttpResponse(template.render(context, request))
else:
    template = loader.get_template('o/cart.html')
    context = {}
    return HttpRepsonse('fail')
    # return HttpResponse(template.render(context, request))

从Javascript接收数据后重定向到新页面

1 个答案: