Update xlsx.js #917

Closed
bigbeef wants to merge 0 commits from master into master
bigbeef commented 2017-12-09 05:16:46 +00:00 (Migrated from github.com)

The property of the custom column can be string

The property of the custom column can be string
SheetJSDev commented 2017-12-09 05:28:44 +00:00 (Migrated from github.com)

Hello @bigbeef ! Can you share a sample HTML table with the row-type attribute?

parse_dom_table is called on a TABLE DOM element

row is the TR element

elt in context is the individual TD element

row-type is not a standard attribute for TD elements, so it's unclear why the change is necessary.

Hello @bigbeef ! Can you share a sample HTML table with the `row-type` attribute? [`parse_dom_table` is called on a `TABLE` DOM element](https://github.com/SheetJS/js-xlsx/pull/917/commits/f0e9741b53d185bc072dfeb563f578f017f21e19#diff-41772ca6056f87e686455e101ffe79b9L17342) [`row` is the `TR` element](https://github.com/SheetJS/js-xlsx/pull/917/commits/f0e9741b53d185bc072dfeb563f578f017f21e19#diff-41772ca6056f87e686455e101ffe79b9L17351) [`elt` in context is the individual `TD` element](https://github.com/SheetJS/js-xlsx/pull/917/commits/f0e9741b53d185bc072dfeb563f578f017f21e19#diff-41772ca6056f87e686455e101ffe79b9L17354) `row-type` is not a standard attribute for `TD` elements, so it's unclear why the change is necessary.
bigbeef commented 2017-12-12 03:49:52 +00:00 (Migrated from github.com)

”row-type“ is a custom type, and it is possible that some columns are date types and some columns are string types

<table id="table">
    <tr>
        <td>name</td>
        <td>age</td>
        <td row-type="string">idCard</td>
        <td>birthday</td>
    </tr>
    <tr>
        <td>mike</td>
        <td>20</td>
        <td row-type="string">620101199910111234</td>
        <td>1999-11-01</td>
    </tr>
    <tr>
        <td>jack</td>
        <td>25</td>
        <td row-type="string">110101199210111234</td>
        <td>1992-11-01</td>
    </tr>
</table>

if the columns "idCard" not "string",it will be

but i want

”row-type“ is a custom type, and it is possible that some columns are date types and some columns are string types ``` <table id="table"> <tr> <td>name</td> <td>age</td> <td row-type="string">idCard</td> <td>birthday</td> </tr> <tr> <td>mike</td> <td>20</td> <td row-type="string">620101199910111234</td> <td>1999-11-01</td> </tr> <tr> <td>jack</td> <td>25</td> <td row-type="string">110101199210111234</td> <td>1992-11-01</td> </tr> </table> ``` if the columns "idCard" not "string",it will be ![](https://i.loli.net/2017/12/12/5a2f50cb4fae1.png) but i want ![](https://i.loli.net/2017/12/12/5a2f515704d17.png)
SheetJSDev commented 2017-12-12 04:30:16 +00:00 (Migrated from github.com)

Since you're generating the HTML directly, and you know you want those values to be text, would it make sense to prepend with a zero-width space character? For example, this should give you the desired result:

<td>&#8203;123456789012</td>

To try this in the table demo, run the following JS in your console then export to XLSX:

document.getElementById("sjs-A1").innerHTML = "&#8203;123456789012"
document.getElementById("sjs-B1").innerHTML = "123456789012"

You should end up with a file like issue917.xlsx :

issue917

The "correct" approach is to pass format metadata with mso-number-format CSS attribute. For example:

<table> 
 <tr>
  <!-- Number -->
  <td>620101199910111000</td>
  <!-- Number displayed as text -->
  <td style='mso-number-format:"@"'>620101199910111000</td>
 </tr>
</table>

(the @ format is text).

The problem with this approach is that browsers like Chrome won't actually let you access those mso- attributes (so this will fail with table_to_sheet and table_to_book):

var elt = document.createElement("div");
elt.innerHTML = "<table><tr><td style='mso-number-format:\"@\"'>620101199910111000</td></tr></table>"
elt.children[0].children[0].children[0].children[0].style["top"] // "" (so chrome can see it)
elt.children[0].children[0].children[0].children[0].style["mso-number-format"] // undefined
elt.children[0].children[0].children[0].children[0].style["msoNumberFormat"] // also undefined
Since you're generating the HTML directly, and you know you want those values to be text, would it make sense to prepend with a zero-width space character? For example, this should give you the desired result: ```html <td>&#8203;123456789012</td> ``` To try this in the [table demo](http://sheetjs.com/demos/table), run the following JS in your console then export to XLSX: ```js document.getElementById("sjs-A1").innerHTML = "&#8203;123456789012" document.getElementById("sjs-B1").innerHTML = "123456789012" ``` You should end up with a file like [issue917.xlsx](https://github.com/SheetJS/js-xlsx/files/1550261/issue917.xlsx) : <img width="590" alt="issue917" src="https://user-images.githubusercontent.com/6070939/33867499-0b56fa7e-decb-11e7-9af8-fde1bbf16c7d.png"> --- The "correct" approach is to pass format metadata with `mso-number-format` CSS attribute. For example: ```html <table> <tr> <!-- Number --> <td>620101199910111000</td> <!-- Number displayed as text --> <td style='mso-number-format:"@"'>620101199910111000</td> </tr> </table> ``` (the `@` format is text). The problem with this approach is that browsers like Chrome won't actually let you access those `mso-` attributes (so this will fail with `table_to_sheet` and `table_to_book`): ```js var elt = document.createElement("div"); elt.innerHTML = "<table><tr><td style='mso-number-format:\"@\"'>620101199910111000</td></tr></table>" elt.children[0].children[0].children[0].children[0].style["top"] // "" (so chrome can see it) elt.children[0].children[0].children[0].children[0].style["mso-number-format"] // undefined elt.children[0].children[0].children[0].children[0].style["msoNumberFormat"] // also undefined ```
bigbeef commented 2017-12-12 04:47:22 +00:00 (Migrated from github.com)
<td>&#8203;123456789012</td>

There will be a space in front

It's not perfect

``` <td>&#8203;123456789012</td> ``` There will be a space in front ![](https://i.loli.net/2017/12/12/5a2f5ee9b95c9.png) It's not perfect
SheetJSDev commented 2017-12-12 05:14:42 +00:00 (Migrated from github.com)

@bigbeef . Would you object to renaming the attribute t and setting the value to s for string:

<td t="s">idCard</td>

That will line up with the internal representation of the standard data types and will eventually allow us to fine-tune the export and import.

@bigbeef . Would you object to renaming the attribute `t` and setting the value to `s` for string: ```html <td t="s">idCard</td> ``` That will line up with the [internal representation of the standard data types](https://docs.sheetjs.com/#data-types) and will eventually allow us to fine-tune the export and import.
bigbeef commented 2017-12-12 06:03:21 +00:00 (Migrated from github.com)

of course

<td t="s">idCard</td>

this's a good idea

of course ``` <td t="s">idCard</td> ``` this's a good idea
SheetJSDev commented 2017-12-12 07:18:16 +00:00 (Migrated from github.com)

We'll cut a release tomorrow with the included changes.

We'll cut a release tomorrow with the included changes.
bigbeef commented 2017-12-12 08:16:29 +00:00 (Migrated from github.com)

ok,thanks

ok,thanks

Pull request closed

Sign in to join this conversation.
No description provided.