How do you display a form field by default?

How do you display a form field by default?

NateGNateG Posts: 7Questions: 2Answers: 0

What I want to be able to do is when the table is displayed, have one of the fields show as an empty text input. I don't want the user to have to click on it, it should just be editable by default like this:

I have tried to use a form field in the cell, but when the user changes a value and I try to update the data cache values programmatically on keyup (which I need to do to be able to access the value later) using:

$(element).on('keyup', function () {
        var cell = table.cell(element);
        cell.data($("input.withdrawal-amount-value", this).val());
});

DataTables overwrites the form field with the cell's value and clears out my form field. The alternative is to use the DataTables Editor plugin, but all of the examples I've found assume there needs to be some action done by the user (clicking on the row, clicking on an edit button, etc.) I just want a simple form field. Is there a way to do this in either DataTables or the Editor plugin? This seems like a really simple thing...

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 63,464Questions: 1Answers: 10,466 Site admin
    Answer ✓

    You have to be a bit careful with always shown inputs like that as it makes it very hard for DataTables to search / sort the table (for that column at least), since the data to be searched / sorted is a live DOM parameter, not just a string in the cell that DataTables has in its cache. It is possible, but its not easy... See this example for how it might be done to some degree.

    For Editor, have a look at this example - it uses a checkbox there, but a text input could also be used.

    Allan

  • NateGNateG Posts: 7Questions: 2Answers: 0

    Awesome, thanks for the response, these examples are what I was looking for.

This discussion has been closed.