bootstrap弹窗+php+ajax

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/gaokcl/article/details/87611990

1，html   data-id --id   ， data-memo 描述  

{foreach $lists as $k => $list}

<td align="center">
                          <button type="button" class="btn btn-info js_btn_edit" data-id="{$list.id}" data-memo="{$list.remarks}" style="margin-left:10px;">编辑</button>
                    </td>

{/foreach}

2,bootstrap弹窗

<!-- Modal编辑弹窗 -->
        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
            <input type="hidden" id="edit_id" value="" />
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title" id="myModalLabel">备注</h4>
                    </div>
                    <div class="modal-body">
                        <textarea name="remarks" cols="78" rows="10" id="js_comment"></textarea>
                    </div>
                    <div class="modal-footer">
                        <button type="button" id="btn_submit" class="btn btn-primary js_btn_submit" data-dismiss="modal"><span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>保存</button>
                    </div>
                </div>
            </div>
        </div>
        <!-- /Modal编辑弹窗 -->
    </div> 

3，js

 <script>
        // 注册备注按钮的事件
        $(".js_btn_edit").click(function () {
            var id = $(this).attr("data-id");//id
            var remarks = $(this).attr("data-memo");//备注
            $("#edit_id").val(id); // 回填数据id到弹窗
            $("#js_comment").val(remarks); // 回填数据备注到弹窗
            // 点击事件--弹出框
            $("#myModalLabel").text("备注");
            $('#myModal').modal();
        });

        // 要提交，要修改的数据
        var formDatas = {
            id: '',
            remarks: '',
        };

        //  弹窗--添加备注
        $(".js_btn_submit").click(function () {
            formDatas.id = $("#edit_id").val();
            formDatas.remarks = $("#js_comment").val();
            $.ajax({
                type: "post",
                url: "/editor/fm_pop_partner.php?entry=editComment", // 添加弹窗备注
                dataType: "JSON",
                data: formDatas,
                success: function (data) {
                    if (data.code == 0) {
                        alert(data.msg);
                        window.location.reload();
                    } else {
                        alert(data.msg);
                        window.location.reload();
                    }
                }
            });
        });
    </script>