发布
社区首页 >问答首页 >使用LIKE运算符选择所有与模式匹配的复选框

使用LIKE运算符选择所有与模式匹配的复选框
EN

Stack Overflow用户
提问于 2015-06-26 01:11:32
回答 2查看 250关注 0票数 0

我需要一点指导。我有一个HTML表单,它由一个非常长的项目列表组成,这些项目是从一个数据库查询生成的数组中拉出的(这是一个大学课程列表)。用户需要能够选择与他们的研究相关的尽可能多或尽可能少的课程:因为列表可以有数百个或多个项目,所以我有“全选”和“不选”功能,并添加了jQuery shift-select批量选择器,以使这一点尽可能简单。

但是,我也希望他们能够在输入框中输入一些文本,然后单击APPLY以选中标签文本模式使用LIKE操作符匹配的所有复选框(即,如果他们想要所有数学课程,或所有2xx级别的课程)。该项目使用PHP和JavaScript/jQuery/AJAX。

我知道如何基于LIKE查询从数据库中提取数据,但我只是有点困惑于如何最好地遍历生成的表单并将表单中的项作为目标。(我的PHP相当强大,我的jQuery有点不稳定)。

复选框列表是通过循环遍历数组生成的,每个项目的设置如下所示:

代码语言:javascript
代码运行次数:0
复制
$o .= '<input id="'.$rw[2].'_'.$rw[0].'"
type=checkbox  name="' . $rw[2].'_'. $rw[0]. '" />';
$o .= '<label for="'.$rw[2].'_'. $rw[0].'"> ' . $rw[1] . '</label>';
$o .= '</td>';

因此,我们最终得到了一个简单的复选框表单,其中包含一个标签和标签文本,并且所有项都被命名为数组键。

以下是典型项目的HTML输出:

代码语言:javascript
代码运行次数:0
复制
<tr><td><input id="110_105" type=checkbox name="110_105" />
<label for="110_105"> PHIL233</label></td></tr>

抱歉,如果这个描述有点长,但我需要的是一个想法,如何在生成后循环通过表单的元素,以选中模式匹配的每个项目的复选框。

希望这是有意义的!

塔姆拉

EN

回答 2

Stack Overflow用户

发布于 2015-06-26 02:13:27

这种情况非常适合使用AJAX过滤复选框列表。相反,我极力主张这样做。

但是如果你的需要在客户端进行过滤,使用JavaScript就相当简单了。

代码语言:javascript
代码运行次数:0
复制
//give the labels a class so they are easy to find
var labels = document.getElementsByClassName('course-name');
//filtering text field
var query = document.getElementById('query');
//'apply' button
var queryBtn = document.getElementById('query-submit');

queryBtn.addEventListener('click', function() {

    for (var i = 0; i < labels.length; i += 1) {

        var label = labels[i];
        var text = label.innerText;

        if (text === query.value) {

            label.previousElementSibling.checked = true;
        }
    }

}, false);
票数 0
EN

Stack Overflow用户

发布于 2015-06-26 02:17:19

您可以使用jQuery find方法进行尝试。

http://api.jquery.com/find/

有了它和“属性包含选择器”,你就可以做到这一点。

http://api.jquery.com/attribute-contains-selector/

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/31056614

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档