根据复选框条件过滤 div/表格行 -Javascript/JQuery
请参阅:mycellularcenter.com/phones
我想在 javascript/JQuery 中复制此功能,但不太熟悉甚至知道要寻找什么的语言。
就功能而言,我的意思是能够选择左栏中的一个或多个项目,并显示/隐藏右栏的内容以满足选定的复选框条件。
我可以根据其他列中文本的点击来显示/隐藏行/div,但不确定如何连接/迭代?通过多次选择。
感谢建议/帮助。
杰成
Please see: mycellularcenter.com/phones
I want to duplicate this functionality in javascript/JQuery, but am not familiar enough with the language to even know what to look for.
By functionality, I mean the ability to select one or more of the items in the left column and have the content of the right-hand column show/hide to meet the selected checkbox criteria.
I can make rows/divs show/hide based on clicks on text in other columns, but not sure how to concatenate/iterate? through multiple selections.
Advice/help is appreciated.
JC
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(5)
这是通过 ajax 请求完成的
,它获取表单数据,通过 ajax 请求将其发送到服务器,服务器处理表单数据,在数据库中执行搜索,然后将 json 或 xml 返回到 javascript,然后动态构建每个项目的每一行
This is done with an ajax request
it grabs the form data, sends it via an ajax request to the server and the server processes the form data, performs the search in it's database and then returns either json or xml to the javascript which then dynamically builds each row for each item
您当然可以使用 AJAX 来完成此操作。另一种选择是使用 jQuery
filter()
函数。You certainly do this with AJAX. Another alternative is to use the jQuery
filter()
function.在服务器端执行它肯定更容易,但这不是必须的,特别是如果您不会使用非常复杂的过滤器
看看这个 jQuery 插件
http://plugins.jquery.com/project/uiTableFilter
Doing it server side it's surely easier, but it's not a must, especially if you will not use very complex filters
Take a look at this jQuery plugin
http://plugins.jquery.com/project/uiTableFilter
您需要做的就是查看复选框何时更改,然后将内容(通过 ajax,使用 xml/html/json)重新加载到 div 中。
http://jsfiddle.net/mazzzzz/ABk4R/6/ 是我将使用的javascript ,
php 类似于:
script.php
每个复选框都会发送到 $_POST 变量中的 php,因此 checkbox
会可以使用
$_POST['te']
进行访问(如果复选框被选中,则为 true,否则为 false)。然后将此页面生成的 html 放入container
div 中(替换该 div 中的旧内容)。What it looks like you would need to do is see when a checkbox has been changed, and reload the content (through ajax, with xml/html/json) into the div.
http://jsfiddle.net/mazzzzz/ABk4R/6/ is the javascript I would use,
and the php would be something like:
script.php
Each checkbox is sent to the php in the $_POST variable, so checkbox
<input type="checkbox" value="te" />
would be accessed with$_POST['te']
(which is true is the checkbox is checked, and false if not). Then the html generated by this page is put into thecontainer
div (replacing the old content in that div).我最近做了类似的事情,并且能够将其重构为我认为您想要的内容。这里解释得太详细了,所以请查看代码中的注释,以及这个示例:
http://jsbin。 com/adaru3/编辑
I recently did something like this, and was able to refactor it to what I believe you want. It's too detailed to explain in here, so check out the comments in the code, and this example:
http://jsbin.com/adaru3/edit