ajax成功后在复选框末尾添加一个按钮

Question

当我单击此按钮时，我在 jqGrid 外部有一个单独的按钮，我需要在所选复选框附近添加一个自定义按钮

到目前为止，我得到了复选框 ID，但没有得到如何将图标添加到选定的复选框

$('.lock').click(function() {
    //var grid_selector_second = "#grid-table";
    var grid = jQuery("#grid-table");
    var str = '';
    var i;
       var data = grid.getRowData();
       for(i=0;i<data.length;i++){
           //alert(data[i]);jqg_grid-table_8092415
           //jqg_grid-table_8089033

            if(data[i].checkbox==='Yes')
                str += data[i].id+',';
       }
       alert(str);

});

更新

我有以下 html（例如来自 jqgrid 的 3 行）。当我单击一个按钮时，我正在执行一些 ajax 调用并将 ids 传递给服务器，这些 ids 来自 tr（这可以在下面的 html 中看到）。我正在将一些 id 从服务器返回到客户端。

例如：我将 8089033,8089034,8049033 作为 id 发送，成功后我只从服务器发送 8089033,8089034。我需要在复选框末尾添加一个图标。这只能添加到成功的 id 行。我用

<tr class="ui-widget-content jqgrow ui-row-ltr" tabindex="-1" id="8089033" role="row">
<td aria-describedby="grid-table_cb" style="text-align:center;width: 25px;" role="gridcell"></td>
<td>.....<td>

<td aria-describedby="grid-table_checkbox" title="" style="" role="gridcell">
<input type="checkbox" offval="no" value=""></td></tr>

//second row

<tr class="ui-widget-content jqgrow ui-row-ltr" tabindex="-1" id="8089034" role="row">
<td aria-describedby="grid-table_cb" style="text-align:center;width: 25px;" role="gridcell"></td>
<td>.....<td>

<td aria-describedby="grid-table_checkbox" title="" style="" role="gridcell">
<input type="checkbox" offval="no" value=""></td></tr>
//third row

<tr class="ui-widget-content jqgrow ui-row-ltr" tabindex="-1" id="8049033" role="row">
<td aria-describedby="grid-table_cb" style="text-align:center;width: 25px;" role="gridcell"></td>
<td>.....<td>

<td aria-describedby="grid-table_checkbox" title="" style="" role="gridcell">
<input type="checkbox" offval="no" value=""></td></tr>

Answer 1

这个 jQuery 选择器将在网格中所有选中的复选框之后添加一个图像：

$("#grid-table input[type=checkbox]:checked")
  .after($("<img src='tick.png'>"));

如果您想排除某些复选框，则必须优化选择器，例如在其他列中。

更新了解其他要求：

我假设您从服务器获取返回 ID 作为数组中的 JSON 数据，例如：

var result = [8089033, 8089034];    //will be set by ajax call

$.map(result, function (id) {
    $("#grid-table tr#" + id)
        .find("input[type=checkbox]")
        .after($("<img src='http://www.placehold.it/20x10/ff0000'>"));
    });
});

请注意，这不是检查返回的 ID 表示的行中的复选框是否被选中 - 假设返回的 ID 集是原始集的子集（它们都是 :checked）。

如果您需要再次检查是否已检查，则只需更改为：

.find("input[type=checkbox]:checked")