JQuery:如何在Ajax中添加对象列表

JQuery/AJAX 我想得到你的帮助,以便在我的下拉框中列出一个对象列表。

我有这个功能:

function get_sub_method_options(keep_cur) {
  var sel_option = $('select#id_method-group').find("option:selected");
  var sel_val = sel_option.val();
  console.log(sel_val);
  if (sel_val === '') {
    console.log('none sorting group');
    $("select#id_method-sub_method").empty();
    $("select#id_method-sub_method").append('<option value=""> test </option>'); //here add list of all submethods
    return;
  }

  data = {
    'test_method': $('select#id_method-test_method').find("option:selected").val(),
    'group': sel_val
  };
  $.ajax({
    method: "GET",
    url: '{% url 'ajax_method_submethod' %}',
    data: data

  }).done(function (result) {
    reset_select('id_method-sub_method');
    for (var i = 0; i < result['results'].length; i++) {
      if (keep_cur > 0 & keep_cur == result['results'][i].id)
        $("select#id_method-sub_method").append('<option value="' + result['results'][i].id + '" selected>' + result['results'][i].text + '</option>');
      else
        $("select#id_method-sub_method").append('<option value="' + result['results'][i].id + '">' + result['results'][i].text + '</option>');
    }
    ;
  });
}

我有一个Python/Django函数:

def ajax_method_submethod(request):
    test_method_id = request.GET.get("test_method", "")
    group_id = request.GET.get("group", "")
    sub_methods_all = SubMethod.objects.all()
    sub_methods = Method.objects.filter(test_method_id=test_method_id).filter(
        group_id=group_id
    )

    results2 = []
    for item in sub_methods_all:
        results2.append({'id': item.id, 'text': item.name})
    print(results2)

    results = []
    for item in sub_methods:
        results.append({'id': item.sub_method.id, 'text': item.sub_method.name})

    return HttpResponse(json.dumps({'err': 'nil', 'results': results, 'results2': results2}), content_type='application/json')

results2 (python文件)当我 sel_val 为空:

if (sel_val === '') {
   ...
}

那么我如何重写这部分:

if (sel_val === '') {
    console.log('none sorting group');
    $("select#id_method-sub_method").empty();
    $("select#id_method-sub_method").append('<option value=""> test </option>'); //here add list of all submethods
    return;
  }

这样地:

if (sel_val === '') {
    $("select#id_method-sub_method").empty();
    for (var i = 0; i < result['results2'].length; i++) {
      $("select#id_method-sub_method").append('<option value="' + result['results2'][i].id + '">' + result['results2'][i].text + '</option>'); //here add list of all submethods
    }
    return;
  }

具有 for loop 并附加 result['results2']

希望它的可读性和可理解性。

谢谢您!

编辑:

正如@Darren Crabb所说,这可能超出了范围。

所以我把我的JS改写成这样:

if (!sel_val) {
    reset_select('id_method-sub_method');
    $("select#id_method-sub_method").empty();
    var all = "{{ results2 }}";
    for (var i = 0; i < all.length; i++) {
      $("select#id_method-sub_method").append('<option value="' + all[i].id + '">' + all[i].text + '</option>'); //here add list of all submethods
    }
    return;
  }

context['results2'] = SubMethod.objects.all()

我明白了: