6

入力テキストボックスがあり、フォーカスを失うたびに、その値テキストを関数で取得したいと考えています。

たとえば、 type"testimonials1"の場合、イベントのイベント ハンドラーでそのテキストを取得するにはどうすればよいblurでしょうか?

これは私が試したものです。ProjectTestimonialユーザーが入力したテキストではなく、オブジェクトとして取得します。

HTML 

<div class="ratingcontents" data-bind="foreach: ProjectTestimonial">
  <!--ko if: !Testimonialstext-->
  <input type="text" placeholder="Testimonials" class="txttestimonials" 
    data-bind="
      text: Testimonialstext,
      event: { 
        blur: $root.testimonialblurFunction.bind(SourceId, SourceText, Testimonialstext)
      }
    " 
  >
  <!--/ko-->
</div>

JS

self.testimonialblurFunction = function (data, event, Testimonialstext) {
    debugger;
    alert(data.soid + Testimonialstext);
}
4

3 に答える 3

8

あなたが犯した最初の間違いは、「値」バインディングではなく、入力フィールドで「テキスト」バインディングを使用したことです。

イベントハンドラーに関しては、私はこれをしません。ノックアウトの「サブスクライブ」機能を使用して、オブザーバブルへの変更をリッスンします。

コードのJsfiddle バージョンを次に示します。より明確に示すために、マークアップを変更しました。

HTML

<div class="ratingcontents" data-bind="foreach: ProjectTestimonial">

  <input type="text" placeholder="Testimonials" class="txttestimonials"  
    data-bind="value: Testimonialstext" />

</div>

Javascript

function viewModel(jsModel){
    var self = this;

    self.ProjectTestimonial = ko.utils.arrayMap(jsModel, function(item) {
        return new testimonial(item);
    }); 
}

function testimonial(jsTestimonial){
    var self = this;
    ko.mapping.fromJS(jsTestimonial, {}, self);

    self.Testimonialstext.subscribe(function(){
        alert(self.SourceId() + self.Testimonialstext());        
    });
}

var rawModel = [
    {
        SourceId: '1',
        SourceText: 'Foo',
        Testimonialstext: 'Ahoy there.'
    },
    {
        SourceId: '2',
        SourceText: 'Bar',
        Testimonialstext: 'Blah blah blah'
}];

ko.applyBindings(new viewModel(rawModel));
于 2013-06-04T21:00:16.963 に答える
0

代わりにhas focusバインディングを使用してください。私が理解していることから、ユーザーが編集を停止したら、テキスト ボックスにデータが必要です。これは簡単です。ノックアウト js ドキュメント ページからこの例を確認してください。

<p>
Hello  <b data-bind="text:name"></b> </p>   
<input data-bind="value: name, hasfocus: editing" />

<p><em>Click the name to edit it; click elsewhere to apply changes.</em></p>

モデルを見る

function PersonViewModel(name) {
// Data
this.name = ko.observable(name);
this.editing = ko.observable(false);

// Behaviors
this.edit = function() { this.editing(true) }
}

ko.applyBindings(new PersonViewModel("Bert Bertington"));

jsフィドル

于 2013-06-04T11:15:09.360 に答える