Question

这应该是一个客户列表，您可以在其中单击行以选择它们，然后将它们提交到数据库以供cron作业选择它们并向它们发送电子邮件。

我正在尝试突出显示行而不是使用复选框，这就是我放置两个隐藏元素的原因一个用于客户端ID，另一个用于检查行是否已被点击。

我无法弄清楚如何切换特定行的元素值（已选中）。

<table>
<tbody>
<tr class="contactrow">
<input type="hidden" name="id" value="995"/>
<input type="hidden" name="checked" value="FALSE"/>
<td>Andrew Ostrich</td>
<td>AO Company</td>
<td>7537535</td>
<td>ao@aocompany.com</td>
</tr>
<tr class="contactrow">
<input type="hidden" name="id" value="296"/>
<input type="hidden" name="checked" value="FALSE"/>
<td>Brendon Evans</td>
<td>Institute of Modern Arts</td>
<td>648648468</td>
<td>bevans@ioma.co.uk</td>
</tr>
<tr class="contactrow">
<input type="hidden" name="id" value="421"/>
<input type="hidden" name="checked" value="FALSE"/>
<td>Rudy Thompson</td>
<td>Marine CORP</td>
<td>95939288</td>
<td>Rudee@mcorp.es</td>
</tr>
</tbody>
</table>

也， http://jsfiddle.net/FHjAc/

Answer 1

部分问题是服务器无法识别已检查的客户端ID。所有input[type=checkbox]共享相同的name属性，这是用于标识每个参数的属性。

如果您将name属性更改为checked[__ID__]，则可以循环参数并将这些记录提交到数据库。

在PHP中，您可以执行以下操作。

<?php

$checked = $_POST['checked'];

foreach( $checked as $id ) {
  // do something with the $id here
}

更新

我没有意识到你在检查字段中使用了隐藏的输入。如果您将其更改为复选框，那么您的工作应该会轻松得多。

HTML 这是我对HTML进行标记的方法，您可以使用CSS隐藏display: none复选框。

<tr class="contactrow">
  <td>
    <input type="checkbox" name="checked[421]" />
    Rudy Thompson
  </td>
  <td>Marine CORP</td>
  <td>95939288</td>
  <td>Rudee@mcorp.es</td>
</tr>

<强>的jQuery

$(function () {
  $('.contactrow').click(function () {
    var checkbox = $(this).find('input[type=checkbox]');
    checkbox.prop('checked', !checkbox.prop('checked'));
    $(this).toggleClass('contactrow_highlight');
  });  
});

Answer 2

我对此进行了测试，它对我有用。

$(function () {
    $('.contactrow').click(function () {
        $(this).toggleClass("contactrow_highlight");
        $(this).find("input").each(function(){
            if($(this).attr("name") == "checked"){
                if($(this).val() == "FALSE"){
                    $(this).val("TRUE");
                } else {
                    $(this).val("FALSE");                   
                }
            }
        });
    });
})

Answer 3

你走了： http://jsfiddle.net/AuYZf/1/

您可以获取您单击的行元素的第一个子元素的兄弟，第三个子元素似乎是所需的元素。然后你可以简单地切换值：

var inputElement = this.firstChild.nextSibling.nextSibling.nextSibling;
inputElement.value = (inputElement.value != "true")

（我用过！=因为字符串“false”仍然评估为真）它甚至不使用jQuery来遍历所有内容。

单击行的Jquery切换元素

3 个答案:

更新