Kendo ListView with Popup Editor

我想在弹出窗口中编辑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>

来源

2013-04-17 user1751029

你可以用这段代码做一个jsFiddle吗？还有：变量访问应该看起来像：＃= StuId＃，如果我没有弄错的话。 – Shion

你有没有想过这个？我想做同样的事情。 – csmithmaui

在代码中，我可以看到两个问题

，

你正在绑定listview与标识符#listView - 我不能看到标识符我在给定的HTML。

在HTML中，您已将模板标识符设置为＃win-template，并且在Javascript代码中，标识符是#template - 它应该是相同的。

而且#pager标识符未在HTML中给出。

来源

2013-04-22 09:15:20

Kendo ListView with Popup Editor

回答

相关问题