Отображение knockoutjs выберите параметры привязки данных - PullRequest
Новая
       6

Отображение knockoutjs выберите параметры привязки данных

3 голосов
/ 17 марта 2012

У меня проблемы с привязкой выбранного значения окна выбора к свойству в модели представления. По какой-то причине он продолжает возвращаться без изменений, когда отправляется обратно на сервер.

Мой HTML-код: 

<form action="/Task/Create" data-bind="submit: save"> 

    <table border="1">
        <tr>
            <td>ref type</td>
            <td><select data-bind="options: ReferenceTypes, optionsText: 'Name', optionsCaption: 'Select...', value:Task.ReferenceTypeId"></select></td>
            <td>Reference</td>
            <td><input data-bind="value:Task.Reference" /></td>
        </tr>
    </table>

    <button type="submit">Save Listings</button> 
</form>

Javascript: 

<script type="text/javascript">

    var viewModel = {};

    $.getJSON('/Task/CreateJson', function (result) {
        viewModel = ko.mapping.fromJS(result.Data);

        viewModel.save = function () {
            var data = ko.toJSON(this);
            $.ajax({
                url: '/Task/Create',
                contentType: 'application/json',
                type: "POST",
                data: data,
                dataType: 'json',
                success: function (result) {
                    ko.mapping.updateFromJS(viewModel, result);
                }
            });
        } 

        ko.applyBindings(viewModel);
    });

</script>

JSON от Fiddler, который загружается на страницу, как показано ниже. 

{
   "ContentEncoding":null,
   "ContentType":null,
   "Data":{
      "Task":{
         "ReferenceTypeId":0,
         "Reference":"Default Value"
      },
      "ReferenceTypes":[
         {
            "Id":2,
           "Name":"A Ref Type"
         },
         {
            "Id":3,
            "Name":"B Ref Type"
         },
         {
            "Id":1,
            "Name":"C Ref Type"
         }
      ]
   },
   "JsonRequestBehavior":1
}

Это возвращается на сервер (ASP.NET MVC3) правильно, с обновленным значением строки ссылки, но ReferenceTypeId не привязан к правильно выбранному раскрывающемуся значению. Нужно ли выполнять какие-либо дополнительные функции для правильной привязки и т. Д.? Или сообщите привязке данных, что такое столбец выбора значения (Id) и т. Д.? Я проверил в Fiddler значения, публикуемые обратно из браузера, и он имеет то же исходное значение (0). Так что это определенно не сервер.

Я надеюсь, что кто-то может помочь, если вам нужна дополнительная информация, пожалуйста, спросите.

С уважением Фил

1 Ответ

11 голосов
/ 17 марта 2012

Проблема в том, что ваша привязка options попытается присвоить объекту, с которым она связана, указанное значение observable.

Например, если вы выберете «Тип ссылки», привязка options будет помещать объект json 

{ "Id":2, "Name":"A Ref Type" }

в ваш наблюдаемый объект Task.ReferenceTypeId, который затем сериализуется обратно на ваш сервер,В этом случае вам нужно добавить параметры конфигурации optionsValue, чтобы указать привязку только для сохранения идентификатора. 

<select data-bind="options: ReferenceTypes, optionsText: 'Name', 
optionsCaption: 'Select...', optionsValue: 'Id', value:Task.ReferenceTypeId">
</select>

Вот пример.

http://jsfiddle.net/madcapnmckay/Ba5gx/

Надеждаэто помогает.

...