2013-04-17 2 views
1

팝업 창에서 listview 항목을 편집하고 싶습니다. 나는 여러 가지 예들을 함께 엮어 봤지만, 뭔가 빠뜨려 야합니다. 여기에 내가 가지고있는 것이 있지만 팝업 창 템플릿을 listview의 데이터 소스에 바인딩하는 방법을 알 수는 없습니다.Kendo ListView with Popup Editor

창 템플릿 :

<div id="window"></div> 

<script type="text/x-kendo-template" id="win-template"> 
     <div>#:StuId#</div> 
</script> 

검도/jQuery를 코드 : 나는이 문제를 볼 수있는 코드에서

<script> 
    $(document).ready(function() { 
      var dataSource = new kendo.data.DataSource({ 
       pageSize: 50, 
       transport: { 
        read: { 
         url: "GetData.asmx/GetStudentsByFeederId", 
         dataType: "xml", 
         data: { feederId: ("0123") } 
        } 
       }, 
       schema: { 
        type: "xml", 
        data: "/ArrayOfStudentVO/StudentVO", 
        model: { 
         id: "student_id", 
         fields: { 
          StuId: { field: "student_id/text()", type: "string" }, 
          StuName: { field: "stu_name/text()", type: "string"}, 
          MathRec: { field: "math_rec/text()", type: "string" }, 
          EnglishRec: { field: "english_rec/text()", type: "string" } 
         } 
        } 
       } 
      }); 

      /* PAGER FUNCTION (Used in ListView) */ 

      $("#pager").kendoPager({ 
       dataSource: dataSource 
      }); 

      /* LIST VIEW CREATION */ 

      var listView = $("#listView").kendoListView({ 
       editable: "true", 
       selectable: "true", 
       dataBound: onDataBound, 
       change: onChange, 
       dataSource: dataSource, 
       template: kendo.template($("#template").html()) 
      }).data("kendoListView"); 

      function onChange() { 
       var data = dataSource.view(); 
       selected = $.map(this.select(), function(item) { 
        return data[$(item).index()].StuId; 
      }); 

      kendoConsole.log("Selected: " + selected.length + " item(s), [" + selected.join(", ") + "]"); 
      popUp(selected); 
     } 

     function popUp(d) { 
      var window = $("#window"), 
       undo = $("#undo") 
         .bind("click", function() { 
          window.data("d").open(); 
          undo.hide(); 
         }); 

      if (!window.data("d")) { 
       window.kendoWindow({ 
        width: "600px", 
        title: "Student Information", 
        close: onClose, 
        content: { template: kendo.template($("#win-template").html()) } 
       }); 
      } 
     } 

     var onClose = function() { 
       undo.show(); 
      } 

    </script> 
+0

이 코드로 jsFiddle을 만들 수 있습니까? 또한 변수 액세스는 다음과 같이 표시됩니다. # = StuId #, 내가 실수하지 않는다면. – Shion

+0

혹시 이것을 알아 냈습니까? 나는 똑같은 일을하고 싶다. – csmithmaui

답변

0

,

다음

내가이 접근 한 방법이다

당신은 목록보기를 식별자 #listView로 바인딩하고 있습니다. 그 식별자 i를 볼 수 없습니다. 주어진 HTML.

HTML에서는 템플릿 식별자를 # win-template으로 지정하고 자바 스크립트 코드에서 식별자는 #template이며 동일해야합니다.

또한 #pager 식별자가 HTML에 제공되지 않습니다.