Datatable.net内置的单词换行样式

huangapple go评论87阅读模式
英文:

Datatable.net Built in styles for word wrap

问题

我正在使用Datatable.net,并希望我的Excel导出能够自动换行。我已经尝试过使用 $(this).attr('s', 55);,就像这个链接中所示:https://datatables.net/reference/button/excelHtml5#Built-in-styles。我还尝试过设置宽度,看看是否有帮助。我还尝试过添加 <th class='wrap'>",但都没有起作用。

JS 代码

$(tableId).DataTable({
    "lengthMenu": [
       [10, 15, 20, -1],
       [10, 15, 20, "All"]
     ],
    "pageLength": -1,
    scrollX: true,
    buttons: [
    {
       extend: 'excelHtml5',
       title: "Individual Report - " + moment().format('MM-DD-YYYY'),
           customize: function (xlsx) {
              var sheet = xlsx.xl.worksheets["sheet1.xml"];
              var col = $("col", sheet);
              col.each(function () {
                 $(this).attr('s', 55);
                 $(this).attr('width', 33);
              });

        }
     }
   ]
 });

(Note: The code is provided in its original form with proper formatting, and I have not made any translations for code-related terms.)

英文:

I am using Datatable.net and wanted my excel export to word wrap. I have tried using $(this).attr('s', 55); like this https://datatables.net/reference/button/excelHtml5#Built-in-styles. I have also tried setting the width and seeing if that helps. I have also tried added <th class='wrap'>" but nothing has been working.

JS Code

$(tableId).DataTable({
    &quot;lengthMenu&quot;: [
       [10, 15, 20, -1],
       [10, 15, 20, &quot;All&quot;]
     ],
    &quot;pageLength&quot;: -1,
    scrollX: true,
    buttons: [
    {
       extend: &#39;excelHtml5&#39;,
       title: &quot;Individual Report - &quot; + moment().format(&#39;MM-DD-YYYY&#39;),
           customize: function (xlsx) {
              var sheet = xlsx.xl.worksheets[&quot;sheet1.xml&quot;];
              var col = $(&quot;col&quot;, sheet);
              col.each(function () {
                 $(this).attr(&#39;s&#39;, 55);
                 $(this).attr(&#39;width&#39;, 33);
              });

        }
     }
   ]
 );

答案1

得分: 1

$(this).attr('s', '55');

$('<c>', sheet).attr('s', '55');
英文:

The selector you are using for the built-in style needs to be adjusted from this:

$(this).attr(&#39;s&#39;, 55);

to this:

$(&#39;row c&#39;, sheet).attr( &#39;s&#39;, &#39;55&#39; );

The $(&quot;col&quot;, sheet) selector is for the &lt;cols&gt; tags in the worksheet XML - for example:

&lt;cols&gt;
    &lt;col min=&quot;1&quot; max=&quot;1&quot; width=&quot;18.85546875&quot; customWidth=&quot;1&quot;/&gt;
    &lt;col min=&quot;2&quot; max=&quot;2&quot; width=&quot;24.28515625&quot; customWidth=&quot;1&quot;/&gt;
&lt;/cols&gt;

That is correct for setting widths.

But for the style s attribute, you need to target the &lt;c&gt; tag - for example:

&lt;row r=&quot;2&quot; spans=&quot;1:2&quot;&gt;
    &lt;c r=&quot;A2&quot; t=&quot;s&quot;&gt;
        &lt;v&gt;2&lt;/v&gt;
    &lt;/c&gt;
    &lt;c r=&quot;B2&quot; t=&quot;s&quot;&gt;
        &lt;v&gt;3&lt;/v&gt;
    &lt;/c&gt;
&lt;/row&gt;

Here is some demo code (it doesn't generate an Excel in a Stack Snippet, so here is the core code):

$(document).ready(function() {

  var table = $(&#39;#example&#39;).DataTable( {
    dom: &#39;Bfrtip&#39;,
    buttons: [
      {
        extend: &#39;excelHtml5&#39;,
        text: &#39;Save as Excel&#39;,
        title: &#39;&#39;,
        customize: function( xlsx ) {
          var sheet = xlsx.xl.worksheets[&#39;sheet1.xml&#39;];
          $(&#39;row c&#39;, sheet).attr( &#39;s&#39;, &#39;55&#39; );
          var col = $(&quot;col&quot;, sheet);
          col.each(function () {
            $(this).attr(&#39;width&#39;, 15);
          });
        }
      }
    ]
  } );

} );

The end result (with my test data):

Datatable.net内置的单词换行样式

huangapple
  • 本文由 发表于 2023年5月25日 07:50:51
  • 转载请务必保留本文链接:https://go.coder-hub.com/76328052.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定