JS table data not captured

[umayrh]

Hi @OvidijusParsiunas ,

I've a table like so

which, when exported, yields a CSV file (table_data.csv) that doesn't fully represent the data entered in the web component. I see the same problem when I access the table data using the method elementRef.getData(): the data is incomplete.

Any idea why?

Javascript code for table creation:

make_active_table = function(activeTable, tableData) {
    activeTable.data = tableData;
    activeTable.setAttribute(
        "tableStyle",
        JSON.stringify({
            "width":"100%", "boxShadow": "rgb(172 172 172 / 17%) 0px 0.5px 1px 0px", "borderRadius":"2px",
        })
    );
    activeTable.setAttribute(
        "files",
        JSON.stringify({
            "buttons": [
              {
                "import": true,
                "styles": {
                  "default": {
                    "backgroundColor": "#46acff", "height": "19px", "padding": "7px 14px", "color": "white", "border": "unset"
                  },
                  "hover": {"backgroundColor": "#2b9cf8"}, "click": {"backgroundColor": "#198eef"}
                },
                "text": "Import File",
                "position": "top-left",
                "order": 1
              },
              {
                "export": true,
                "styles": {
                  "default": {
                    "backgroundColor": "#46acff", "height": "19px", "padding": "7px 14px", "color": "white", "border": "unset"
                  },
                  "hover": {"backgroundColor": "#2b9cf8"}, "click": {"backgroundColor": "#198eef"}
                },
                "text": "Export File",
                "position": "top-left",
                "order": 0
              }
            ]
        })
    );
    return activeTable;
}

HTML side:

<div id="billTableDiv">
    <active-table id="billTable" headerStyles='{"default":{"backgroundColor": "#d6d6d630"}}'></active-table>
</div>

<button type="submit" class="btn btn-primary" onclick="beforeSubmit();">Save</button>

<script>
function beforeSubmit() {
    const invalidForm = document.querySelector('form:invalid');
    if (!invalidForm) {
        $("#spinner").modal('show');
    }
    activeTable = document.getElementById("billTable");
    document.getElementById("formField").value = JSON.stringify(activeTable.getData());
}
...
setTimeout(() => {
    billTable = make_active_table(document.getElementById("billTable"), {{ bill_table|safe }})
});
</script>

[OvidijusParsiunas]

Hi @umayrh.

Thankyou for raising this issue. There was a bug where upon pasting data into an empty cell did not store it in memory, hence it was not exported. This has now been fixed in version 1.1.4. Please let me know if you see any other issues and I will take care of them as soon as I can. Thankyou!