jqxgrid форматирование печати и отсутствующий столбец - PullRequest
Новая
       26

jqxgrid форматирование печати и отсутствующий столбец

1 голос
/ 01 октября 2019

У меня есть jqxgrid, который получает данные из БД. я добавил время выполнения колонки вызова серийный номер. Это показывает на сетке в порядке. Также на сетке есть кнопка печати. При нажатии кнопки печати открывается новое окно с предварительным просмотром печати, но в предварительном просмотре не отображаются номера старших.

Просьба взглянуть на приведенный ниже код, и если вы можете привести меня в правуюНаправление.

Спасибо 

<div id='jqxWidget' style="font-size: 13px; font-family: Verdana; float: left;">
<div id="jqxgrid"></div>
<div style='margin-top: 20px;'>
    <div style='float: left;'>
        <input type="button" value="Print" id='Print' />
    </div>
</div>


var data = generatedata(100);
var source = {
  localdata: data,
  datatype: "array",
  datafields: [{
      name: 'firstname',
      type: 'string'
  }, {
      name: 'lastname',
      type: 'string'
  }, {
      name: 'productname',
      type: 'string'
  }, {
      name: 'available',
      type: 'bool'
  }, {
      name: 'quantity',
      type: 'number'
  }, {
      name: 'price',
      type: 'number'
  }],
  updaterow: function (rowid, rowdata) {
      // synchronize with the server - send update command   
  }
};
var dataAdapter = new $.jqx.dataAdapter(source);
// initialize jqxGrid
$("#jqxgrid").jqxGrid({
  width: 700,
  source: dataAdapter,
  theme: 'energyblue',
  editable: true,
  selectionmode: 'singlecell',
  columns: [
  {
       text: '#', sortable: false, filterable: false, editable: false,
       groupable: false, draggable: false, resizable: false,
       datafield: '', columntype: 'number', width: 30,
       cellsrenderer: function (row, column, value) {
       return "<div style='margin:4px;'>" + (value + 1) + "</div>";
       }
  },
  {
      text: 'First Name',
      columntype: 'textbox',
      datafield: 'firstname',
      width: 90
  }, {
      text: 'Last Name',
      datafield: 'lastname',
      columntype: 'textbox',
      width: 90
  }, {
      text: 'Product',
      datafield: 'productname',
      width: 170,

  }, {
      text: 'Price',
      datafield: 'price',
      cellsalign: 'right',
      cellsformat: 'c2',
      width: 100
  }]
});
$("#Print").jqxButton({
  theme: 'energyblue'
});
$("#Print").click(function () {
  var prnt = $("#jqxgrid").jqxGrid('exportdata', 'html');
  var newWindow = window.open('', '', 'width=800, height=500'),
      document = newWindow.document.open(),
      pageContent =
                    '<!DOCTYPE html>\n' + '<html>\n' + '<head>\n' + '<meta charset="utf-8" />\n' + '<title>Summary</title>\n' + '</head>\n' + '<body>\n' +
                    '<div>\n<div id="image1" style="position:absolute; overflow:hidden; left:3px; top:3px; width:160px; float:left;">\n' +
                    '</div>\n<div style="margin-left: 300px;float:left;top:5px;"><h2>Sums</h2></div>\n' +
                    '</div>\n<br /><br /><br /><br />' + prnt + '\n</body>\n</html>';
            document.write(pageContent);
  newWindow.print();
});
});

вот рабочий образец. Но я не уверен, как заставить работать кнопку.
https://jsfiddle.net/Vinod1/by6duep4/3/

...