bootstrapTable 列宽设置无效的解决方法之一

小弟是货真价实的后台服务开发人员,结果非要写bootStrap相关的代码,我这个头疼。。。javascript

不过好在有一点点js基础,还能看懂一些代码。结合bootStrap api文档,总算是搞出来了,但,在样式的调整中,列宽不听使唤,实在是郁闷,网上查了不少方案都不行,但发现若是自定义一个列宽函数,是能够实现的。代码以下:java

function queryLoanList(){
    	  $('#table').bootstrapTable({
    	        url:'./loan/XXX.json',
    	        sidePagination:'server',
    	        queryParamsType:'pageSize',
    	        queryParams: queryParams,
    	        search:false,
    	        pagination:true,
    	        pageList:[25],
    					 columns : [ {
    						title : '序号',
                             align : 'center',
    						formatter: function (value, row, index) {  
    			                 return index + 1; 
    					    }  
    					},{
    						field : 'loanId',
                             halign : 'center',
    						title : '项目编号'
    					},{
    						field : 'loanName',
                             halign : 'center',
                             width: 100,
    						title : '项目名称'
    					},{
    						field : 'profitEnterprise',
                             halign : 'center',
                             formatter : function(value, row, index){
                                 var div = "<div style='width:240px;'>"+value+"</div>";
                                 return div;
                             },
    						title : '合做机构'
    					},{
                             field : 'sourceStore',
                             width:300,
                             title : '项目来源门店'
                        },{
                             field : 'bidType',
                             title : '项目类型'
                        },{
    						field : 'money',
                            align : 'center',
    						title : '借款金额(元)'
    					},{
                             field : 'loanPeriod',
                             align : 'center',
                             title : '借款期限(期)'
                        },{
                             field : 'deadLine',
                             align : 'center',
                             title : '线下签约期限(期)'
                        },{
                             field : 'nowPeriod',
                             align : 'center',
                             title : '当前第?期'
                        },{
                             field : 'sumMoney',
                             align : 'center',
                             title : '每期上扣金额(元)'
                        },{
                             field : 'commitRate',
                             title : '打包结算点位(%)'
                         },{
                             field : 'platFormMoney',
                             align : 'center',
                             title : '平台分润金额(元)'
                        },{
                             field : 'proMoney',
                             align : 'center',
                             title : '机构分润金额(元)'
                        },{
    						field : 'gmTime',
    						title : '项目放款时间'
    					},{
                             field : 'sourceAgency',
                             title : '归属上级加盟商'
                         },{
    						field : 'treated',
    						title : '状态'
    					},{
    						title : '操做',
    						formatter : operateFormatter
    					}]
    	      });
        }

其中一句:json

formatter : function(value, row, index){
                                 var div = "<div style='width:240px;'>"+value+"</div>";
                                 return div;
                             },

是关键,他能够自定当前列的div样式。这样就能够强制设置当前列的宽度,不过是定死的,不是自适应的。bootstrap

以上,是工做中的一些小小收货api

相关文章
相关标签/搜索