附加HTML数据jQuery

时间:2017-06-06 09:48:14

标签: jquery html laravel laravel-5.3

这次我在控制器中编写了html,当我选中一个复选框时,我在控制台中获取数据,但我希望在表单中得到它。

我在foreach循环中有复选框

<input type='checkbox' value='{$student['id']}' name='student_ids[]' id='chkbx' required> {$student['name']}

单击复选框时相应地加载数据

是我的HTML

    $str .= '<div class="form-group">
    <label class="control-label col-md-3">
    Student
    </label>
    <div class="col-md-4">
        <select id="students-clicked" class="form-control select2-multiple" multiple name="students[]">
            <option value=""></option>';
            foreach ($students as $students) {
                $str .= "<option value='{$student->id}'>{$student->name}</option>";
            }

$str .=         '</select>
    </div>
</div>';

Jquery方法为

    $('body').on('click', "#chkbx", function() {
    var class = $('input:checkbox:checked').map(function() {
        return this.value;
    }).get();
    $.ajax({
            url: '/trigger/studentsData',
            type: 'POST',
            data: {'trigger_type': 'click' , ids: class},
            success: function(result) {

            }
        });
});

除了jQuery之外,所有内容都是在控制器中编写的,这次我在控制台中获取HTML数据如何将其添加到我的html表单中,它还应根据复选框选择进行更新

2 个答案:

答案 0 :(得分:1)

试试这个: -

<input type='checkbox' value='{$student['id']}' name='student_ids[]' id='chkbx' required/> {$student['name']}
<div id="appendata">
 //your ajax data
</div>

现在成功功能

success: function(result) {
    $("#appendata").html(result); // this will replace when you select the checkbox
         or
    $("#appendata").append(result); // this will append when you select again from checkbox
}

希望有所帮助

答案 1 :(得分:1)

不要append()使用html()来覆盖带有响应数据的内容

success: function (result) {
    $("#container").html(result);
}

另外,如果您有多个复选框,请不要使用id,而是使用class属性循环播放