Event before building the table

Event before building the table

curamuscuramus Posts: 4Questions: 2Answers: 0

Hello,

is there an event that is triggered before the datatable/editor is build? I've got the following scenario:

I habe an editor that display some rows from the accounting. If there are no rows in the model, I add a default row to the model because the editor should always display at least one line with the current amount of the receipt. I set the ID to 0.

<table id="accouting" class="display curamusEditDataTable" cellspacing="0" width="100%">
    <thead>
        <tr role="row">
            <th></th>
            <th class="sorting">Net</th>
            <th class="sorting">Gros</th>
            <th class="sorting">ID</th>
        </tr>
    </thead>
    <tbody>
        @for (int indexAccouting = 0; indexAccouting < Model.Accouting.Count; indexAccouting ++)
        {
        <tr role="row">
            <td></td>
            <td>
                @Html.DisplayFor(modelItem => Model.Accouting[indexAccouting].Netto)
            </td>
            <td>
                @Html.DisplayFor(modelItem => Model.Accouting[indexAccouting].Brutto)
            </td>
            <td>
                @Html.DisplayFor(modelItem => Model.Accouting[indexAccouting].ID)
            </td>
        </tr>}
    </tbody>
</table>

Until up here it works fine. Trouble starts when I add a new row. The id of new row is something like 1234567890 and when I submit the form, the values of all rows arrive in the controller, but not the id of the new row. which produce an invalid modelstate.

Is there some sort of event that is triggered before the table is build, so I can check in js if the model is empty and create a row using ditor.create(false)...

I thing using that will genereate a valid id for the initial row and all following rows.

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 61,449Questions: 1Answers: 10,055 Site admin

    I don't see your Javascript code for creating the DataTable, but could you not just add a condition before the $(...).DataTable(...); constructor?

    Allan

  • curamuscuramus Posts: 4Questions: 2Answers: 0
    edited March 2019

    Hi Allan,

    here is the code.

    var editor = new $.fn.dataTable.Editor({
            table: "#accounting",
            fields: [{
                "label": "Net:",
                "name": "net",
                "def": ""
            }, {
                "label": "Gross:",
                "name": "gross",
                "def": ""
            }
            ]
        });
    
    $('#accouting').DataTable({
            dom: "Bfrtip",
            order: [[1, 'asc']],
            searching: false,
            paging: false,
            bInfo: false,
            responsive: true,
            language: {
                url: '/Home/DatatableLocalisation/'
            },        
            "initComplete": function () {
                $(this).show();
            },
            columns: [
                {
                    data: null,
                    defaultContent: '',
                    className: 'select-checkbox',
                    orderable: false
                },
                {
                    data: "net",
                    render: $.fn.dataTable.render.number('.', ',', 2, '', " €"),
                    defaultContent: '',
                },
                {
                    data: "gross",
                    render: $.fn.dataTable.render.number('.', ',', 2, '', " €"),
                    defaultContent: '',
                },
                {
                    data: "DT_RowId",
                    visible: false,
                    searchable: false,
                    defaultContent: ''
                }
            ],
            select: {
                style: 'os',
                selector: 'td:first-child'
            },
            buttons: [
                { extend: "create", editor: editor},
                { extend: "remove", editor: editor },
            ]
        });
    

    Is it possible to check the number of rows in this section?

            "initComplete": function () {
                $(this).show();
            },
    

    It seems to be the perfect place. If there are no rows yet, I can use the editor to create the first row?!

  • allanallan Posts: 61,449Questions: 1Answers: 10,055 Site admin
    Answer ✓

    Yes you could do that. this.api().rows().length would tell you how many rows are in the loaded data. Then use create() if you need to.

    Allan

This discussion has been closed.