為什麼我的 ASP.NET MVC jqGrid 下拉清單顯示「未定義」值？

解決 ASP.NET MVC jqGrid 下拉清單中的「未定義」值

在資料編輯期間動態填入 jqGrid 下拉清單時，經常會出現不必要的「未定義」值。這是由於jqGrid所期望的資料結構和資料傳遞方式不一致所造成的。

正確的 jqGrid 資料格式：

下拉清單值的理想格式是：value: "FE:FedEx; IN:InTime; TN:TNT"

目前方法的問題：

目前方法使用 ASP.NET MVC 和 jQuery 的 $.ajax() 來取得下拉資料。 StringBuilder 操作檢索到的資料以符合 jqGrid 的格式，但額外的「未定義」條目仍然存在。

除錯結果：

FireBug 調試表明 sb.ToString() 引入的額外引號是罪魁禍首。 jqGrid 新增了自己的引號，導致雙引號和「未定義」問題。

進階解：使用 dataUrl 和 buildSelect

不是直接操作 value 屬性，更強大的解決方案是在 dataUrl 或 buildSelect 中使用 jqGrid 的 editoptions 和 searchoptions 屬性。 這些允許自訂資料擷取和格式化。

範例 dataUrl 操作：

<code class="language-csharp">public JsonResult GetDestinationList() {
    List<string> allDestinations = GetAllDestinations();
    return Json(allDestinations, JsonRequestBehavior.AllowGet);
}</code>

範例buildSelect功能：

<code class="language-javascript">buildSelect: function(data) {
    var s = '';
    if (data && data.length) {
        for (var i = 0, l = data.length; i < l; i++) {
            s += data[i] + ';'; // Assuming data[i] is already in "key:value" format
        }
        return s.substring(0, s.length - 1); // Remove trailing semicolon
    }
    return s;
}</code>

更新editoptions：

<code class="language-javascript">{
    name: 'destinations',
    editable: true,
    edittype: 'select',
    editoptions: {
        dataUrl: '/YourController/GetDestinationList', // Replace with your controller action path
        buildSelect: function(data) {
            // ... (buildSelect function from above) ...
        }
    }
}</code>

重要提示：

• 您可以使用 Json(allDestinations); 而不使用 JsonRequestBehavior.AllowGet，但您需要將 ajaxSelectOptions: { type: "POST" } 新增到 jqGrid 選項中。
• 在較新的 jqGrid 版本中，buildSelect 在 $.ajax() 成功處理程序中調用，使得 jQuery.parseJSON(data.responseText) 不必要。

這種修改後的方法提供了一種更乾淨、更有效率、更不易出錯的方法來管理 jqGrid 下拉列表，消除了「未定義」值的問題。 請記得將 /YourController/GetDestinationList 替換為控制器操作的實際路徑。

以上是為什麼我的 ASP.NET MVC jqGrid 下拉清單顯示「未定義」值？的詳細內容。更多資訊請關注PHP中文網其他相關文章！