2012-10-19 5 views
0

그래서 Knockout.js를 배웠고 실제로 파 냈습니다. 내가 작업중인 이벤트 웹 사이트의 게스트 목록에 SQL 상호 작용을 추가하는 데이 스크립트를 사용하고 있습니다. 저는 삭제를 위해 항목을 표시하고 PHP에서 'isset'을 사용하여이를 삭제 된 것으로 표시하도록 destroy를 사용합니다.Knockout.js의 오브젝트에 추가 데이터 추가

레코드를 업데이트 할 때 같은 일을하는 일종의 기능을 추가하고 싶습니다. JSON을 다시 서버로 보낼 때 실제로 변경되지 않은 경우 모든 단일 레코드 (심지어 최대 300 개의 업데이트 만 말하는 것임)를 업데이트하는 것은 부끄럽지 않게 보입니다. 녹아웃 작업에 더 많은 경험을 가진 사람이 나를 도와 줄 수 있다면 많은 도움이 될 것입니다.

여기 내 자바 스크립트입니다. 마크 업과 데이터 바인딩은 상당히 기본 적이므로 포함하지 않을 것입니다.

function Guest(data){ 
    this.id = ko.observable(data.id); 
    this.name = ko.observable(data.name); 
    this.email = ko.observable(data.email); 
    this.guests = ko.observable(data.guests); 
    this.code = ko.observable(data.code); 
} 

function guestListViewModel(){ 
    //Data 
    var self = this; 
    self.guests = ko.observableArray([]); 
    self.guestsNumber = 0; 

    $.getJSON('/php/guests_json.php', function(json) { 
     var mappedGuests = $.map(json, function(item) { return new Guest(item) }); 
     self.guests(mappedGuests); 
     self.guestsNumber = (self.guests().length); 
     $('.dlt_btn').button(); 

    }); 

    self.removeGuest = function(guest) { 
     self.guests.destroy(guest); 
    }; 

    self.save = function() { 
     var data = 'json=' + ko.toJSON({guests: self.guests }); 
     $.ajax("/php/save_guests.php", { 
      data: data, 
      type: "post", 
      success: function(result) {$('#server').html(result)} 
     }) 
    } 

    self.totalGuests = ko.computed(function() { 
     var total = 0; 
     ko.utils.arrayForEach(self.guests(), function(guest) { 
      var value = guest.id; 
      console.log(value); 
      if (!isNaN(value)) { 
       total += value; 
      } 
     }); 
     return total;   
    }); 

} 

ko.applyBindings(new guestListViewModel); 

편집 또한

, 누군가가 내가 관찰 배열을 통해 이동하고 손님이 내가 콘솔 대신 함수를 얻을 가치를 꺼내려고 왜 어떤 생각을 가지고 있습니까?

답변

1

방문자 객체가 더럽다면 (편집 된 경우) 계산 된 객체를 래핑합니다. 여기에 그것을 수행하는 방법에 대한 전체 가이드는 다음과 같습니다

http://www.knockmeout.net/2011/05/creating-smart-dirty-flag-in-knockoutjs.html

를 그리고, 당신은 단지 _isDirty()이 참 누구를 위해 사람을 제출할 수 있습니다.

+0

감사합니다. 시도해 보겠습니다. – Throttlehead

+0

우연히 위의 코드가 'self.totalGuests'함수에서 원하는 값 대신에 함수를 제공하는 이유가 무엇인지 알지 못합니까? – Throttlehead

+0

@ Jacob, yup,'Guest'의'id' 속성은 관찰 가능하므로'var value = guest.id();'가 필요합니다. 'self.guests' 대신'self.guests()'가 필요했던 것과 같은 이유 때문입니다. 따로 말하면, id를 합치는 것을 의미합니까, 아니면'guest.guests()'를 말하고 싶습니까? –