bootgrid with editable textbox

Question

How do I add an editable textbox in my BootGrid with the column's text, so that in it opens the textbox for editing, and if I change it moving to the next line or losing focus of the textbox will cause a save to the database?

How do I do that?

You have to use bootgrid formatter for adding the textbox inside table, and you should create a script to do your saving mechanism for losing focus. :) — vinodh, Oct 21 '15 at 11:09

score 0 · Answer 1 · answered Apr 06 '16 at 13:16

<table id="grid-keep-selection" class="table table-condensed table-hover table-striped">
    <thead>
        <tr>
            <th data-column-id="order" data-type="numeric" data-identifier="true">#</th>
            <th data-column-id="selected" data-formatter="commands" data-sortable="false">Seçili</th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            <tr>
                <td>@i</td>
            </tr>
            i += 1;
        }
    </tbody>
</table>


    $("#grid-keep-selection").bootgrid({
        formatters: {
            "commands": function (column, row) {
                return "<input type=\"number\" class=\"form-control\" name=\"txtSoru\" id=\"txtSoru" + row + "\" value=\"0\" min=\"0\" max=\"" + row + "\" />";
            }
        }
    });

bootgrid with editable textbox

1 Answers1