mtndoe
mtndoe

Reputation: 444

bootstrap-editable: text to textarea

I’m currently using Bootstrap-table (http://bootstrap-table.wenzhixin.net.cn/) with the bootstrap-editable extension (https://github.com/wenzhixin/bootstrap-table/tree/master/src/extensions/editable) to create a table with editable fields. These fields use the default text input. I’m trying to change the default input (text) to textarea (http://vitalets.github.io/x-editable/docs.html#textarea).

As far as I can see this will require some tweaking of the javascript (the documentation does not list an option to change the default text to textarea). Is there someone who has done this, or something similar before? Who can provide me with a startingpoint in accomplishing this?

Upvotes: 1

Views: 1567

Answers (1)

ChrisB
ChrisB

Reputation: 96

If you look at http://vitalets.github.io/x-editable/docs.html#editable and find the "type" option, you will see that there is an option for "textarea", so you would just use this instead of "text". I haven't done it myself but have done a "select" type and code was something like this...

$('#disMedTable').bootstrapTable({
      columns: [{field: 'medID', visible: false },
                {field: 'MedicationCode', visible: false },
                {field: 'MedicationType', visible: false },
                {field: 'MedicationName', title: 'Med name', formatter: updPatPostop.medNameFormatter},
                {field: 'DosageAmount',   title: 'Dose', editable: {type: 'text'}},
                {field: 'DosageUnits',    title: 'Units', editable: {type: 'text'}},
                {field: 'DosageFrequency', title: 'When',
                                           editable: {type: 'select',
                                                      source: updPatPostop.medDoseTimeCodeSource }},
                {field: 'daysRequired',   title: 'Days', 
                                          editable: {type: 'number',
                                                     emptytext: '.' }}, 
                {field: 'orderAtDischarge', title: 'Order', formatter: updPatPostop.medOrderFormatter}
               ],      
      contextMenu: '#disMedContextMenu',

and so forth.

Upvotes: 1

Related Questions