请问怎么在SSM框架里使用bootstrap-table

Question

我用的时候提示我类型错误了，但我不知道怎么改，请大神伸出援手，下面是我的代码

js代码：

   function dic_table(){
    var row=1;
    //alert("gggg");
    $('#dic_table').bootstrapTable('destroy');
    $('#dic_table').bootstrapTable({
    url:'dicTable.do',
    method:'get',
    toolbar:'#formTools',//工具按钮用那个
    striped:true,
    cache:false,
    pagination:true,
    queryParams : function(params) {
        return { 
            dicName: $('#dicName').val(),
            offset : params.offset,
            limit : params.limit
            };
            }, 
     pageSize : 5, //每页的记录行数（*）
     pageNumber : 1, //初始化加载第一页，默认第一
     responseHandler:function (res) {
         return res.DATA;
     },
     pageList : [ 2, 4, 6 ],
     singleSelect : true,
     showColumns : true,
     sortable : true, //是否启用排序 
     sidePagination : "client", //分页方式：client客户端分页，server服务端分页（*）
     strictSearch : true,
     minimumCountColumns : 2, //最少允许的列数
     clickToSelect : true, //是否启用点击选中行
     showRefresh : false, //是否显示刷新按钮
     uniqueId : 'tName', //每一行的唯一标识，一般为主键列
     cardView : false, //是否显示详细视图
     search : true,
     strictSearch : true,
     showColumns : true,
     showRefresh : true,
     showExport : true,
    onLoadError : function(data) {
        alert(data);
        $('#dic_table').bootstrapTable(

     'removeAll');},
     onLoadSuccess:function(data){

        alert("成功"+data);
     },
     columns:[
      {field:'tDicId',title:'数据编号'},
      {field:'tName',title:'数据名称'},
      {field:'tType',title:'数据类型'},
      {title:'操作',align:'center',
      formatter:function(value,row,index){
      //var e="<a href='javascript:void(0);media='"row.tName"';title='"row.tName"'; id='"row.tName"'>编辑</a>";
      //var f="<a href='javascript:void(0);media='"row.tName"'; title='"row.tName"'; id='del'>删除</a>";
      var e="<a href='javascript:void(0);'>编辑</a>";
      var f="<a href='javascript:void(0);'>删除</a>";

      return e+f;
      }}],
      onClickRow:function(row,$element){
      alert(row.id);
      } 

    });
}

后台代码

controller：

 @Controller
public class DicCodeController {
    public DicCodeController() {
        // TODO Auto-generated constructor stub
    }
    @Autowired
    IDicCodeService dicCodeServiceImpl;
     @RequestMapping(value="dicTable.do",method=RequestMethod.GET)
     @ResponseBody
     public void SelectDicConde(TbDicCode tDicCode, HttpServletRequest request,HttpServletResponse response) throws IOException{
         //PrintWriter pw=response.getWriter();
         //获取客户端传递来的也码和每页记录数，并转化为int类型
         //int pageSize=Integer.parseInt(request.getParameter("pageSize"));
         //int pageNumber=Integer.parseInt(request.getParameter("pageNumber"));
        // String orderNum=request.getParameter("orderNum");
         response.setCharacterEncoding("gbk");
         request.setCharacterEncoding("utf-8");
         System.out.println("good");

         String dicName=null;
         if (request.getParameter("dicName")!=null) {
             dicName=request.getParameter("dicName");
          }
         String pageSizeStr=request.getParameter("limit");
         String pageOffsetStr=request.getParameter("offset");
         int pageSize= pageSizeStr==null ? 10: Integer.parseInt(pageSizeStr);
         int pageOffset= pageOffsetStr==null ? 10: Integer.parseInt(pageOffsetStr);
       /*  if (pageOffset==0) {
            pageOffset=1;
        }*/
         System.out.println("分页信息: "+pageOffset+","+pageSize);


        //List list= dicCodeServiceImpl.selectDic(dicName,pageOffset,pageSize);
        Map<String ,Object> map=dicCodeServiceImpl.selectDic2(dicName,pageOffset,pageSize);

         //分页查找商品的销售记录
        // JSON.toJSONString(list);
         response.getWriter().write(JSON.toJSONString(map)); 
       System.out.println("jieguo:"+map.get("pageSize")+map.get("data"));
        // return map;
     }

}

service：

 @Service
public class DicCodeServiceImpl implements IDicCodeService {
 @Autowired 
   TbDicCodeMapper TbDicCodeMapper;
    @Override
    public Map<String,Object> selectDic2(String dicName,int pageOffset,int pageSize) {

        TbDicCode   tbCode=new  TbDicCode();
        // TODO Auto-generated method stub
        tbCode.settName(dicName);
        tbCode.setPageOffset(pageOffset);
        tbCode.setPageSize(pageSize);

        List<TbDicCode> list= TbDicCodeMapper.selectDic(tbCode);
        Map<String,Object> result=new HashMap<>();

/*      list.add("pageOffset",pageOffset);
        list.add("pageSize", pageSize);*/
        System.out.println("数据字典:/t数据字典代码/t数据字典id/t数据字典名称/t数据字典类型");
        for (TbDicCode tbDicCode : list) {
            System.out.println("数据字典:"+tbDicCode.gettDicCode()+","+
           tbDicCode.gettDicId()+","+tbDicCode.gettName()+","+tbDicCode.gettType()
                    );
        }
        int total=TbDicCodeMapper.DicCount(dicName);
        result.put("data",list);//list集合
        result.put("offset",pageOffset);
        result.put("limit", pageSize);
        result.put("total", total);
        System.out.println("result："+result.toString());
        return result;

    }


}

运行的结果：

点击“data is undefined”后有值：
{"total":2,"data":[{"pageOffset":0,"pageSize":0,"tDicCode":"","tDicId":"1","tName":"数据1","tType":"类型1"},{"pageOffset":0,"pageSize":0,"tDicCode":"","tDicId":"2","tName":"数据2","tType":"类型2"}],"offset":0,"limit":5}

请问要怎么改才能让bootstrap-table正常运行？

Answer 1

undefined一般是因为你前端页面js引用重复,或者有的js需要依赖js,注意不同js之间的关系,还有就是看一下当前页面是否引入了其他页面,引入进来的页面可以看一下是否存在js冲突