解析鍵/值對MVC

我經歷的職位這裏沖刷，並沒有發現有效的解決方案......解析鍵/值對MVC

我使用JQuery自動完成對員工的下拉列表。我能夠使用值加載列表，但它包含我傳遞的字典中的鍵而不是值。我想展示兩者。

控制器代碼：

public JsonResult GetEmp(string id) 
    { 
     if (id.Length > 3) 
     { 
      var result = Json(repository.SearchForEmployee(id), JsonRequestBehavior.AllowGet); 
      return result; 
     } 

     return null; 
    }

jQuery代碼：在控制器動作

$('.empId').keyup(function() { 
    var x = $('.empId').val(); 
    var arrayValues = []; 
    $.ajax({ 
     url: '../../Employee/GetEmployee', 
     type: "Get", 
     data: { id : x }, 
     cache: false, 
     datatype: 'json', 
     traditional: true, 
     success: function (result) { 
      $.each(result, function (item) { 
       arrayValues.push(item); 
      }) 
      $(".empId").autocomplete({ 
      source: arrayValues 
     }); 
     }, 

     error: function (err) { 
      alert('Foo') 
     } 
    }); 
});

JSON結果變量調試時：JScript數組的用於automplete

[0] {[12345, Sharon Moore]} 
[1] {[12346, Amy Adams]} 
[2] {[12349, Adam Smith]}

實際內容：

12345, 24563, 84565

任何人都可以解釋爲什麼它只引入第一個值（鍵）？鍵和值都是字符串。再次提前致謝...

來源

2014-01-10 user1171915

您需要圍繞值字符串引號嗎？ – zgood

當你在'success'回調中'console.log（result）'時，你會看到什麼？ – zgood

控制檯。日誌結果爲：{「1289」：「KIRK BELL」，「1827」：「LINDA JONES」，「1963」：「LINDA SMITH」} – user1171915

由於您要返回的是對象而不是數組，因此您可以嘗試如下所示：

var array_of_objects = []; 
for (var key in result) { 
    var val = result[key]; 
    //Now you have your key and value which you 
    //can add to a collection that your plugin uses 
    var obj = {}; 
    obj.label = key; 
    obj.value = val; 
    array_of_objects.push(obj); 
} 

$(".empId").autocomplete({ 
    source: array_of_objects 
});

或者，你可以在你的C＃代碼（這將是一個對象/記錄數組）返回一個ArrayList。下面是我的一個項目一些示例代碼：

 [HttpPost] 
     public ActionResult GetProject(int id) { 
      string connStr = ConfigurationManager.ConnectionStrings["Conn"].ConnectionString; 
      SqlConnection conn = new SqlConnection(connStr); 

      string sql = "SELECT * FROM [Portfolio] WHERE [id] = @id"; 
      SqlDataAdapter da = new SqlDataAdapter(sql, conn); 
      da.SelectCommand.Parameters.Add(new SqlParameter("@id", id)); 
      DataTable dt = new DataTable(); 

      conn.Open(); 
      da.Fill(dt); 
      da.Dispose(); 
      conn.Close(); 

      return Json(objConv.DataTableToArrayList(dt), JsonRequestBehavior.AllowGet); 
     }

objConv是一個輔助工具我用。以下是我在上述代碼示例中使用的DataTableToArrayList方法的代碼：

public ArrayList DataTableToArrayList(DataTable dataTbl) { 

      ArrayList arrList = new ArrayList(); 

      foreach (DataRow dRow in dataTbl.Rows) { 
       Hashtable recordHolder = new Hashtable(); 
       foreach (DataColumn column in dataTbl.Columns) { 
        if (dRow[column] != System.DBNull.Value) { 
         recordHolder.Add(column.ToString(), dRow[column].ToString()); 
        } else { 
         recordHolder.Add(column.ToString(), ""); 
        } 
       } 
       arrList.Add(recordHolder); 
      } 

      return arrList; 
     }

來源

2014-01-10 19:31:15 zgood

jQuery UI自動完成可以使ajax自己調用，所以我真的不明白爲什麼你要單獨做ajax調用。

$("#txtbox").autocomplete({ 
    source: url 
});

不管，儘管，從控制器的JSON應在[ { label: "Choice1", value: "value1" }, ... ]的格式，如果要發送的值和標籤揹回來。

http://api.jqueryui.com/autocomplete/#option-source

來源

2014-01-10 18:16:29 mituw16

結果被返回爲{「1289」：「KIRK BELL」，「1827」：「LINDA JONES」，「1963」：「LINDA SMITH」}。如何讓他們進入格式：[{label：「Choice1」，value：「value1」}，...] – user1171915

這是一個大對象，而不是jquery ui autocompelete期望的對象數組。一目瞭然，無需深入研究c＃代碼，您需要返回一個序列化爲json的c＃列表對象 – mituw16

這裏有一段代碼，我使用的幾個地方。我沒有使用您正在使用的自動完成功能，但我不認爲這是一個問題。

客戶端：

$.getJSON('../../Employee/GetEmployee', { id: x }, function (results) { 
     var yourDropdown = $('#YourDropdown'); 
     var json = JSON.parse(results); 
     $.each(json, function (index, item) { 
      yourDropdown.append($('<option/>', { 
       value: item.Value, 
       text: item.Text 
      })); 
     }); 

     //Implement the autocomplete feature. 
    });

服務器端：

[HttpGet] 
    public JsonResult GetElements(int id) 
    { 
     IEnumerable<SelectListItem> elements; 

     //Some routine that gets the elements goes here. 

     var serializer = new JavaScriptSerializer(); 
     return Json(serializer.Serialize(elements), JsonRequestBehavior.AllowGet); 
    }

我沒有測試的代碼在特定的場景，但它應該，因爲我使用在多個地方的代碼片段。

注意：請嘗試使用getJson方法而不是$ .ajax。這是您正在使用的ajax實現的捷徑。正如你所看到的，代碼不那麼冗長和更具可讀性。

來源

2014-01-10 18:22:00 Charles

JQuery UI自動完成需要特定的數據結構才能工作。

SearchForEmployee必須返回數據的列表，格式如下：

public class EmployeeAutocomplete 
{ 
    public string @label { get; set; } 
    public string @value { get; set; } 
}

，或者您需要在JavaScript轉換爲格式而不是陣列的列表：

success: function (result) { 
     $.each(result, function (item) { 
      arrayValues.push(new { label: item[1], value: item[0] }); 
     }); 
     $(".empId").autocomplete({ 
      source: arrayValues 
     }); 
    },

自動完成的參考： http://api.jqueryui.com/autocomplete/

來源

2014-01-10 19:00:28 Karhgath

解析鍵/值對MVC

回答

相關問題