hkalbertl / jquery.appendGrid

The dynamic table input JavaScript plugin
https://appendgrid.azurewebsites.net
MIT License
148 stars 76 forks source link

Can't seem to get row labels to work #119

Closed richb201 closed 5 years ago

richb201 commented 6 years ago

I am trying to setup labels for the first column that will alternate between AM and PM. I have set the first column to readonly, but I can't seems to initialize the column when I set the type to text. I have a global variable called TimePd. The 'readonly' field is always blank. Am I doing something wrong? The AM and PM represent the morning or afternoon of a single day.

var TimePd='AM;PM;AM;PM;AM;PM;AM;PM;AM;PM';

$(function () { // Initialize appendGrid debugger; $('#tblAppendGrid').appendGrid({ caption: 'My Activities', initRows: 10, columns: [

        { name: 'Readonly', display: 'AM-PM',  type: 'text',  ctrlAttr: { maxlength: 10 }, ctrlAttr: { 'readonly':true }, ctrlCss: { width: '50px'}, ctrlOptions: TimePd },  
        { name: 'BusinessC', display: 'Business Component', ctrlAttr: { maxlength: 20 }, ctrlCss: { width: '160px'},type: 'select', ctrlOptions: BC },
        { name: 'Project', display: 'Project', ctrlAttr: { maxlength: 20 }, ctrlCss: { width: '160px'}, type: 'select', ctrlOptions: PR },
        { name: 'Activity', display: 'Activity', type: 'select', ctrlOptions: AC},
        { name: 'RecordId', type: 'hidden', value: 0 }
              ],
     customRowButtons: [
        {
         uiButton: { icons: { primary: 'ui-icon-print' }, label: '← Favorite' },
            click: function (evtObj, uniqueIndex, rowData) {

                value1=rowData.BusinessC;
                value2=rowData.Project;
                value3=rowData.Activity;

//store favorites localStorage.removeItem('key1'); localStorage.removeItem('key2'); localStorage.removeItem('key3'); localStorage.setItem('key1', value1); localStorage.setItem('key2', value2); localStorage.setItem('key3', value3);

            },
            btnClass: 'print'
        }
    ],
    hideRowNumColumn: true,
    rowButtonsInFront: false,
    hideButtons: {
        remove: true, 
        removeLast: true,
        insert: true,
        append: true,
        moveUp: true,
        moveDown: true
                }    
   });
hkalbertl commented 6 years ago

Hi,

I guess you want to generate a grid with 10 rows with default values (AM or PM) in the first column which is read-only. To set a column read-only, ctrlProp is required:

columns: [
  { name: 'readonly_column', ctrlProp: { readonly: true } }
]

For the default value, appendGrid cannot set multiple default values on a column. But you can init the grid with one of them (such as AM) first and then set some of the row with another value (such as PM)

var numOfRow = 10;
$('#tblAppendGrid').appendGrid({
  columns: [
    { name: 'readonly_column', ctrlProp: { readonly: true }, value: 'AM' }
    ...
  ],
  initRows: numOfRow 
  ...
});
// Change values after init, such as set PM to row 1,3,5,7,9
for (var r = 1; r < numOfRow; r+=2) {
  $('#tblAppendGrid').appendGrid('setCtrlValue', 'readonly_column', r, 'PM');
}

Hope it can help!

richb201 commented 6 years ago

thanks. works perfect

On Thu, Apr 26, 2018 at 5:43 AM, Albert L. notifications@github.com wrote:

Hi,

I guess you want to generate a grid with 10 rows with default values (AM or PM) in the first column which is read-only. To set a column read-only, ctrlProp is required:

columns: [ { name: 'readonly_column', ctrlProp: { readonly: true } } ]

For the default value, appendGrid cannot set multiple default values on a column. But you can init the grid with one of them (such as AM) first and then set some of the row with another value (such as PM)

var numOfRow = 10;$('#tblAppendGrid').appendGrid({ columns: [ { name: 'readonly_column', ctrlProp: { readonly: true }, value: 'AM' } ... ], initRows: numOfRow ... });// Change values after init, such as set PM to row 1,3,5,7,9for (var r = 1; r < numOfRow; r+=2) { $('#tblAppendGrid').appendGrid('setCtrlValue', 'readonly_column', r, 'PM'); }

Hope it can help!

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/hkalbertl/jquery.appendGrid/issues/119#issuecomment-384579348, or mute the thread https://github.com/notifications/unsubscribe-auth/AGoTmWVEkbaXOi39DVJ1X3tK5OY2Z5uXks5tsZavgaJpZM4Tdw8i .