javascript - 模式 Bootstrap 中的 Codeigniter 表单无法使用 jquery 传递多个复选框

Question

我有一个模态 Bootstrap 表单。在 codeigniter 表单中，我将 form_open 保留为空白，因为我希望页面仍然不移动到另一个页面。代码是这样的:

 <div class="modal-body">
    <?php
    $properties = array('class' => 'form-horizontal', 'id' => 'myform', 'name' => 'myform');
    echo form_open("", $properties);
    ?>

    <fieldset>
        <div class="control-group">
            <label class="control-label">Jenis Request :</label>
            <div class="controls" id="chekboxes">
                <label class="checkbox inline"><input type="checkbox" name="request[]" id="Login" value="Login" /> Login </label>
                <label class="checkbox inline"><input type="checkbox" name="request[]" id="Printer" value="Printer"/> Printer </label>
                <label class="checkbox inline"><input type="checkbox" name="request[]" id="Monitor" value="Monitor"/> Monitor</label>
                <label class="checkbox inline"><input type="checkbox" name="request[]" id="Computer" value="Computer"/> Computer</label>
                <label class="checkbox inline"><input type="checkbox" name="request[]" id="Network" value="Network"/> Network</label>
                <label class="checkbox inline"><input type="checkbox" name="request[]" id="Other" value="Lain-lain" /> Other</label> 
            </div>
        </div>

        <div class="control-group hidden-phone">
            <label class="control-label" for="Keluhan" >Description: </label>
            <div class="controls">
                <textarea class="cleditor" name="keluhan" id="keluhan" rows="3" autofocus="autofocus"></textarea>
            </div>
        </div>

        <div class="form-actions">
            <button type="submit" class="btn btn-primary" id="submit">Kirim</button>
            <button type="reset" class="btn" id="reset">Cancel</button>
        </div>
    </fieldset>
    <?php echo form_close(); ?>
</div>

看，我使用 jquery 在我的数据库中插入新数据，如下所示:

$(document).on('submit', '#myform', function() {
        $('#myform').block({
            message: '<h2>Sedang mencari</h2>',
            css: {border: '3px solid #a00'}
        });

        var request = $("input[name='request[]']:checked");
        var keluhan = $("#keluhan").val();



        $.ajax({
            url: '<?php echo base_url() . 'direksi/control_direksi/mdRequest' ?>',
            type: 'POST',
            data: {request: request,
                keluhan: keluhan},
            dataType: 'json',
            success: function(data) {
                alert("Insert Success");
                $("myModal").hide();
            }
        });

        return false;
    });

这是 php 操作

public function mdRequest() {

    var_dump($_POST);

}

我的页面刚刚刷新，没有受到影响。如何检查POST是否成功？以及如何使用 jquery 传递多个复选框，我是否像上面的代码一样错了？任何帮助都非常感谢。

Answer 1

您可以使用数组变量传递所有值。将检查的元素存储在数组变量中，如下所示:

var request = $("input[name='request[]']:checked").map(function(i,e) {
    return $(this).val();
}).get();

要检查POST请求是否成功，您可以通过chrome浏览器的网络选项卡检查ajax请求是否成功。其次，使用 console.log() 显示输出。这将打印出 var_dump 的输出。 :

 success: function(data) {
    console.log(data);
    $("myModal").hide();
 }

在服务器端，您也可以使用此功能:

public function mdRequest() {
  print_r($this->input->post());
  // or print_r($this->input->post('request'));
}