Question

在我的网页上，我使用了创建了一个Html表 c＃功能，

public String TableForView(DataTable ViewTable)
    {
        StringBuilder html = new StringBuilder();
        try
        {
            if (ViewTable.Rows.Count > 0)
            {
                html.Append("<table id='shTable' class='table table-striped table-bordered'>");

                html.Append("<thead>");
                html.Append("<tr>");
                foreach (DataColumn column in ViewTable.Columns)
                {
                    html.Append("<th>");
                    html.Append(column.ColumnName);
                    html.Append("</th>");
                }
                html.Append("<th>");
                html.Append("Action & View");
                html.Append("</th>");
                html.Append("</tr>");
                html.Append("</thead>");
                html.Append("<tbody>");
                foreach (DataRow row in ViewTable.Rows)
                {
                    html.Append("<tr>");
                    foreach (DataColumn column in ViewTable.Columns)
                    {
                        html.Append("<td>");
                        html.Append(row[column.ColumnName]);
                        html.Append("</td>");
                    }
                    html.Append("<td>");
                    html.Append("<input type='checkbox' id='" + row["AccNo"] + "' name='" + row["AccNo"] + "' class='ChBoxVal' checked=''>");
                    html.Append("</td>");
                }
                html.Append("</tbody>");
                html.Append("</table>");
            }
            else
            {
                html.Append("<h4>NO DATA AVAILABLE</h4>");
            }
        }
        catch (Exception ex)
        {
            Error_ManagerClass em = new Error_ManagerClass();
            em.WriteError(ex);
        }
        return (html.ToString());
    }

现在，我需要使用jquery将所有checkbox id（如果checked = true）的列表作为json字符串。
为此，我尝试使用以下函数来获取值

的jQuery

var arrayOfValues = [];
        $('[id*=btnSave]').click(function () {
            event.preventDefault();

            var tableControl = document.getElementById("shTable").getElementsByTagName("tr");

            for (var i = ((rows.length) - 1) ; i >= 1; i--) {
                var ChValue = document.getElementById("shTable").rows[i].cells[4].children[0].value;

                arrayOfValues = $('input:checkbox:checked', tableControl).map(function () {
                    return $(this).closest('tr').find('td:last').text();
                });
            }

        });

但是这个函数没有返回任何值。我是jquery的新手，我不知道这是否正确编写jquery函数...

请帮我解决方案或告诉我在哪里寻找这个解决方案。

Answer 1

使用input[type="checkbox"]选择复选框，并按以下方式选中过滤器：

var getChecked = function() {
  return $('#shTable').find('input[type="checkbox"]')
                      .filter(':checked')
                      .toArray()
                      .map(function(x) {
                         return $(x).attr('id');
                      });
}
$(document).on('click', '#getIds', function() {
  console.log(getChecked());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="shTable">
  <tr>
    <td><input id="1" type="checkbox" /></td>
    <td>One</td>
  </tr>
  <tr>
    <td><input id="2" type="checkbox" /></td>
    <td>Two</td>
  </tr>
  <tr>
    <td><input id="3" type="checkbox" /></td>
    <td>Three</td>
  </tr>
  <tr>
    <td><input id="4" type="checkbox" /></td>
    <td>Four</td>
  </tr>
</table>

<button id="getIds" type="button">Get ids</button>

Answer 2

$.each("#shTable tbody tr td input[type=checkbox]:checked",function(index,element){
    var $checkBox = $(element);
    var $checkBoxId  = $checkBox.attr('id');
    // you will get everything about the checkbox
});

使用Jquery从动态html表列获取Checkbox的Id

2 个答案: