2

我正在使用版本 2012.1.322 的 Kendo UI。

我有一个 Kendo UI ListView。我正在使用传输剑道数据源(使用返回 JSON 的 GET 调用 Web 服务)。我希望在绑定 ListView 后运行一些 javascript。

我的目标是让每个列表项都使用剑道拖放框架

是否有像“dataBound”、“success”这样的事件或某种技巧来实现这一点。

这是示例代码

<script type="text/javascript">
  $(document).ready(function() {
    $("#fileAlist").kendoListView({
        template: "<li class=\"draggable\">${Name}</li>",
        dataSource:
            new kendo.data.DataSource({
                transport: {
                    read: {
                        url: 'http://www.somedomain.com/search',
                        dataType: "json",
                        type: "GET",
                        contentType: "application/json; charset=utf-8"
                    }
                }
            })
    });
  });
</script>

我希望在数据通过异步数据源绑定后触发它,以便每个都<li>成为可拖动的对象。

$(".draggable").kendoDraggable();

我尝试过的一些事情

  • 我尝试使用dataBound event,但这会在它获取数据并且尚未呈现列表后立即触发。

  • 我尝试了change event,但这似乎在数据绑定过程中没有触发,我希望它在完成渲染后会触发。没有这样的运气。

4

2 回答 2

2

试试这个:

标记列表视图,这将需要更改样式,因为列表视图的边框在项目符号中间看起来很奇怪。这将展示所需的功能。

<ul>
     <div id="contactList" style="width: 400px;"></div>
</ul>

剑道 javascript

<script type="text/javascript" >
  $(document).ready(function () {
      var datasource = new kendo.data.DataSource({
          transport: {
              read: {
                  url: "...",  
                  dataType: "json",
                  contentType: "application/json; charset=utf-8",
                  type: "GET"
              }
          }
      });

      var contactsListView = $("#contactList").kendoListView({
          dataSource: datasource,
          template: '<li>${ Name }</li>'
      }); 

      contactsListView.kendoDraggable({
          filter: "div > li",  //select all li elements in the #contactList div
          hint: function(row) {
              return row.clone();  //returns the same mark up as the template <li>some name</li>
          }
      });
  });

</script>​
于 2012-06-27T15:38:23.587 回答
0

您可以使用 kendoDraggable "filter" 属性,它将接受任何有效的 Jquery 过滤器。这是与 kendo ui 在列表视图之间拖放的工作示例的链接。 Kendo UI 在 Listviews 之间拖放的分步教程

希望这会帮助你。

于 2013-11-19T05:59:47.567 回答