2016-05-11 1 views
0

В моей форме редактирования я хочу заполнить выпадающее меню. Я успешно возвращать значения в строку JSON, на стороне клиента:Строка выпадающего списка в jqgrid из строки json

var types = 
    $.ajax({ 
     url: getTypesUrl, 
     async: false, 
     success: function (data, result) { 
      if (!result) 
       alert("failed to retreive harvest types."); 
     } 
}).responseText; 

возвращает эту строку:

[{"HarvestTypeId":1,"TypeDescription":"Elite Gain/High Elev"},{"HarvestTypeId":2,"TypeDescription":"High Gain/High Elev"},{"HarvestTypeId":3,"TypeDescription":"Med Gain/High Elev"}] 

Я затем добавить его к моему jqgrid с loadComplete:

$("#harvest-grid").jqGrid({ 
    url: gridUrl, 
    styleUI: "Bootstrap", 
    datatype: 'json', 
    colNames: ['HarvestId', 'Harvest Year', 'Harvest Type'], 
    colModel: [ 
      { name: "HarvestId", key: true, hidden: true }, 
      { name: "HarvestYear", search: true, editable: true }, 
      { name: "HarvestType", search: true, editable: true, edittype: "select" } 
    ], 
    loadonce: true, 
    height: "auto", 
    autowidth: true, 
    rowNum: -1, 
    pager: "#harvest-pager", 
    editurl: editHarvestUrl, 
    loadComplete: function() { 
     $("#harvest-grid").setColProp('HarvestType', { editoptions: { value: types } }); 
    } 
}); 

Форма редактирования показывает окно выбора, но делает всю строку json единственной и единственной опцией, а не строит список:

<select role="select" id="HarvestType" name="HarvestType" rowid="4430" size="1" class="FormElement form-control"> 
    <option role="option" value="[{&quot;HarvestTypeId&quot;">1,"TypeDescription":"Elite Gain/High Elev"},{"HarvestTypeId":2,"TypeDescription":"High Gain/High Elev"},{"HarvestTypeId":3,"TypeDescription":"Med Gain/High Elev"}]</option> 
</select> 
+0

Вы используете окончательно неправильный формат 'editoptions.value' (см. [Документация] (http://www.trirand.com/jqgridwiki/doku.php?id=wiki:common_rules#editoptions)). Использование 'async: false' тоже не очень хорошо. Почему вы не используете 'dataUrl: getTypesUrl'? Вы можете преобразовать данные, полученные с 'getTypesUrl', в' ' «' внутри обратного вызова 'buildSelect'. – Oleg

+0

Спасибо, Олег. Признаюсь, я ленился и не искал документы достаточно хорошо. Это отлично поработало. – BattlFrog

ответ

1

Я бы порекомендовал вам использовать асинхронной загрузки данных с использованием dataUrl: getTypesUrl свойства editoptions. Вы должны указать дополнительно buildSelect обратный вызов, который преобразует данные, возвращаемые из getTypesUrl в строку

<select> 
    <option value='1'>Elite Gain/High Elev</option> 
    <option value='2'>High Gain/High Elev</option> 
    <option value='3'>Med Gain/High Elev</option> 
</select> 

Я рекомендую вам дополнительно добавить prmNames: { id: "HarvestId" } опции и удалить скрытый столбец "HarvestId" в случае, если вы используете именованные свойства (например {"HarvestId": 123, "HarvestYear": 2016, "HarvestType": "Med Gain/High Elev"}) в данных, возвращаемых с url: gridUrl.

Смежные вопросы