为了账号安全,请及时绑定邮箱和手机立即绑定

AJAX对每一行数据进行增删改

标签:
JQuery
function modify(index){
        var table = $('#selecttable_'+index);
        var tds = table.children('td');
        var str = "<form role='role'>";
        str += "<label>课程id<input type='text' class='form-control' id='modal_id' value='"+tds[1].innerHTML+"' disabled></label>";
        str += "<label>课程代码<input type='text' class='form-control' id='modal_daima' value='"+tds[2].innerHTML+"'></label>";
        str += "<label>课程名称<input type='text' class='form-control' id='modal_mingcheng' value='"+tds[3].innerHTML+"'></label>";
        str += "<label>学分<input type='text' class='form-control' id='modal_xuefen' value='"+tds[4].innerHTML+"'></label>";
        str += "<label>课程性质<input type='text' class='form-control' id='modal_xingzhi' value='"+tds[5].innerHTML+"'></label>";
        str += "<label>课程类别<input type='text' class='form-control' id='modal_leibie' value='"+tds[6].innerHTML+"'></label>";
        str += "<label>建议修读学期<input type='text' class='form-control' id='modal_xueqi' value='"+tds[7].innerHTML+"'></label>";
        str += "</form>";

        $('#modal-title').html('修改课程信息')
        $('#modal-body').html(str);
        $('#modal_btn_2').show();
        $('#modal_btn_2').attr('onclick','baocun()');
        $('#modal').modal('toggle');
    }
    function baocun(){
        var daima = $('#modal_daima').value;
        var mingcheng = $('#modal_mingcheng').value;
        var xuefen = $('#modal_xuefen').value;
        var xingzhi = $('#modal_xingzhi').value;
        var leibie = $('#modal_leibie').value;
        var xueqi = $('#modal_xueqi').value;

        $.ajax({
            type:"POST",
            //传到后端的地址
            url:'aaaaaaa',
            data:'daima='+daima+'&mingcheng='+mingcheng+'&xuefen='+xuefen+'&xingzhi='+xingzhi+'&leibie='+leibie+'&xueqi='+xueqi,
            dataType:'JSON',
            success:function(result){
            //保存成功
                    var str="保存成功!"
                    $('#modal-body').html(str);
                    $('#modal_btn_2').hide();
                    $('#modal').modal('toggle');

            }       
        })
    }
    //删除
    function delet(index){
        var table = $('#selecttable_'+index);
        var tds = table.children('td');
        var str = "确定删除该课程?"

        $('#modal-title').html('删除课程信息')
        $('#modal-body').html(str);
        $('#modal_btn_2').html("确定");
        $('#modal_btn_2').show();
        $('#modal_btn_2').attr('onclick','del()');
        $('#modal').modal('toggle');
    }   
    function del(){
        var daima = $('#modal_daima').value;
        var mingcheng = $('#modal_mingcheng').value;
        var xuefen = $('#modal_xuefen').value;
        var xingzhi = $('#modal_xingzhi').value;
        var leibie = $('#modal_leibie').value;
        var xueqi = $('#modal_xueqi').value;

        $.ajax({
            type:"POST",
            //传到后端的地址
            url:'aaaaa',
            data:'daima='+daima+'&mingcheng='+mingcheng+'&xuefen='+xuefen+'&xingzhi='+xingzhi+'&leibie='+leibie+'&xueqi='+xueqi,
            dataType:'JSON',
            success:function(result){
            //删除成功
                    var str="保存成功!"
                    $('#modal-body').html(str);
                    $('#modal_btn_2').hide();
                    $('#modal').modal('toggle');
            }       
        });
    }
//jsp

<td class="center">
                            <button class="btn-sm btn-primary btn-action glyphicon glyphicon-search btn-info" onclick="view(1)" ></button>

                            <a class="btn-sm btn-primary btn-action glyphicon glyphicon-pencil btn-success" onclick="modify(1)"><i></i></a>
                            <!-- 修改数据模态框同查看 -->
                            <a class=" btn-sm btn-action glyphicon glyphicon-remove btn-danger" onclick="delet(1)"><i></i></a>
                        </td>

//model
<!-- 模态框 模态框内容js修改-->
    <div class="modal" id="modal">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">
                        <span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
                    </button>
                    <h4 class="modal-title" id="modal-title"></h4>
                </div>
                <div class="modal-body" id="modal-body">

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal" id="modal_btn_1">关闭</button>
                    <button type="button" class="btn btn-primary" id="modal_btn_2">保存</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->  
点击查看更多内容
6人点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消