title: Kendo ListView with Popup Editor
body: <p>I'd like to edit listview items in a pop-up window. I've pieced together some of the different examples, but must be missing something. Here is what I have, but I can't figure out how to bind a pop up window template to the listview's datasource.</p>
  
  <p>Here is how I have approached this:</p>
  
  <p>Window Template:</p>
  
  <pre><code>&lt;div id="window"&gt;&lt;/div&gt;
  
  &lt;script type="text/x-kendo-template" id="win-template"&gt;
          &lt;div&gt;#:StuId#&lt;/div&gt;
  &lt;/script&gt;
  </code></pre>
  
  <p>Kendo/jQuery Code:</p>
  
  <pre><code>&lt;script&gt;
      $(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();
              }
  
      &lt;/script&gt;
  </code></pre>