Dropdown失去了重點，因爲我盡力選擇一個值

所以上下文是一個帶有剃鬚刀視圖的MVC 4互聯網應用程序。Dropdown失去了重點，因爲我盡力選擇一個值

這裏就是我想要的自動完成下拉菜單出現在輸入字段：

<td> 
    <div class="editor-field"> 
    <input type="text" id="catSelector" /> 
    @*@Html.TextBoxFor(model => model.Category, new { id = "catSelector" }) 
     @Html.ValidationMessageFor(model => model.Category)*@ 
    </div> 
</td>

腳本部分是以下（放置在我的網頁的底部）：

<script> 

$('#catSelector').autocomplete({ source: getCategories,}); 


function getCategories(request, response) { 

    $.ajax({ 
     url: '/Activity/GetCategories', 
     data: { query: request.term }, 
     dataType: 'json', 
     type: 'POST', 
     success: function (data) { 

      response($.map(data, function (item) { 
       return { 
        label: item.Name, 
        value: item.CategoryId 
       }; 
      })); 
     } 
    }); 

}

服務器動作（「Activity/GetCategories」）是這一個：

public JsonResult GetCategories(string query = "") 
{ 

    var result= _dal.SelectCategories(query); 

    return Json(result, JsonRequestBehavior.AllowGet); 

}

基本上，一個類別只是一個名稱和一個ID。

到目前爲止，我設法讓ajax調用返回json數據（使用firebug進行檢查，對於數據部分來說一切都很好）。

當我開始鍵入搜索條件時，自動完成下拉菜單出現在輸入字段下方。

但是，只要我嘗試導航通過retreived值（無論是用鍵盤或通過用鼠標選擇值），下拉消失和輸入字段失去了焦點。

我的代碼在這裏可能有什麼錯誤？

我必須補充一點，我使用Metro UI CSS 2.0（樣式和js），這使得我前段時間使用jQuery ui datepicker時遇到了一些麻煩。所以我試圖去激活所有Metro ui css腳本，但沒有運氣。最後，Chrome和Firefox都會出現此問題。

非常感謝大家的意見。

來源

2013-11-27 Bruno

明白了......我曾在我的解決方案引用2個jQuery UI的腳本：在一個與所有在一個文件和單個組件文件...

我的壞...

來源

2013-11-27 21:24:49 Bruno

Dropdown失去了重點，因爲我盡力選擇一個值

回答

相關問題