2013-01-04 9 views
12

Mam scenariusz, w którym zdarzenie Click jest powiązane z <tr>, a sprawdzana wartość jest powiązana z polem wyboru wewnątrz <td? wewnątrz <tr>. Teraz problem polega na tym, że po kliknięciu wiersza zdarzenie jest uruchamiane, to dobrze. Ale w przypadku, gdy klikam pole wyboru, obserwowana wartość zmienia się również dla wiersza i uruchamia zdarzenie z kliknięciem wiersza. Jak uniknąć tego scenariuszaKliknij pole wyboru w wierszach pożary wiązanie zdarzeń w wiązaniu wiersza knockout

<tbody data-bind="foreach:Mails"> 
    <tr data-bind="click:$root.navigateToMail"> 
     <td style="width: 15px"> 
      <input type="checkbox" data-bind="checked: isSelected"> 
      @*<input type="checkbox">*@ 
     </td> 
     <td data-bind="text: From"> 
     </td> 
     <td data-bind="text: To"> 
     </td> 
     <td data-bind="text: Subject"> 
     </td> 
     <td data-bind="text: MailDate"> 
     </td> 
    </tr> 
</tbody> 

Zdarzenia są:

ko.utils.arrayForEach(data.mails, function (mail) { 
        mail.isSelected = ko.observable(false); 
        mail.isSelected.subscribe(function (myvalue) { 
         console.log(myvalue); 
        }); 
       }); 
self.navigateToMail = function (mail) { 
     location.hash = mail.Folder() + '/' + mail.Id(); 
    }; 

I przycięte zbędnych kodów. Właśnie umieściłem tam, gdzie wystąpił problem.

+0

jeśli odpowiedź ci pomogła, zaakceptować go jako takiego –

Odpowiedz

22

W zasadzie trzeba anulować bulgotanie zdarzeń po kliknięciu.

Oto przykład tego, jak można to zrobić:

<div data-bind="click: parentClick"> 
    <input type="checkbox" data-bind="checked: isSelected, click: function(){return true}, clickBubble: false"> 
</div>​ 

Zobacz tutaj: http://jsfiddle.net/2M9XP/1/

+1

Dzięki! Próbowałem go z 'clickBubble: false', ale nie zdawałem sobie sprawy, musiałem jawnie obsługiwać zdarzenia kliknięcia. Coś, o czym wspomniałby sprawdzone wiązanie. – jes

+0

Próbowałem to naprawić przez wiele godzin. Wielkie dzięki! –

+1

jesteś dzisiaj moim bohaterem – stackoverfloweth

Powiązane problemy