jquery 将元素追加到动态列表中
在我的页面中,我有:
数据库加载的约会列表按日期时间 DESC 排序。
搜索栏用于细化我的元素列表(通过 GET 请求)
- < p>表单向数据库添加新元素
我希望能够添加新约会“Y "(使用 Jquery)并将其附加到列表中,而不会丢失日期时间顺序。
如果列表是静态,我可以在数据库中查询第一个约会,该约会的日期时间正好在“约会 Y”之前获取其 ID(例如“2”),然后用 jquery 放置我的新“约会 Y”在 ID=2 的元素之后。
但是使用 动态 列表不起作用,因为元素 ID=2 可能不存在,jquery 不知道在哪里放置我的“约会 Y”。 我认为,我只需要在列表中出现的那些元素之间查询数据库。
我应该通过 jquery 发送预约数据以及用于搜索的 GET 变量吗?我如何获取它们?
in my page I have:
a DB-loaded list of appointments ordered by datetime DESC.
a search bar to refine my list of elements (through GET requests)
a form to add a new element to DB
I want to be able to add a new appointment "Y" (with Jquery) and append it in the list without losing the datetime order.
If the list was static I could query DB for the first appointment wich datetime comes right before "appointment Y" get its ID (Ex."2") and place with jquery my new "appointment Y" right after the element with ID=2.
But with a dynamic list that wouldn't work,cause element ID=2 might not be there and jquery wouldnt know where to place my "appointment Y"..
I would need to query DB only between those elements that appear in the list..I think.
Should i send over through jquery, with the appointment data, also the GET variables i used for the search?And how i get them?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
您可以使用模板 (tmpl) 和 $.ajax 的组合。将新约会添加到数据库后,您可以调用 JavaScript 函数来调用 $.ajax 调用。在回调函数中,您可以将新更新的 json 数据注入到模板中。这种类型的工作流程将允许您更新列表而无需刷新页面。
以下是有关 jQuery 模板入门的更多信息...
http://www.borismoore.com/2010/09 /introducing-jquery-templates-1-first.html
You could use a combination of templates (tmpl) and $.ajax. After the new appointment has been added to the database you can call a JavaScript function to invoke an $.ajax call. In the callback function you can then inject the newly updated json data into a template. This type of workflow will allow you to update lists without a page refresh.
Here's more information on getting started with jQuery templates...
http://www.borismoore.com/2010/09/introducing-jquery-templates-1-first.html