根据名称/id的一部分选择复选框

Selecting checkboxes based on part of name/id

本文关键字:一部分 选择 复选框 id      更新时间:2023-09-26

我有cakephp模型结构文档->节->变量

我被告知我的问题涉及javascript/jQuery而不是cakePHP。如果人们不得不从之前的cakephp问题中重新阅读这篇文章,我深表歉意。

在一个表单中,我希望能够列出所有变量,但嵌套在文档中,然后是节级别。

我希望在变量级别的每个项目旁边都有复选框-允许选择变量。

我想要一个section级的复选框,当被选中时,将为该section中的变量选择所有的复选框。

我想要一个复选框在文档级别,这样当被选中时,它会选择所有的复选框为该文档的变量(即在所有节)

为了方便起见,我这样命名复选框(好吧,我已经设置了id)(伪代码):

document level: id = Document id
section level: id = Document id_Section id
variable level: id = Document id_Section id_Variable_id

我的希望是,如果我选择节级别复选框,我可以通过使用文档id_Section_id存根在可变级别复选框的所有id的开头来设置该节的所有可变级别复选框…但也许我是在抓救命稻草?

以下是关卡中复选框的示例:(为布局道歉)

<?php
//Document level
//all of this within a ForEach loop for documents
echo "<table>";
echo "<tr><td>Collection dates</td><td>".$project_document['data_collection_dates']."</td>";
echo "<td>Select (toggle) all variables"
        .$this->Form->checkbox($project_document['id'], // note that this sets the chkbox id to the value of the current document id
                            array('hiddenField' => false,'onclick'=> 'SelectSection(this,this.name,this.checked);'))
                            ."</td></tr>";
echo "</table>";
foreach ($project_document['ProjectDocumentSection'] as $project_document_section): 
    echo "<h4>" .  $project_document_section['title']. "</h4>";
    echo "<table>";
    echo "<tr><td>Collection Method</td><td>" . $project_document_section['method']. "</td></tr>";
    echo "<tr><td>Collection objective</td><td>" . $project_document_section['objective']. "</td>";
    echo "<td>Select (toggle) all section variables"
            .$this->Form->checkbox($project_document['id']
                ."_".$project_document_section['id'] // and here the chkbox id is set to combination of document id and section is (using _ as separator)
                , array('hiddenField' => false))."</td></tr>";
    echo "</table>";
        echo "<table><tr><th>Full text</th><th>Type</th><th>Format</th><th>Codeset</th></tr>" ; // header for variable table
        foreach ($project_document_section['ProjectDocumentSectionVariable'] as $project_document_section_var):
            echo"<tr><td>".$project_document_section_var['variable_type'] 
                            ."</td><td>".$project_document_section_var['variable_format'] 
                            ."</td><td>";
            echo "<td>".$this->Form->checkbox($project_document['id']
                    ."_".$project_document_section['id']
                        ."_".$project_document_section_var['id'], array('hiddenField' => false))."</td></tr>";
        endforeach;
        echo "</table>";
endforeach;
// and later endforeach for the document itself
?>

渲染后可能是这样的;

<td>Select (toggle) all variables
<input type="checkbox" name="data[Project][11]"  onclick="SelectSection(this,this.name,this.checked);" value="1" id="Project11"/>
// note that checkbox id and name include ref to document id (11)
</td></tr>
<h4>Details of Health Workers at Facility</h4>
<table>
 <tr><td>Collection Method</td><td>FW completed evaluation on paper</td></tr>
<tr><td>Collection objective</td><td>blah blah blah blah</td>
<td>Select (toggle) all section variables
<input type="checkbox" name="data[Project][11_24]"  value="1" id="Project1124"/></td></tr>
// note that checkbox id and name include ref to document id (11) and section id (24)
</table>
<table>
<tr><th>Full text</th><th>Type</th><th>Format</th><th>Codeset</th></tr>
<tr><td>Site</td><td>Categorical</td><td>Quantative</td>
<td><input type="checkbox" name="data[Project][11_24_402]"  value="1" id="Project1124402"/></td></tr>
// note that checkbox id and name include ref to document id (11), section id (24) and variable id (402)
<tr><td>Facility</td><td>Categorical</td><td>Quantative</td>
<td><input type="checkbox" name="data[Project][11_24_403]"  value="1" id="Project1124403"/></td></tr>
<tr><td>Name</td><td>Text</td><td>Quantative</td>
<td><input type="checkbox" name="data[Project][11_24_404]"  value="1" id="Project1124404"/></td></tr>
<tr><td>Position of Health Worker</td><td>Text</td><td>Quantative</td>
<td><input type="checkbox" name="data[Project][11_24_405]"  value="1" id="Project1124405"/></td></tr>
<tr><td>Description</td><td>Text</td><td>Quantative</td>
<td><input type="checkbox" name="data[Project][11_24_406]"  value="1" id="Project1124406"/></td></tr>
<tr><td>Interviewer Code</td><td>Categorical</td><td>Quantative</td>
<td><input type="checkbox" name="data[Project][11_24_407]"  value="1" id="Project1124407"/></td></tr>
<tr><td>Date of Facility Visit </td><td>Date</td><td>Quantative</td>
<td><input type="checkbox" name="data[Project][11_24_408]"  value="1" id="Project1124408"/></td></tr>
</table>

有谁对如何处理这个问题有什么建议吗?我相信杀死这只鸟的方法不止一种

您是否尝试过使用jQuery选择器,更具体地说,属性以选择器开始?

以下代码选择type属性为复选框name属性以data开头的input。然后它将为每个相应的元素添加一个类(在本例中,类myNewClass将被添加到找到的每个元素中)。

Javascript

$('input[type="checkbox"][name^=data]').addClass('myNewClass');