2013-05-15 3 views
1

내 django 프로젝트에 knockout.js를 사용하고 javascript의 post 메서드에 문제가 있습니다. 다시 바인딩하려고했거나 목록을 다시 초기화했지만 작동하지 않았습니다.데이터 바인딩을 사용하여 페이지를 다시로드하지 않고 데이터를 새로 고치는 방법

예 : 10 개의 행이있는 테이블 데이터를 표시하고 있습니다. 버튼을 클릭하고 싶습니다. 5 개의 행이있는 다른 데이터가 표시되어 페이지를 다시로드하지 않고 테이블의 데이터를 다시로드하려고합니다.

자바 스크립트 :

function makeShowObjectList(model, d_url, no_num, detail_per_page, b, fruit) { 
var showobjectList = ko.observableArray([]); 


$.post(d_url, data, function (response_data) { 
       // here we have applied code to set new data in showobjectList 
       if (!showobjectList.is_ready) 
       { 

        //Here we are trying to relaod the list on the page but did'nt work 
        FViewModel.showobjectList=showobjectList; 
        showobjectList.is_ready = true; 
        showobjectList.onready(); 
        ko.mapping.fromJSshowobjectList, {}, self); } 
       } 
      }, 'json'); 

} 
function fruitFilterItem(n, i) { 
    this.n = n; 
    this.i = i; 
} 
var FViewModel=function(c_data) 
{ 
    var self = this; 
    self.abc= ko.observable(null); 
     this.optionsText = ko.observable(); 
     this.fruitFilter = ko.observableArray([ 
     new fruitFilterItem("Mango", 2), 
     new fruitFilterItem("Banana", 1), 
     new fruitFilterItem("Grapes", 3) 
    ]); 
    this.selectedfruit = ko.observable(); 
    this.VegeFilter = ko.observableArray([ 
     new fruitFilterItem("Tomato", "Tomato"), 
     new fruitFilterItem("Patato", "Patato"), 
     new fruitFilterItem("Onion", "Onion"), 

    ]); 
    this.selectedVege = ko.observable(); 

    self.showtList = makeShowObjectList(BucketViewModel, urls.get_fruit_info, self.fruit_page, self.num_fruit, self.bbq, 

self.selectedfruit()); 
     self.setShowType = function(d, ele) { 
     this.get_updates = function() { 
     ko.mapping.fromJS(searchList(), self);}; 


      self.showtList = makeShowObjectList(BucketViewModel, urls.get_fruit_info, self.fruit_page, self.num_fruit, self.b, self.selectedfruit()); 
     self.showtList(); 


    } 

self.ShowmessageList = function() { 
     return self.showtList; 
    } 


} 

HTML :

<script> 
VarModel = new FViewModel(c_data); 
$(function() { 
     function get_updates() { 
     $.getJSON('/new-lines.json', function(c_data) { 
     var VarModel = ko.mapping.fromJS(choices_data); 

      ko.applyBindings(VarModel); 


      }); 

다음은 knockout.js, HTML과 view.py 페이지 내 코드입니다 .. 하나라도 해결책을 알고 있습니까 } ko.applyBindings (VarModel);

</script> 
<body> 
<select id="fruit" name="fruit" style="width:200px;" data-bind = " 
     value: selectedfruit, 
     options:  fruitFilter, 
     optionsText: 'n', 
     optionsValue: 'i', 
     optionsCaption: 'Select a fruit' 
    "> 

     </select> 

     <select style="width:180px;" data-bind = " 
     value: selectedVege, 
     options:  VegeFilter, 
     optionsText: 'n', 
     optionsValue: 'i', 
     optionsCaption: 'Select a Vege' 
    "> 
우리는
</body> 

Views.py 우리의 열 을 보이고있다 // 여기에 :

def urls.get_fruit_info(request): 

     //we are calculating the page_object here 

     response_object = { 
     'page': page_object, 
     'no_not': FruitRecipient.objects.filter(user=request.member, add_at=None).count() 
     } 
     return HttpResponse(simplejson.dumps(response_object, indent=3)) 

내가 woul 어느 누구라도 내 문제를 해결하는 데 나를 도울 수 있다면 감사해야한다. 미리 감사드립니다. 다운로드 할 수있는 자사의 플러그인을 ko.mapping

답변

0

사용, 그것은 단지, 따라서 변경된 구성원 만이 내가 다운로드 한

+0

뷰에서 다시 렌더링 다시됩니다 두 상태 사이 변경된 관찰 가능한를 업데이트 knockout.mappings-latest.js (버전 2.0). 그리고 나서 그것을 코드에 적용했습니다.하지만 이전에 같은 문제에 직면했습니다. 게시물에서 데이터를 가져올 수는 있지만 테이블에서 데이터를 다시로드 할 수는 없습니다. ko.mappings를 사용한 후 위의 코드를 업데이트했습니다 ... 어디에서 잘못했는지 도와주세요. 가능한 한 내 코드를 수정할 수 있다면 기뻐할 것입니다 ... – aagrawal

+0

http :// /jsfiddle.net/5QrHv/1 – Anders

관련 문제