2015-12-29 1 views
1

У меня есть форма со скрытым входом в моем приложении MVC, значение которого я хочу прочитать Knockout. К сожалению, наблюдаемая функция в Knockout Заменяет исходное значение в DOM с тем, что значение указано в скобках, так чтоКак получить нокаут для чтения значения из скрытого ввода

self.title = ko.observable() 

изменяет значение скрытого ввода в поле пустым. Это было бы не так плохо, если бы у меня была пустая форма, которую пользователь должен заполнить. Я нашел несколько ответов на Stackoverflow, которые используют сложную пользовательскую привязку, но я просто отказываюсь верить, что что-то ЭТО просто требует такого сложного решения. Есть ли Knockout есть родной способ либо:

  1. Читать Существующее значение входов из DOM
  2. Bind существующих значений без первых их замен с начальным значением?

Вот DOM:

<div class="form-group has-success"> 
       <input type="hidden" id="title" value="@RazorFunction('Title')" data-bind="value:title" /> 
       <label class="control-label" for="message">@RazorFunction('Label')</label> 
       <textarea class="form-control" placeholder="@RazorFunction('Placeholder')" rows="5" cols="50" data-bind="value:message"></textarea> 
       <br /> 
       <button class="btn btn-primary" data-bind="click:sendMessage">@RazorFunction('Send')</button> 
      </div> 

Вот моя модель в .js файле:

var Model = function() { 
     var self = this; 
     self.message = ko.observable("") 
     self.title = ko.observable() 
     self.messages = ko.observableArray() 
    }; 
+0

В вашей модели set 'self.title = ko.observable (@RazorFunction ('Title'))'. Это то, что я сделал, чтобы обойти эту проблему. Там не обойти перезапись. – Nkosi

ответ

0

Я просто полностью игнорирую скрытый ввод и предоставляю это значение в качестве исходного значения вашей модели.

var init = {title: 'foo'}; 
var Model = function(initial){ 
    var self = this; 
    self.title = ko.observable(initial.title); 
    // ... 
}; 
var vm = new Model(init); 

Если это действительно необходимо, чтобы этот скрытый вход, вы можете попытаться получить это значение до инициализации ViewModel происходит.

var init = {}; 
init.title = document.getElementById('title').value; 
ko.applyBindings(new Model(init)); 
+0

Отличный ответ! Это сработало, спасибо. Я вытаскивал свои несуществующие волосы. –

2

У меня есть форма со скрытым входом в моем MVC приложения, значение которого Я хочу прочитать нокаут.

Это совершенно не то, чего нужно. Нокаут генерирует пользовательский интерфейс (т. Е. Вид) из модели, он не генерирует модель из пользовательского интерфейса.

К сожалению, наблюдаемая функция в Knockout Заменяет исходное значение в DOM с тем значением, указано в скобках так что

Это именно то, что должно произойти. Пользовательский интерфейс отражает то, что диктует модель.

Проблема здесь: почему у вас есть части представления, которые не соответствуют вашей модели данных? Исправьте это, и проблема будет растворена.

Скрытый ввод со значением является абсолютно ненужной вещью для приложения с нокаутом. Если сервер знает значение, которое ему нужно передать клиенту, не записывайте его в HTML. Создайте/отправьте JSON, который содержит все значения, необходимые вашей модели для инициализации, пусть Knockout выполняет весь пользовательский интерфейс, сопротивляется стремлению создать динамический интерфейс с видами Razor.

Вот что вид должен выглядеть (пусть Бритва сделать интернационализацию, это прекрасно):

<div class="form-group has-success"> 
    <!-- title is already part of the model, no need to put it in the view 
     unless it actually shows up anywhere --> 
    <label class="control-label" for="message">@RazorFunction('Label')</label> 
    <textarea class="form-control" placeholder="@RazorFunction('Placeholder')" rows="5" cols="50" data-bind="value:message"></textarea> 
    <br /> 
    <button class="btn btn-primary" data-bind="click:sendMessage">@RazorFunction('Send')</button> 
</div> 

и ViewModel:

var Model = function (data) { 
    var self = this; 
    self.message = ko.observable(data.message) 
    self.title = ko.observable(data.title) 
    self.messages = ko.observableArray(data.messages); 
}; 

где data объект с начальными значениями.

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