Question

我有一个包含在表格的每一行中的选择框 - 我想允许用户更改该选择框的值，该值触发更新到MySQL而无需重新加载页面等

当有一行时，我已经能够使用Ajax工作了，但是当它们是多行时，它会断开，因为当多个存在时，jQuery无法知道我指的是哪个id或类。

当用户更改tr id 1中的select时，我想将tr id传递给行，将所选的阶段传递给val，这样我就可以通过Ajax发送它来更新（例如1,3）然后如果它们更新第2行中的select，它应该发送2,1例如。

HTML

<table>
<tr id="1">
<td>
<select name="dropdown" class="stage">
<option value="1">Stage 1</option>
<option value="2">Stage 2</option>
<option value="3">Stage 3</option>
</select>
</td>
</tr>
<tr id="2">
<td>
<select name="dropdown" class="stage">
<option value="1">Stage 1</option>
<option value="2">Stage 2</option>
<option value="3">Stage 3</option>
</select>
</td>
</tr>
</table>

然后在jQuery我正在使用：

$(document).on('change', '.stage',function(e)
{
    var row = $(".stage").parent("tr").attr("id");

    var val = $('.stage').val();
    e.preventDefault();

    console.log(row);
    console.log(val);

    $.ajax({
        url:'updateStage.php',
        type:'post',
        data: {"row": row,"stage": val}
    });             

});

然后在updateStage.php中我获取了row和val的post值以及更新MySQL - 我没有包含该代码，因为它可以正常工作，只要我能够传递给它的正确值。

当我更改选择时，在控制台中我会看到：

undefined
3

这指向没有获得TR的ID，但是当我更改第二个选择时，这并不总是更新为正确的值，而是取第一个选择的值。

Answer 1

更改

var row = $(".stage").parent("tr").attr("id");

到

var row = $(this).parents("tr").attr("id");

Answer 2

按以下方式更改HTML

<tr data-id="1">
<td>
<select name="dropdown" class="stage">
<option value="1">Stage 1</option>
<option value="2">Stage 2</option>
<option value="3">Stage 3</option>
</select>
</td>
</tr>
<tr data-id="2">
<td>
<select name="dropdown" class="stage">
<option value="1">Stage 1</option>
<option value="2">Stage 2</option>
<option value="3">Stage 3</option>
</select>
</td>
</tr>

将jQuery更改为如下

var row = $(this).closest("tr").data("id");

Answer 3

你必须使用

//you are accessing current change element then use "this"
var row = $(this).parents("tr:first").attr("id");`

和

//var val = $('.stage').val();
var val = $(this).val();

Answer 4

In [185]: df.groupby('A')['B'].apply(' '.join) Out[185]: A bar who are you cat he said hello foo i am satya Name: B, dtype: object为您提供直接的父母。

你真正想要的是

var row = $(".stage").parent("tr")

将数据库从更改更新为在表行中选择

4 个答案: