javascript - 如何使用 ajax-jquery 将选定的复选框数据获取到使用 PHP-CodeIgniter 的模态

Question

如何在所有行中使用带有复选框的 HTML 表以及单击按钮时我想将那些选定的复选框 ID 设置为模式。所以我想使用 ajax 从数据库中获取所选 ID 的相关数据，并使用 PHP-CodeIgniter 以模式显示在表格中。有人可以帮我得到这个吗？

我尝试了很多方法，但都失败了。

非常感谢。

请看我的代码。

在我的VIEW页表上

<table id="dynamic-table">
        <thead>
            <th> Check</th>
            <th> Name</th>
            <th> Country</th>
        </thead>
        <tbody>
            <tr>
                <td> <input type="checkbox" name="ch1" value="1"> </td>
                <td> Rashid </td>
                <td> India </td>
            </tr>
            <tr>
                <td> <input type="checkbox" name="ch1" value="2"> </td>
                <td> Nishad </td>
                <td> India </td>
            </tr>
            <tr>
                <td> <input type="checkbox" name="ch1" value="3"> </td>
                <td> sajeesh </td>
                <td> India </td>
            </tr>
        </tbody>

    </table>

    <button name="submit" id="subm"> Submit </button>
    <button name="cancel" id="canc"> Cancel </button>


    <div id="message"></div>

VIEW 页面上的脚本:

<script>
    $(document).ready(function(){
        $("#subm").click(function(){
            getValueUsingParentTag();
        });
    });
    function getValueUsingParentTag(){
var chkArray = [];

/* look for all checkboes that have a parent id called 'checkboxlist' attached to it and check if it was checked */
$("#dynamic-table input:checked").each(function() {
    chkArray.push($(this).val());
});

/* we join the array separated by the comma */
var selected;
selected = chkArray.join(',') ;




var url = "<?php echo base_url(); ?>/index.php/Ajax";
    $.post( url, { test_input: selected } ) 

         .done(function(data){
            $("#message").html(data.result);
        });





/* check if there is selected checkboxes, by default the length is 1 as it contains one single comma */
if(selected.length > 0){
    alert("You have select" + selected);    
}else{
    alert("Please at least check one of the checkbox"); 
}

}

我的 AJAX Controller

<?php

defined('BASEPATH') OR exit('不允许直接脚本访问');

类 Ajax 扩展 CI_Controller {

public function index()
{
    $posted = $this->input->post('test_input');
    echo json_encode(array('result'=> $posted));        

}

请给我建议修改或好的修改。实际上，我想从数据库中检索数据。但首先在这段代码中，我只是尝试在没有数据库的情况下使用 ajax。一旦成功，我就可以继续进行数据库数据检索。

Answer 1

试试这个将 id 的值存储在复选框的 value 属性中。然后将“checkAll”类添加到表格标题中的复选框中。并将类“my-checkbox”添加到每一行的复选框，然后以下方法将同时选择/取消选择所有复选框。编写另一个函数，它将循环遍历每个带有 my-checkbox 类的复选框，并将复选框的值存储在数组中，然后返回数组。希望这会有所帮助....

// Select / Deselect all checkboxes
$(".checkAll").click(function () {
    $('input:checkbox').not(this).prop('checked', this.checked);
    console.log(getCheckedValues());
});

function getCheckedValues(){
    var checkboxes = document.getElementsByClassName('my-checkbox');
    var checkboxesChecked = [];
    // loop over them all
    for (var i=0; i < checkboxes.length; i++) {
      // And stick the value of checked ones onto an array...
      if (checkboxes[i].checked) {
        checkboxesChecked.push(checkboxes[i].value);
      }
    }
    // Return the array if it is non-empty, or null
    return checkboxesChecked.length > 0 ? checkboxesChecked : null;
  }

;