你会怎么做这个

列表中的项目可以对应于集合中的记录,并且它们在列表中的位置可以对应于每个记录上的字段(“等级”),当“停止”事件发生时,该字段将必须被更新.

流星玩得很好用jQueryUI可排序吗?如果多个用户尝试一次拖动并排序相同的列表,会发生什么?流星需要定制排序行为?

解决方法

编辑:以下答案是过时的,@ cutemachine的答案或 http://blog.differential.com/sortable-lists-in-meteor-using-jquery-ui更接近于最先进的技术.

简短的答案是:如果你想要反应,这不容易.要制作一个非反应版本,只需将你的模板包装在一个{{#constant}}标签中,并以@bento建议的方式连接渲染中的jquery-ui sortable.

为了制作一个反应版本,你可排序的小部件将不得不处理它下面改变的事物(考虑在数据重新排序时中间拖动).这里有一些关于你将如何去做的想法:

>不幸的是,使动画变得不容易,这将导致可怜的用户体验.现在让我们离开吧.
>用以下类似的东西渲染项目:
{{#each items}}
{{>项目}}
{{/项目}}

当数据从服务器(没有动画)下来时,这将重新排序.
>设置渲染时可拖动的每个项目.你也可以

一世.使用像jquery-ui draggable这样的东西,并将其连接到项目模板的渲染中.如果排序从上游更改,则可能在执行此操作时遇到问题,因为底层元素可能在拖动期间消失.

II.实现您自己的拖动代码,也许使用较低级别的库.
>当一个项目被拖入位置时,立即在本地重新排列列表(这样用户应该看到正确的东西,希望服务器会尊重更改..但是我们也不会这样做).

我认为这样一个小部件有很大的需求,以流行的方式完成.这是在我的个人雷达(但是很多事情,包括一个很好的方式来重新排序与动画).

Meteor中的拖放可分类列表的更多相关文章

  1. Meteor作为本机OSX或Windows 8应用程序

    有没有办法把我的meteor应用程序转换成OSX或Windows8上的原生桌面应用程序?我可以把什么东西放到AppStore或者把我的网站上的下载链接作为DMG?

  2. 在Ubuntu 14.04上安装Meteor时出现问题

    我在Ubuntu14.04上安装Meteor时遇到问题.我搜索了之前的答案,但没有一个问题与我有相同的问题.当我运行meteor网站上给出的命令时:我收到以下消息:我已经确保已经安装了curl并运行了sudoupdate-ca-certificates,sudoapt-getupdate和sudoapt-getupgrade,所有这些都有助于以前的海报.我也试过wgethttps://instal

  3. meteor – 返回表达式中不存在最常见的类型

    谢谢由于每个返回分支都需要一种Date类型,因此必须为每个if/else分支返回Date类型,或者您可以创建一个返回两种不同类型的union.在任何一种情况下,如果类型为Date,则可以为第三个条件返回null.这在打字稿中是有效的.

  4. jQuery-Mobile流星样本集成和/或集成指南

    我对Meteor印象深刻,并希望与jQuery-Mobile一起使用它.我想知道有人已经建立了一个示例集成应用程序.如果没有,一些准则会很棒.问候,塞德里克解决方法我也在想这个,所以我做了一个示例应用程序:http://jqmdemo.meteor.com/而且似乎运作良好您可以在这里找到源代码:https://github.com/snez/jqm-meteor在使用两者时有一些问题,请参阅代码

  5. angularjs – angular-meteor基于params找到MongoDb集合和返回

    我试图通过使用Meteor和Angular.js的组合来获取MongoDb中某个地址的警告在我的html文件中,我正在做在我的app.js文件中:我的mongoDb系列:html网页的输出显示整个警告集合(感谢{{currentdispatch.warnings}},但{{currentdispatch.getWarnings(“123TestStreet,TestState”)}}没有显示任何内

  6. angularjs – HTML模板不存在

    错误:[angular-meteor][错误][404]/packages/events/client/events/views/events-list.html–HTML模板不存在!我在Meteor中有一个本地创建的包,带有角度视图和控制器.正确添加html文件和控制器文件.我收到了这个错误.解:模板缓存包含所有已编译的模板,模块指令templateUrl必须具有完全匹配.解决方案是/packa

  7. javascript – Meteor后端代码是否总是在客户端可用?

    我创建了测试Meteor应用程序,我发现可以在客户端上使用dev工具查看整体代码.测试应用程序:这是设计的吗?

  8. javascript – Meteor – 从客户端取消服务器方法

    我通过服务器方法执行数据库计数.用户可以选择如何执行计数,然后调用该方法.我的问题是计数可能需要一些时间,用户可能会在方法运行时改变主意,并请求不同的计数.我有办法取消调用的方法并运行新的计数吗?

  9. javascript – 访问Meteor中的node.js文件系统模块

    我正在创建一个网络应用程序,它将编辑存储在用户HD上的一些配置文件,并决定给Meteor一个镜头.我想使用Node.js的文件系统模块来处理配置文件的I/O,但是我还没有弄清楚如何包含模块.经过一些搜索,我在StackOverlow上找到了以下代码,这应该允许我要求模块:然而,即使这样放置在我的代码的if(服务器)部分的内部,我的应用程序仍然抛出一个错误,并告诉我’fs’是未定义的.有没有人遇到这个问题?解决方法从0.6.0你需要使用Npm.require

  10. javascript – Meteor DDP:如何在将新文档添加到集合时收到通知

    向下部分,并且应该非常清楚如何仅为真正的新文档发送添加的消息.或者提供一个简单的例子:服务器和客户端:客户:服务器:UPDATE这是如此根本我实际上写了一个关于它的blogpost.

随机推荐

  1. jquery-plugins – 是否可以使用猫头鹰旋转木马实现循环/无限轮播?

    我正在使用猫头鹰旋转木马,它的工作完美,除了它不支持循环/无限滚动.我没有搜索google和stackoverflow的想法,没有运气.有没有人在猫头鹰旋转木马上实现圆形/无限滚动?

  2. jQuery动态输入字段焦点

    我想使用以下jQuery向我的页面动态添加一个输入字段:在这样做之后,我希望输入字段具有闪烁的文本光标的焦点,所以我想在创建后立即输入.有人可以告诉我我该怎么办?

  3. jquery – 为什么$(window).height()这样错了?

    我试图获取当前浏览器的视口高度,使用但我得到的价值观太低了.当视口高度高达850px时,我从height()获取大约350或400像素的值.这是怎么回事?

  4. jquery – 如果在此div之外和其他draggables内部(使用无效和有效的还原选项),则可拖动恢复

    例如这样但是由于明显的原因,这不行.我可以说这个吗?

  5. 创建一个jQueryUI 1.8按钮菜单

    现在jQueryUI1.8已经出来了,我正在浏览更新,并且遇到了新的Buttonwidget,特别是SplitButtonwithadropdown的演示之一.这个演示似乎表明Buttonwidget可以在这里创建一个下拉菜单.作为讨论的问题,我想知道使用这个新的Button小部件来创建一个下拉菜单有什么方法.干杯.解决方法您必须在按钮下方列出一个列表,方式类似于此处为自动完成提供的演示:http

  6. 灰色divs使用JQuery

    我试图使用这个代码:为了淡出一大堆名为MySelectorDiv的div,唯一的是,它只会淡出第一个而不是所有的div,为什么呢?

  7. 使用jQuery动态插入到列表中

    我有两个订单列表在彼此旁边.当我从一个列表中选出一个节点时,我想按照字母顺序插入到另一个列表中.抓住的是我想要把一个元素放在另一个列表中,而不刷新整个列表.奇怪的是,当我插入到右边的列表中,它工作正常,但是当我插入到左边的列表中时,顺序永远不会出来.我也尝试将所有内容读入数组,并将其排序在一起,以防止children()方法没有按照显示顺序返回任何东西,但是我仍然得到相同的结果.这是我的jQuer

  8. 没有回应MediaWiki API使用jQuery

    我试图从维基百科获取一些内容作为JSON:但我没有回应.如果我粘贴到浏览器的地址栏,就像我得到预期的内容.怎么了?解决方法您需要通过添加&callback=?来触发具有$.getJSON()的JSONP行为?在querystring上,像这样:Youcantestithere.没有使用JSONP,你正在击中same-originpolicy,阻止XmlHttpRequest获取任何数据.

  9. jQuery Ajax请求每30秒

    我有这段代码,但是有些人在我的网站上的值可能会改变.我需要每30秒钟更新一次#financediv.这可以做吗解决方法您可以将代码放在单独的函数中,如下所示:然后每30秒建立一个定时器调用该函数:祝你好运!总结以上是DEVMAX为你收集整理的jQueryAjax请求每30秒全部内容。如果觉得DEVMAX网站内容还不错,欢迎将DEVMAX网站推荐给好友。

  10. jquery – keypress事件在IE和Chrome中不工作,但在FF工作

    任何想法为什么会这样发生?我通常认为Chrome会更加宽容代码?这是我的按键键.我错过了什么吗?右图();和leftimage();是应该工作的功能,因为我在其他地方使用这些功能谢谢您的帮助!

返回
顶部