KnockoutJS данных привязки: нажмите с JavaScript нажмите

Question

Допустим, у нас есть таблица, как так

<table> 
    <tbody data-bind="foreach: orderItems"> 
     <tr class='datarow'> 
      <td data-bind="text: whatever"></td> 
      <td><a id='anchor' href='#' data-bind='click: $root.save' onclick='alert("a");'>Text</a></td> 
     </tr> 
    </tbody> 
</table> 

так, когда я

document.getElementsById('anchor').click(); 

на оповещение срабатывает, но $ root.save не , Есть идеи?

Answer 1

Я вижу 2 проблемы с кодом:

1. getElementsById - вы уверены, что этот метод существует?

Каждый ID должен существовать только один раз на странице. Когда вы хотите найти элемент по его ID, вы можете вызвать getElementById (единственное), и он вернет элемент. Поскольку только один элемент должен иметь данный идентификатор, метода getElementsById (множественного числа) нет.

Ваше привязку foreach в сочетании с жестко закрепленным идентификатором «anchor» приведет к нескольким элементам с идентификатором привязки. Это не-нет. Возможно, используйте класс «якорь» вместо идентификатора «якорь».

<a class='anchor' href='#' data-bind='click: $root.save' onclick='alert("a");'>Text</a> 

Таким образом, я предполагаю, что getElementsById не возвращает ничего, чтобы нажать.

1. нажмите()

Даже если вы были в состоянии получить элемент назад от getElementsById, нет никакого метода нажмите() на тех элементах.

В качестве альтернативы вы можете использовать jQuery для получения элементов, а с помощью объекта jQuery вы можете вызвать метод click(). Или вы можете взять элемент, возвращенный из getElementById, обернуть его в jQuery, а затем вызвать click().

$('.anchor').click(); 

Вот рабочий пример: http://jsfiddle.net/tlarson/t4yZL/1/

Answer 2

Try This 

<script type="text/javascript"> 
    var viewModel = { 

     Save: function() { 

      alret("Hello"); 
     } 
    }; 
ko.applyBindings(new MyViewModel()); 
</script> 
<table> 
    <tbody data-bind="foreach: orderItems"> 
     <tr class='datarow'> 
      <td data-bind="text: whatever"></td> 
      <td><a id='anchor' href='#' data-bind='click: $root.save' onclick='alert("a");'>Text</a></td> 
     </tr> 
    </tbody> 
</table> 

Answer 3

<table> 
    <tbody data-bind="foreach: orderItems"> 
     <tr class='datarow'> 
      <td data-bind="text: whatever"></td> 
      <td><a id='anchor' href='#' onclick='alert("a"); viewModel.save(ko.dataFor(this));'>Text</a></td> 
     </tr> 
    </tbody> 
</table> 

• Предположим, что вы сохранили ваш ViewModel в другом месте.
• ko.dataFor (элемент) - возвращает данные, которые были доступны для связывания с элементом

Вы можете посмотреть на этой link