wenzhixin / bootstrap-table

An extended table to integration with some of the most widely used CSS frameworks. (Supports Bootstrap, Semantic UI, Bulma, Material Design, Foundation, Vue.js)
https://bootstrap-table.com/
MIT License
11.74k stars 4.44k forks source link

Input field in custom column #3023

Closed basementmedia2 closed 5 years ago

basementmedia2 commented 7 years ago

Hi,

the following code works excellent:

<table 
                        id="stempeluhr_table"
                        data-toggle="table"
                        data-height="100%"
                        data-search="true"
                        data-url="ajax_load_stempeluhr.php"
                        data-side-pagination="client"
                        data-pagination="true"
                        data-show-toggle="true"
                        data-show-columns="true"
                        data-query-params="load_stempeluhr"
                        data-state-save="true",
                        data-state-save-id-table="stempeluhr_table">
                        <thead>
                        <tr>
                            <th data-sortable="true" data-field="kunde">Kunde</th>
                            <th data-sortable="true" data-field="nummer">Projektnummer</th>
                            <th data-sortable="true" data-field="name">Projektname</th>
                            <th data-field="operate" data-formatter="operateFormatter" data-events="operateEvents">Zeiterfassung</th>
                        </tr>
                        </thead>
                    </table>

function operateFormatter(value, row, index) {
        return [
        '<div class="form-inline">',
        '<div class="form-group">',
        '<input type="text" class="form-control small" placeholder="h" id="h_input">',
        '<input type="text" class="form-control small" placeholder="min" id="min_input">',
        '<a href="#" class="btn btn-defaul\"><span class="glyphicon glyphicon-time"></span></a>',
        '</div>',
        '</div>'
        ].join('');
    }

function load_stempeluhr(params) {
        params.user_id=sessionStorage.getItem('user_id');
        return params;
}

But i want the input field ids not to be named 'h_input' and 'min_input' but instead of that 'h_input'+number respectively 'min_input'+number and number is coming from php (ajax_load_stempeluhr.php) field 'ID'.

Is such complex naming thing possible? Best regards Daniel

thomas-nguyen-3 commented 7 years ago

a discussion here may help, the idea is to re-build the table based on the Ajax and refresh it. https://github.com/wenzhixin/bootstrap-table/issues/1178

update how you resolve your case would be nice !

wenzhixin commented 5 years ago

Close this issue because about 2 years, if the problem exists reopen it and provide a jsFiddle, thanks!