bootstrap table 获取数据里面的id可以重新请求数据展

订单编号和订单金额是根据每一条数里面id重新获取的... 订单编号和订单金额是根据每一条数里面id重新获取的 展开
 我来答
小融说房产
2018-07-10 · TA获得超过216个赞
知道小有建树答主
回答量:796
采纳率:86%
帮助的人:145万
展开全部

项目中使用BootStrap editTable 进行行内编辑,编辑后并不实时的修改某列的值,而是在所有需要修改的列修改后,点击后面的【确认投资】按钮,一次性保存所修改的列。

由于【确认投资】是页面第一次初始化后出现的,而这时需要修改的列是没有值的,对列进行编辑后,点击按钮是不能获取到编辑后的值。

经过学习Bootstrap editTable  和 bootstarp table的API,找到了解决方案。

方法/步骤

  • 1

    引入bootstarp edittable 的 js,css 文件:

    <link href="${basePath}/STATIC/plugins/bootstrap3-editable/css/bootstrap-editable.css" rel="stylesheet">

    <script src="${basePath}/STATIC/plugins/bootstrap3-editable/js/bootstrap-table-editable.js"></script>

    <script src="${basePath}/STATIC/plugins/bootstrap3-editable/js/bootstrap-editable.js"></script>

    注意:bootstrap-table-editable.js  不属于 bootstrap3-editable 里面,是第三方或个人扩展的,可以从网上下载。

  • 2

    特定的列进行行内编辑:

    field: 'autualFinanceAmount',

    title: '实际融资金额(万元)',

    width: 160,

    align: 'center',

    formatter:function(value,row,index){

    if(value == null || value == ''){

    return "-";

    }

    return value;

    },

    editable: {

    type: 'text',

    title: '实际融资金额',

    validate: function (v) {

    if (!v) return '实际融资金额不能为空';

    //正则校验输入格式:最多两位小数。

    var patrn=/^([1-9]\d*\.\d{1,2}|0\.\d[1-9]|[1-9]\d*)$/;

    if(!patrn.test(v)){

    return '输入格式:最多两位小数';

    }

    }

    }

  • 3

    当某列编辑完成后,需要对当前列所在的行进行修改操作:

    $("#grid").bootstrapTable({

    url:'',

    ……

    …… //其他属性

    columns:[{

    field:'rowId',

    title:'序号',

    width:30,

    align: 'center',

    formatter:function(value,row,index){

    row.rowId = index;

    return index+1;

    }

    …… //其他列

    }],

    onEditableSave: function (field, row, oldValue, $el) {

    $table = $('#grid').bootstrapTable({});

    $table.bootstrapTable('updateRow', {index: row.rowId, row: row});

    }

    注意:黑色粗体字就是新增的代码,表示在列编辑完成后,对当前列所在的行进行修改。

    index 表示该行所在的索引。由于onEditableSave函数的参数中没有index,只能自己特殊处理了。看到在columns属性中,有一个field:'rowId’就是自己处理的,rowId赋给row。

  • 4

    如果你的列中有

    formatter:function(value,row,index){} 函数,

    在onEditableSave 方法执行完成后,该函数会重新执行,这样就会把修改后的列的值重新拿到进行处理。

推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式