2013-10-24 116 views
3

當使用jQuery自動完成時,我得到[object object]在自動完成元素下面呈現,而不是數據庫中的值(錯誤截圖爲click here)。有人可以建議我去哪裏錯了。Jquery AutoComplete返回[對象對象]

這裏是我的jQuery Mobile的代碼

$(document).on("pageinit", "#myPage", function() { 
    $("#autocomplete").on("listviewbeforefilter", function (e, data) { 
     var $ul = $(this), 
      $input = $(data.input), 
      value = $input.val(), 
      html = ""; 
     $ul.html(""); 
     if (value && value.length > 2) { 
      $ul.html("<li><div class='ui-loader'><span class='ui-icon ui-icon-loading'></span></div></li>"); 
      $ul.listview("refresh"); 
      $.ajax({ 
       url: "/get_names/", 
       dataType: "json", 
       crossDomain: true, 
       data: { 
        q: $input.val() 
       } 
      }) 
      .then(function (response) { 
       $.each(response, function (i, val) { 
        html += "<li>" + val + "</li>"; 
       }); 
       $ul.html(html); 
       $ul.listview("refresh"); 
       $ul.trigger("updatelayout"); 
      }); 
     } 
    }); 
}); 

這裏是我的html代碼

<div data-role="page" id="myPage"> 

    <div data-role="content"> 

    <ul id="autocomplete" data-role="listview" data-inset="true" data-filter="true" data-filter-placeholder="Search House Id..." data-filter-theme="d"></ul> 
    </div><!-- /content --> 
</div> 

這裏是views.py

def get_names(request): 
    q = request.GET.get('term', '') 
    names = Names.objects.filter(names__startswith=q)[:10] 
    results = [] 
    if names.count > 0: 
     for name in names: 
      name_json = {} 
      name_json['id'] = name.id 
      name_json['label'] = name.name 
      name_json['value'] = name.name 
      results.append(name_json) 
      data = json.dumps(results) 
    else: 
      data = 'fail' 

    mimetype = 'application/json' 
    return HttpResponse(data, mimetype) 

回答

2

我的Django代碼,我不熟悉Django,但如果我正確地遵循我認爲你需要改變以下內容:

$.each(response, function (i, val) { 
    html += "<li>" + val.value + "</li>"; 
}); 

val是一個對象。

還只是一個調試的提示,我會爲了在$.each();前添加console.log(response);弄清楚VAL將是,如果我是你是在碰到的情況。

+0

謝謝,它的工作原理。 – kurrodu

2

您需要鑽到JSON的價值,就像這樣:

val.id 

val.label 

val.value 

我假設你想val.label是爲<li>文本,所以你的代碼應該是這樣的:

$.each(response, function (i, val) { 
    html += "<li>" + val.value + "</li>"; 
}); 
+0

謝謝你的解釋! – kurrodu

+0

@kurrodu - 沒問題,如果你覺得它有幫助,可以隨意投我的答案。 :-) –

+0

意識到我需要15點聲望才能投票.. – kurrodu