夏目たかし 发表于 2020-6-16 16:32:42

Wijimo显示内容换行

现在我们后台传给前台的是“XXXXX/nBBBBB”,在wijimo表单gird的单元格,如何让他换行?
目前只查到有自动换行,但是自动换行是控制宽度显示不下才换行,我们需要手动控制换行,请问需要做什么样的处理?

KevinChen 发表于 2020-6-16 16:32:43

你好,这需要把\n替换为<br>,参考代码:

$(document).ready(function () {
    var gridElement = $("#theGrid");
    gridElement.height($(document).height() - 50);
    gridElement.width($(document).width() - 5);

    var testStr = $("#testString").text();

    // create some random data
    data = [];
    for (var i = 0; i < 10; i++) {
      data.push({
            country: 'Ramdom....',
            downloads: testStr,
            sales: Math.random() * 10000,
            expenses: Math.random() * 5000,
            expenses2: Math.random() * 5000,
            expenses3: Math.random() * 5000,
            expenses4: Math.random() * 5000,
            expenses5: new Date(),
      });
    }

    // create CollectionView on the data (to get events)
    var view = new wijmo.collections.CollectionView(data);

    // initialize the grid
    var grid = new wijmo.grid.FlexGrid('#theGrid', {
      itemsSource: view,
      selectionMode: wijmo.grid.SelectionMode.Cell,
      allowAddNew: true,
      allowDelete: true,
      autoSizeMode: wijmo.grid.AutoSizeMode.Both
    });
    var downloadsColumn = grid.columns.getColumn("downloads");
    downloadsColumn.wordWrap = true;
    downloadsColumn.isContentHtml = true;

    grid.autoSizeRows(0, grid.rows.length, false, 40);

    grid.itemFormatter = function (panel, r, c, cell) {
      //check for column
      if (c == 1) {
                     //get the data
            var data = panel.getCellData(r, c);
            //replace \n with <br/> tags
            var formattedData = data.replace(/\n/g, '<br/>');
            //set the formatted data
            panel.setCellData(r, c, formattedData);
         
      }
         setTimeout(grid.invalidate(), 1);
      grid.autoSizrR
    }
});

关键代码:

grid.itemFormatter = function (panel, r, c, cell) {
      //check for column
      if (c == 1) {
                     //get the data
            var data = panel.getCellData(r, c);
            //replace \n with <br/> tags
            var formattedData = data.replace(/\n/g, '<br/>');
            //set the formatted data
            panel.setCellData(r, c, formattedData);
         
      }
         setTimeout(grid.invalidate(), 1);
      grid.autoSizrR
    }
页: [1]
查看完整版本: Wijimo显示内容换行