DataTable editable cell data get truncated

i4shagi

I am making column cell as editable in the DataTable. I am able to edit the cell. But the rendered data get truncated after the space . For example if the data is "Mr P Tepp" it will display in the editable input as just "Mr" remaining text get truncated.

I can see that the values are generating correctly and printing in the td & I can see the data in the source code. While debugging too its passing data without truncating.

I have created a function to make the cell as editable and calling the function into DataTable.

function prepareEditableOrder(data, type, row, meta) {
 return '<input class="form-control text-wrap cell-datatable" id="' + row.Id + '" type="text"  value = ' + data + ' >';
}


$('#conditionTable' + j).DataTable({
                    "bLengthChange": false,
                    "paging": false,
                    columns: [
                        { title: "Condition Name", },
                        { title: "Condition id", },
                        { title: "Condition Value", render: prepareEditableOrder }
                    ]

                });

Portion of "View" code is as below

 <div class="tab-pane active" id="@($"Scenario{j}tab1")" role="tabpanel">
                                <table id="@($"conditionTable{j}")"
                                       class="table table-striped">
                                    <thead>
                                        <tr>
                                            <th>Condition Name</th>
                                            <th>Condition id</th>
                                            <th>Conditon Value</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach (ConditionModel ConditionMdl in Model.conditionList[i])
                                        {
                                            <tr>
                                                <td>@Html.DisplayFor(modelItem => ConditionMdl.ConName)</td>
                                                <td>@Html.DisplayFor(modelItem => ConditionMdl.Conditionid)</td>
                                                <td class="editable" edit_type="click">@Html.DisplayFor(modelItem => ConditionMdl.ConValue)</td>
                                            </tr>
                                        }

                                    </tbody>
                                </table>
                            </div>

I googled and tried different options but no luck. Could anyone help me to get the data without truncate and display in the DataTable.

kthorngren

Maybe you need to wrap the value in quotes, for example:

return '<input class="form-control text-wrap cell-datatable" id="' + row.Id + '" type="text"  value = "' + data + '" >';

Note the additional " here value = "' + data + '".

If this doesn't help then please post a link to your page or a test case replicating the issue so we can help debug.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin

i4shagi

Thank you so much Kevin. The issue was with missing "" . after I update value = "' + data + '" it works perfectly. Once again tons of thanks!!!!