How to prepopulate rows into DataTable in Plumsail

jyou · July 26, 2021, 9:21pm

Hi there,

I would like to pre-populate more than one rows into the DataTable control. I have the following code but it only enables me to prepopulate one row into the DataTable after clicking on "Add new record".

fd.spRendered(function() {
//select DataTable control to prepopulate
var dt = fd.control('DataTable1');
var isNew = false;

dt.widget.wrapper.find('.k-grid-add').on('click', e => {
    isNew = true;
});

dt.widget.bind('edit', function(e) {
    if (isNew) {
        isNew = false;
        //set values for Column1 and Column2
        e.model.set('Agenda', '1) Down Payment received');
        e.model.set('Agenda', '2) Approved profile drawing(s) received');
        e.model.set('NOTES', 'Item 3');
        DataTable1.Rows[1][0] = "0"; 
    }
});

});

With the above code, I can achieve the following, but it is missing the '1) Down Payment received' :

I would like my dataTable to look like the following:

Any advice?
Thanks,

Nikita_Kurguzov · July 27, 2021, 9:05pm

Dear @jyou,
It's actually much simpler for simple row population, the following would work:

fd.rendered(function(){
    var dt_rows = [];
    var row1 = {Column1: "Test A", Column2: "Hello, world!"};
    dt_rows.push(row1);
    var row2 = {Column1: "Test B", Column2: "Goodbye, blue sky"};
    dt_rows.push(row2);
    fd.control('DataTable1').value = dt_rows;
});

jyou · July 28, 2021, 9:09pm

@Nikita_Kurguzov

Thank you, your code works well. However, there are a lot of rows I would like to prepopulate into 12 different data tables.

I find that using your approach, the form would take too long to load or the form would not load the data table rows at all.

Please refer to my code below, is there a way for me to load the rows faster ?

fd.spRendered(function(){

var dt_rows_m3 = [];
var row = {Agenda: "1) Down Payment received"};
dt_rows_m3.push(row);
var row = {Agenda: "2) Approved profile drawing(s) received"};
dt_rows_m3.push(row);
var row = {Agenda: "3) Approved line layout received"};
dt_rows_m3.push(row);
var row = {Agenda: "4) Full Project Scope reviewed"};
dt_rows_m3.push(row);
var row = {Agenda: "5) Customer Design Guidelines determined"};
dt_rows_m3.push(row);
var row = {Agenda: "6) Reference Projects identified"};
dt_rows_m3.push(row);
var row = {Agenda: "7) Technical uncertainty identified"};
dt_rows_m3.push(row);
var row = {Agenda: "8) Identified long mechanical lead items"};
dt_rows_m3.push(row);
var row = {Agenda: "9) Identified long electrical lead items"};
dt_rows_m3.push(row);
var row = {Agenda: "10) Reviewed project risks / develop plan to mitigate"};
dt_rows_m3.push(row);
var row = {Agenda: "11) Determined equipment colour"};
dt_rows_m3.push(row);
var row = {Agenda: "12) Reviewed capacity plan"};
dt_rows_m3.push(row);
var row = {Agenda: "13) Project Schedule reviewed"};
dt_rows_m3.push(row);
var row = {Agenda: "14) M2 MCBA Budget reviewed "};
dt_rows_m3.push(row);

fd.control('DataTable1').value = dt_rows_m3;


var dt_rows_m3_cust = [];
var row = {Agenda: "1) Determined maximum size and weight of material (coil, blank, etc)"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "2) Determined method of loading material (crane, forklift, etc)"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "3) Is manual threading of material acceptable?"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "4) Determined method to prevent material from un-threading"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "5) Communicated method for aligning material to to dies, rollformer, etc"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "6) Determined Customer expectation for tooling changeover"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "7) Communicated punch die loading process"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "8) Communicated punch pattern strategy (# of holes, frequency, etc)"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "9) Communicated material feed process into rollformer"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "10) Communicated roll tooling changeover process"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "11) Determined method of material gauge adjustment"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "12) Determined material lubrication requirement"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "13) Communicated amount of material scrap during threading process"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "14) Determined climate extremes within Customer's plant"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "15) Confirmed cooling requirements for HPU"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "16) Communicated cut-off die loading process"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "17) Determined cut-off inserts required by Customer"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "18) Determined die slug management"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "19) Determined method of discharging end product "};
dt_rows_m3_cust.push(row);
var row = {Agenda: "20) Confirmed power supply from Customer"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "21) Determined requirements for integrating Customer's equipment"};
dt_rows_m3_cust.push(row)
var row = {Agenda: "22) Discussed strategy for selecting end product in control system"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "23) Discussed line operation from operator perspective"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "24) Determined any Customer requirement for electrical components"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "25) Discussed equipment safety & Customer safety requirements"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "26) Determined Customer plant restrictions for placement of equipment"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "27) Determined Customer's key product characteristics (KPC)"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "28) Discussed test material requirement and supply"};
dt_rows_m3_cust.push(row);
var row = {Agenda: "29) Discussed Customer buy-off requirements"};
dt_rows_m3_cust.push(row);

fd.control('DataTable2').value = dt_rows_m3_cust;


var dt_rows_m4_mech = [];
var row = {Agenda: "1) M3 Action Items completed"};
dt_rows_m4_mech.push(row);
var row = {Agenda: "2) Completed M4 Preliminary Design Review"};
dt_rows_m4_mech.push(row);
var row = {Agenda: "3) Completed M4 Customer Review"};
dt_rows_m4_mech.push(row);
var row = {Agenda: "4) Referenced M12 Lessons Learned Database"};
dt_rows_m4_mech.push(row);
var row = {Agenda: "5) Product Drawing approved (profile & holes)"};
dt_rows_m4_mech.push(row);
var row = {Agenda: "6) Sequence Of Operation (S.O.O.) developed"};
dt_rows_m4_mech.push(row);
var row = {Agenda: "7) Completed Roll Tooling design review (flower, side roll specification)"};
dt_rows_m4_mech.push(row);
var row = {Agenda: "8) Designed gears for driven roll forming passes"};
dt_rows_m4_mech.push(row);
var row = {Agenda: "9) Punch Pattern drawing completed"};
dt_rows_m4_mech.push(row);
var row = {Agenda: "10) Punch Progression drawing completed"};
dt_rows_m4_mech.push(row);
var row = {Agenda: "11) Preliminary Electrical strategy discussed"};
dt_rows_m4_mech.push(row);
var row = {Agenda: "12) Long Lead Items Released to Purchasing (Mech / Elec)"};
dt_rows_m4_mech.push(row);
var row = {Agenda: "13) Developed specification for Hydraulic Power Unit"};
dt_rows_m4_mech.push(row);
var row = {Agenda: "14) Equipment colour recorded (AX, line layout)"};
dt_rows_m4_mech.push(row);
var row = {Agenda: "15) Updated Preliminary Line Layout"};
dt_rows_m4_mech.push(row);
var row = {Agenda: "16) Risks to CQS identified"};
dt_rows_m4_mech.push(row);
var row = {Agenda: "17) Project Schedule reviewed"};
dt_rows_m4_mech.push(row);
var row = {Agenda: "18) Reviewed Manufacturing capacity/outsourcing", NOTES: "(Code Blue)"};
dt_rows_m4_mech.push(row);
var row = {Agenda: "19) Reviewed Master Cost Budget Analysis"};
dt_rows_m4_mech.push(row);

fd.control('DataTable3').value = dt_rows_m4_mech;

};

Please advise, thank you.

Nikita_Kurguzov · July 28, 2021, 10:21pm

Dear @jyou,
Not really, maybe you can shorten it a little, like this:

fd.rendered(function(){
    var dt_rows = [
      {Column1: "Test A", Column2: "Hello, world!"},
      {Column1: "Test B", Column2: "Goodbye, blue sky"}
    ];
    fd.control('DataTable1').value = dt_rows;
});

jyou · July 29, 2021, 7:57pm

@Nikita_Kurguzov

I tried your new code and I have my code as the following: But sometimes I see when I re-load the form, all the rows in the Datatable have disappeared. Please advice:

fd.spRendered(function(){

var dt_rows_m3 = [
  {Agenda: "1) Down Payment received"},
  {Agenda: "2) Approved profile drawing(s) received"},
  {Agenda: "3) Approved line layout received"},
  {Agenda: "4) Full Project Scope reviewed"},
  {Agenda: "5) Customer Design Guidelines determined"},
  {Agenda: "6) Reference Projects identified"},
  {Agenda: "7) Technical uncertainty identified"},
  {Agenda: "8) Identified long mechanical lead items"},
  {Agenda: "9) Identified long electrical lead items"},
  {Agenda: "10) Reviewed project risks / develop plan to mitigate"},
  {Agenda: "11) Determined equipment colour"},
  {Agenda: "12) Reviewed capacity plan"},
  {Agenda: "13) Project Schedule reviewed"},
  {Agenda: "14) M2 MCBA Budget reviewed "}
];
fd.control('DataTable1').value = dt_rows_m3;
console.log(dt_rows_m3);

var dt_rows_m4_cust = [
  {Agenda: "1) Determined maximum size and weight of material (coil, blank, etc)"},
  {Agenda: "2) Determined method of loading material (crane, forklift, etc)"},
  {Agenda: "3) Is manual threading of material acceptable?"},
  {Agenda: "4) Determined method to prevent material from un-threading"},
  {Agenda: "5) Communicated method for aligning material to to dies, rollformer, etc"},
  {Agenda: "6) Determined Customer expectation for tooling changeover"},
  {Agenda: "7) Communicated punch die loading process"},
  {Agenda: "8) Communicated punch pattern strategy (# of holes, frequency, etc)"},
  {Agenda: "9) Communicated material feed process into rollformer"},
  {Agenda: "10) Communicated roll tooling changeover process"},
  {Agenda: "11) Determined method of material gauge adjustment"},
  {Agenda: "12) Determined material lubrication requirement"},
  {Agenda: "13) Communicated amount of material scrap during threading process"},
  {Agenda: "14) Determined climate extremes within Customer's plant"},
  {Agenda: "15) Confirmed cooling requirements for HPU"},
  {Agenda: "16) Communicated cut-off die loading process"},
  {Agenda: "17) Determined cut-off inserts required by Customer"},
  {Agenda: "18) Determined die slug management"},
  {Agenda: "19) Determined method of discharging end product "},
  {Agenda: "20) Confirmed power supply from Customer"},
  {Agenda: "21) Determined requirements for integrating Customer's equipment"},
  {Agenda: "22) Discussed strategy for selecting end product in control system"},
  {Agenda: "23) Discussed line operation from operator perspective"},
  {Agenda: "24) Determined any Customer requirement for electrical components"},
  {Agenda: "25) Discussed equipment safety & Customer safety requirements"},
  {Agenda: "26) Determined Customer plant restrictions for placement of equipment"},
  {Agenda: "27) Determined Customer's key product characteristics (KPC)"},
  {Agenda: "28) Discussed test material requirement and supply"},
  {Agenda: "29) Discussed Customer buy-off requirements"}
];
fd.control('DataTable2').value = dt_rows_m4_cust;

 var dt_rows_m4_mech = [
  {Agenda: "1) M3 Action Items completed"},
  {Agenda: "2) Completed M4 Preliminary Design Review"},
  {Agenda: "3) Completed M4 Customer Review"},
  {Agenda: "4) Referenced M12 Lessons Learned Database"},
  {Agenda: "5) Product Drawing approved (profile & holes)"},
  {Agenda: "6) Sequence Of Operation (S.O.O.) developed"},
  {Agenda: "7) Completed Roll Tooling design review (flower, side roll specification)"},
  {Agenda: "8) Designed gears for driven roll forming passes"},
  {Agenda: "9) Punch Pattern drawing completed"},
  {Agenda: "10) Punch Progression drawing completed"},
  {Agenda: "11) Preliminary Electrical strategy discussed"},
  {Agenda: "12) Long Lead Items Released to Purchasing (Mech / Elec)"},
  {Agenda: "13) Developed specification for Hydraulic Power Unit"},
  {Agenda: "14) Equipment colour recorded (AX, line layout)"},
  {Agenda: "15) Updated Preliminary Line Layout"},
  {Agenda: "16) Risks to CQS identified"},
  {Agenda: "17) Project Schedule reviewed"},
  {Agenda: "18) Reviewed Manufacturing capacity/outsourcing", NOTES: "(Code Blue)"},
  {Agenda: "19) Reviewed Master Cost Budget Analysis"}
];
fd.control('DataTable3').value = dt_rows_m4_mech;


var dt_rows_m4_elec = [
  {Agenda: "1) M4 Customer action Items completed"},
  {Agenda: "2) Sequence Of Operation (S.O.O.) developed"},
  {Agenda: "3) Control system strategy determined (plc type, HMI spec, length control, etc)"},
  {Agenda: "4) Long Lead Items Released to Purchasing"},
  {Agenda: "5) Customer required components used in design"},
  {Agenda: "6) Risks to CQS identified"},
  {Agenda: "7) Reviewed Master Cost Budget Analysis"}
];
fd.control('DataTable4').value = dt_rows_m4_elec;
});

Please see the error message:

I have tried deleting and re-adding datatable control, but after I reload the form for many times, the rows in Datatable just disappear.

Please advise.

Thanks.

Nikita_Kurguzov · July 30, 2021, 6:56am

Dear @jyou,
Take a look at this error:

Seems like there is an error somewhere else in the JavaScript code, as I've tried this code and it seems to work properly.

Try to remove the rest of the code from the form and test just this.

jyou · July 30, 2021, 3:54pm

@Nikita_Kurguzov

I have fixed the error in JS as mentioned above, however I am still facing the issue when I reload the form many times or re-open the form, the rows in DataTable disappear. Please advise:

Please refer to my code below:

fd.spRendered(function() {

fd.field('M3_Milestone_Number').value = 'M3';
fd.field('M4_Milestone_Number_Mech').value = 'M4';
fd.field('M4_Milestone_Number_Elec').value = 'M4';
fd.field('M5_Milestone_Number').value = 'M5';
fd.field('M6_Milestone_Number').value = 'M6';
fd.field('M7_Milestone_Number_Mech').value = 'M7';
fd.field('M7_Milestone_Number_Elec').value = 'M7';
fd.field('M8_Milestone_Number').value = 'M8';
fd.field('M9_Milestone_Number').value = 'M9';
fd.field('D9_Milestone_Number').value = 'D9';
fd.field('M10_Milestone_Number').value = 'M10';
fd.field('M11_Milestone_Number').value = 'M11';
fd.field('M12_Milestone_Number').value = 'M12';

var dt_rows_m3 = [
  {Agenda: "1) Down Payment received"},
  {Agenda: "2) Approved profile drawing(s) received"},
  {Agenda: "3) Approved line layout received"},
  {Agenda: "4) Full Project Scope reviewed"},
  {Agenda: "5) Customer Design Guidelines determined"},
  {Agenda: "6) Reference Projects identified"},
  {Agenda: "7) Technical uncertainty identified"},
  {Agenda: "8) Identified long mechanical lead items"},
  {Agenda: "9) Identified long electrical lead items"},
  {Agenda: "10) Reviewed project risks / develop plan to mitigate"},
  {Agenda: "11) Determined equipment colour"},
  {Agenda: "12) Reviewed capacity plan"},
  {Agenda: "13) Project Schedule reviewed"},
  {Agenda: "14) M2 MCBA Budget reviewed "}
];
fd.control('DataTable1').value = dt_rows_m3;

var dt_rows_m4_cust = [
  {Agenda: "1) Determined maximum size and weight of material (coil, blank, etc)"},
  {Agenda: "2) Determined method of loading material (crane, forklift, etc)"},
  {Agenda: "3) Is manual threading of material acceptable?"},
  {Agenda: "4) Determined method to prevent material from un-threading"},
  {Agenda: "5) Communicated method for aligning material to to dies, rollformer, etc"},
  {Agenda: "6) Determined Customer expectation for tooling changeover"},
  {Agenda: "7) Communicated punch die loading process"},
  {Agenda: "8) Communicated punch pattern strategy (# of holes, frequency, etc)"},
  {Agenda: "9) Communicated material feed process into rollformer"},
  {Agenda: "10) Communicated roll tooling changeover process"},
  {Agenda: "11) Determined method of material gauge adjustment"},
  {Agenda: "12) Determined material lubrication requirement"},
  {Agenda: "13) Communicated amount of material scrap during threading process"},
  {Agenda: "14) Determined climate extremes within Customer's plant"},
  {Agenda: "15) Confirmed cooling requirements for HPU"},
  {Agenda: "16) Communicated cut-off die loading process"},
  {Agenda: "17) Determined cut-off inserts required by Customer"},
  {Agenda: "18) Determined die slug management"},
  {Agenda: "19) Determined method of discharging end product "},
  {Agenda: "20) Confirmed power supply from Customer"},
  {Agenda: "21) Determined requirements for integrating Customer's equipment"},
  {Agenda: "22) Discussed strategy for selecting end product in control system"},
  {Agenda: "23) Discussed line operation from operator perspective"},
  {Agenda: "24) Determined any Customer requirement for electrical components"},
  {Agenda: "25) Discussed equipment safety & Customer safety requirements"},
  {Agenda: "26) Determined Customer plant restrictions for placement of equipment"},
  {Agenda: "27) Determined Customer's key product characteristics (KPC)"},
  {Agenda: "28) Discussed test material requirement and supply"},
  {Agenda: "29) Discussed Customer buy-off requirements"}
];
fd.control('DataTable2').value = dt_rows_m4_cust;

var dt_rows_m4_cust = [
  {Agenda: "1) Determined maximum size and weight of material (coil, blank, etc)"},
  {Agenda: "2) Determined method of loading material (crane, forklift, etc)"},
  {Agenda: "3) Is manual threading of material acceptable?"},
  {Agenda: "4) Determined method to prevent material from un-threading"},
  {Agenda: "5) Communicated method for aligning material to to dies, rollformer, etc"},
  {Agenda: "6) Determined Customer expectation for tooling changeover"},
  {Agenda: "7) Communicated punch die loading process"},
  {Agenda: "8) Communicated punch pattern strategy (# of holes, frequency, etc)"},
  {Agenda: "9) Communicated material feed process into rollformer"},
  {Agenda: "10) Communicated roll tooling changeover process"},
  {Agenda: "11) Determined method of material gauge adjustment"},
  {Agenda: "12) Determined material lubrication requirement"},
  {Agenda: "13) Communicated amount of material scrap during threading process"},
  {Agenda: "14) Determined climate extremes within Customer's plant"},
  {Agenda: "15) Confirmed cooling requirements for HPU"},
  {Agenda: "16) Communicated cut-off die loading process"},
  {Agenda: "17) Determined cut-off inserts required by Customer"},
  {Agenda: "18) Determined die slug management"},
  {Agenda: "19) Determined method of discharging end product "},
  {Agenda: "20) Confirmed power supply from Customer"},
  {Agenda: "21) Determined requirements for integrating Customer's equipment"},
  {Agenda: "22) Discussed strategy for selecting end product in control system"},
  {Agenda: "23) Discussed line operation from operator perspective"},
  {Agenda: "24) Determined any Customer requirement for electrical components"},
  {Agenda: "25) Discussed equipment safety & Customer safety requirements"},
  {Agenda: "26) Determined Customer plant restrictions for placement of equipment"},
  {Agenda: "27) Determined Customer's key product characteristics (KPC)"},
  {Agenda: "28) Discussed test material requirement and supply"},
  {Agenda: "29) Discussed Customer buy-off requirements"}
];
fd.control('DataTable2').value = dt_rows_m4_cust;

var dt_rows_m4_mech = [
  {Agenda: "1) M3 Action Items completed"},
  {Agenda: "2) Completed M4 Preliminary Design Review"},
  {Agenda: "3) Completed M4 Customer Review"},
  {Agenda: "4) Referenced M12 Lessons Learned Database"},
  {Agenda: "5) Product Drawing approved (profile & holes)"},
  {Agenda: "6) Sequence Of Operation (S.O.O.) developed"},
  {Agenda: "7) Completed Roll Tooling design review (flower, side roll specification)"},
  {Agenda: "8) Designed gears for driven roll forming passes"},
  {Agenda: "9) Punch Pattern drawing completed"},
  {Agenda: "10) Punch Progression drawing completed"},
  {Agenda: "11) Preliminary Electrical strategy discussed"},
  {Agenda: "12) Long Lead Items Released to Purchasing (Mech / Elec)"},
  {Agenda: "13) Developed specification for Hydraulic Power Unit"},
  {Agenda: "14) Equipment colour recorded (AX, line layout)"},
  {Agenda: "15) Updated Preliminary Line Layout"},
  {Agenda: "16) Risks to CQS identified"},
  {Agenda: "17) Project Schedule reviewed"},
  {Agenda: "18) Reviewed Manufacturing capacity/outsourcing", NOTES: "(Code Blue)"},
  {Agenda: "19) Reviewed Master Cost Budget Analysis"}
];
fd.control('DataTable3').value = dt_rows_m4_mech;


var dt_rows_m4_elec = [
  {Agenda: "1) M4 Customer action Items completed"},
  {Agenda: "2) Sequence Of Operation (S.O.O.) developed"},
  {Agenda: "3) Control system strategy determined (plc type, HMI spec, length control, etc)"},
  {Agenda: "4) Long Lead Items Released to Purchasing"},
  {Agenda: "5) Customer required components used in design"},
  {Agenda: "6) Risks to CQS identified"},
  {Agenda: "7) Reviewed Master Cost Budget Analysis"}
];
fd.control('DataTable4').value = dt_rows_m4_elec;


var dt_rows_m5 = [
  {Agenda: "1) M4 Action Items completed"},
  {Agenda: "2) M5 Final Design Review Completed"},
  {Agenda: "3) Engineering Specifications Form completed"},
  {Agenda: "4) Final Line Layout and S.O.O. signed by customer"},
  {Agenda: "5) Supplier die layout approved"},
  {Agenda: "6) Roll Tooling Approved by Customer"},
  {Agenda: "7) Confirmed mech/elec line integration to customer's equipment"},
  {Agenda: "8) Hydraulic Requirement Form completed"},
  {Agenda: "9) Developed specification for Air System"},
  {Agenda: "10) Released Purchase Orders for long lead items" , NOTES: "(verify no impact to schedule)"},
  {Agenda: "11) Determined servo motor/VFD specification"},
  {Agenda: "12) Determined sensor and bracket requirements"},
  {Agenda: "13) Risks to CQS addressed"},
  {Agenda: "14) Reviewed project timing" , NOTES: "(Refer to Gantt chart X:/2.0 Project Management/2.5 Project Planning)"},
  {Agenda: "15) Reviewed Master Cost Budget Analysis"}
];
fd.control('DataTable5').value = dt_rows_m5;


var dt_rows_m6 = [
   {Agenda: "1) M5 Action Items completed"},
   {Agenda: "2) M6 Design Verification Review completed" , NOTES: "(Identify which product groups are complete)"},
   {Agenda: "3) M6 Design Checklist completed" , NOTES: "(Review checklist X:\Project Management\XXXX\2.0 Project Management\2.4 Milestone Check List)"},
   {Agenda: "4) Designed brackets for required sensors"},
   {Agenda: "5) Released PO's for Hydraulics and Servomotor/Drives"},
   {Agenda: "6) Reviewed project timing and mitigated schedule issues" , NOTES: "(Refer to Gantt chart X:/2.0 Project Management/2.5 Project Planning)"},
   {Agenda: "7) Reviewed Master Cost Budget Analysis"}
];
fd.control('DataTable6').value = dt_rows_m6;

var dt_rows_m7_mech = [
   {Agenda: "1) M6 Action Items completed"},
   {Agenda: "2) M7 Design Checklist completed" , NOTES: "(Review checklist X:\ Project Management \ XXXX \ 2.0 Project Management \ 2.4 Milestone Check List)"},
   {Agenda: "3) Reviewed project timing and mitigated schedule issues" , NOTES: "(Refer to Gantt chart X:/2.0 Project Management/2.5 Project Planning)"},
   {Agenda: "4) Progress payments up-to-date"}
];
fd.control('DataTable7').value = dt_rows_m7_mech;

 var dt_rows_m7_elec = [
   {Agenda: "1) M4-M6 Action Items completed"},
   {Agenda: "2) Sensor location determined" },
   {Agenda: "3) Sensor brackets released"},
   {Agenda: "4) Electrical schematic and panel design released"},
   {Agenda: "5) Spare Parts identified"},
   {Agenda: "6) Risks to CQS addressed"},
   {Agenda: "7) Reviewed project timing and mitigated schedule issues" , NOTES: "(Refer to Gantt chart X:/2.0 Project Management/2.5 Project Planning)"},
   {Agenda: "8) Reviewed Master Cost Budget Analysis"},
   {Agenda: "9) Programming resource assigned"}
];
fd.control('DataTable8').value = dt_rows_m7_elec;

var dt_rows_m8 = [
   {Agenda: "1) M7 Action Items completed"},
   {Agenda: "2) Confirmed delivery of test material for M9" },
   {Agenda: "3) Prepared test matrix"},
   {Agenda: "4) Completed Blue Book"},
   {Agenda: "5) Prepared Project Command Center (PCC) board"},
   {Agenda: "6) Processed drawing corrections and ECRs"},
   {Agenda: "7) Reviewed project timing and mitigated schedule issues" , NOTES: "(Refer to Gantt chart X:/2.0 Project Management/2.5 Project Planning)"},
   {Agenda: "8) Progress payments up-to-date"}
];
fd.control('DataTable9').value = dt_rows_m8;
});



fd.spRendered(function() {
 var dt_rows_m9 = [
   {Agenda: "1) M8 Action Items completed"},
   {Agenda: "2) Received test material" },
   {Agenda: "3) Completed tensile testing of test material"},
   {Agenda: "4) Completed test meeting"},
   {Agenda: "5) Processed drawing corrections and ECRs"},
   {Agenda: "6) Identified remaining items in FAB"},
   {Agenda: "7) Identified remaining items in Purchasing" },
   {Agenda: "8) Submitted M9 VOC to Customer"},
   {Agenda: "9) Reviewed project timing and mitigated schedule issues" , NOTES: "(Refer to Gantt chart X:/2.0 Project Management/2.5 Project Planning)"},
   {Agenda: "10) Reviewed Master Cost Budget Analysis"},
   {Agenda: "11) Progress payments up-to-date"}
];
fd.control('DataTable10').value = dt_rows_m9;

var dt_rows_d9 = [
   {Agenda: "1) Blue Book prepared and available"},
   {Agenda: "2) Project Command Center prepared and available" },
   {Agenda: "3) Reviewed M8 open items"},
   {Agenda: "4) Reviewed M9 open items"},
   {Agenda: "5) Discussed Test Material Requirements & Test Plan"},
   {Agenda: "6) Discussed KPC and Quality requirements"},
   {Agenda: "7) Reviewed Sequence Of Operations" },
   {Agenda: "8) Discussed any special testing requirements"},
   {Agenda: "9) Discussed SR&ED items"},
   {Agenda: "10) Reviewed project timing and mitigated schedule issues"}
];
fd.control('DataTable11').value = dt_rows_d9;

var dt_rows_m10 = [
   {Agenda: "1) M9 Action Items completed"},
   {Agenda: "2) Updated Sequence of Operations (S.O.O.)" },
   {Agenda: "3) Design meets all COA requirements"},
   {Agenda: "4) Followed test matrix"},
   {Agenda: "5) Completed dimensional layout"},
   {Agenda: "6) Retained witness samples"},
   {Agenda: "7) Completed Dry Cycle Report" },
   {Agenda: "8) Completed Project Operating Manuals"},
   {Agenda: "9) Completed Final Inspection Checklist"},
   {Agenda: "10) Placed Final Inspection Tag on equipment"},
   {Agenda: "11) Created Shipping load plan"},
   {Agenda: "12) Documented R&D items" },
   {Agenda: "13) Reviewed project timing and mitigated schedule issues"  NOTES: "(Refer to Gantt chart X:/2.0 Project Management/2.5 Project Planning)"},
   {Agenda: "14) Reviewed Master Cost Budget Analysis" },
   {Agenda: "15) Progress payments up-to-date"}
];
fd.control('DataTable12').value = dt_rows_m10;
});

I need to prepopulate the rows for 14 different datatables based on my form design, please refer below (each datatable for each tab (M3- M12)): However, the pre-population of rows stopped working after the "M8" tab. Is it because there is too much data going into datatables?

Please refer to the following error message:

Please advise.

Margo · August 2, 2021, 11:18am

Hello @jyou,

First, place all code within one spRendered function.

Also, check the internal name of the Data Table control in the ninth tab. And as you have multiple controls, it is a good idea to check that the control is fully loaded before populating it. Add ready() event to all Data Table controls.

As I understand this is the part of the code where the script breaks.

fd.control('DataTable9').value = dt_rows_m8;
});
//remove extra even handler
fd.spRendered(function() {
 var dt_rows_m9 = [
   {Agenda: "1) M8 Action Items completed"},
   {Agenda: "2) Received test material" },
   {Agenda: "3) Completed tensile testing of test material"},
   {Agenda: "4) Completed test meeting"},
   {Agenda: "5) Processed drawing corrections and ECRs"},
   {Agenda: "6) Identified remaining items in FAB"},
   {Agenda: "7) Identified remaining items in Purchasing" },
   {Agenda: "8) Submitted M9 VOC to Customer"},
   {Agenda: "9) Reviewed project timing and mitigated schedule issues" , NOTES: "(Refer to Gantt chart X:/2.0 Project Management/2.5 Project Planning)"},
   {Agenda: "10) Reviewed Master Cost Budget Analysis"},
   {Agenda: "11) Progress payments up-to-date"}
];
//check the internal name of the control
//add ready event to make sure the control is fully loaded
fd.control('DataTable10').ready().then(function(){
    fd.control('DataTable10').value = dt_rows_m9;
});

jyou · August 4, 2021, 5:20pm

@Margo @Nikita_Kurguzov Thank you for your support, my code is working fine now, as expected.

katy · September 20, 2024, 1:15pm

@Margo is there a way to prepopulate with the value from another field? I tried
Column2: fd.field('FieldName').value
Column2: (fd.field('FieldName').value)
Column2: fd.field('FieldName').value()
Column2: (fd.field('FieldName').value())
Column2: [FieldName]
None of it works - it does not put the number from the field into that cell.

StepanS · September 21, 2024, 7:58am

Hello @katy

FORM
BUTTON setting:
JS

window.addValue = () => {
  const title = fd.field("Title").value;
  const dt = fd.control("DataTable1");
  const objToAdd = {
    Column2: title,
  };

  dt.value.push(objToAdd);
};

When the button is clicked and I filled in data to "Title" field:
when I change Title fields with another value and click button:

Is this good enough or you need anything else?
Regards
Stepan

katy · September 21, 2024, 10:12pm

Hello @StepanS that is a great solution, but kinda not good for my scenario
When a user opens the form (it is Edit form so the information is already saved) I need the first raw in the data table to be already prepopulated. So it should be done on Edit form loading. I have the following code:

fd.rendered(function(){
    var dt_rows = [];
    var row1 = {Column1: "1"};
    dt_rows.push(row1);
    fd.control('FA').value = dt_rows;
});

but I need to add info into Column2 from another field on the form (that is saved already) Your solution is perfect for the New form and I will definitely remember it for the future, I am sure that it would be useful! Sorry for not specifying about Edit form in my reply earlier

StepanS · September 22, 2024, 6:49am

Hello @katy ,
OK, it should work the same way. When the Edit Form is loaded

fd.spRendered(() {});

Inside this function, you can have the same logic behind.

fd.spRendered(() => {
  const title = fd.field("Title").value;
  const dt = fd.control("DataTable1");
  const objToAdd = {
    Column2: title,
  };

  dt.value.push(objToAdd);
});

I do not understand what is wrong, I think you go it You got the code, so just change "Column1" to "Column2" and it must be working

My code above is working exactly as you described on editForm. If I have saved data in "title" I can populate Data Table with this field to Column2
Stepan

katy · September 23, 2024, 6:02pm

Hi @StepanS Thank you for the code, it does populate it but on the second raw:

How can I combine those two codes so all the data will be in one raw?
Also when I reopen the form for editing again another raw is populated and that is not what I need

fd.rendered(function(){
    var dt_rows = [];
    var row1 = {PYear: "1"};
    dt_rows.push(row1);
    fd.control('FA').value = dt_rows;
});

fd.spRendered(() => {
    const title = fd.field("Variance2CEW").value;
    const dt = fd.control("FA");
    const objToAdd = {
    VolProj: title,
  };

  dt.value.push(objToAdd);
});

Sorry, I am not a real developer and usually just use logic to compile and adjust the code samples

StepanS · September 24, 2024, 7:32am

Hello @katy
It is a bit tricky. I would like to tell that when you always need to edit first row, it is okay with this code, but:

fd.control("DataTable1").value[0].Column2 = "{Your value}"

So you can control on which row (first) you edit Column2 with the value, but the value does not show until you click inside the cell.

Sorry, I probably cannot help you. I tried several approaches how to push data inside a row which already exists (the first row) - the data is pushed to the column, but I do not see it until I click inside the cell.

Maybe someone from Plumsail could help with this topic
Stepan

katy · September 24, 2024, 8:17pm

Thank you @StepanS ! I really liked your solution with the bottom!
I'll wait for Plumsail to respond

katy · September 26, 2024, 2:20am

@Margo @Nikita_Kurguzov - could you please provide any input on how to pre-populate the column in the data table (on the Edit form) with the field value (that has already been entered and saved in New form?

Margo · September 26, 2024, 7:57am

Hello @katy,

You can set the row data with this code:

//get data of the first row
var row = fd.control('Control1').widget.dataSource.data()[0]
//set column1 value
row.set("Column1", "new value")

katy · September 26, 2024, 2:03pm

Sorry @Margo - this is not working
I have the following code on Edit form:

fd.rendered(function(){
    var dt_rows = [];
    var row1 = {Column1: "1"};
    dt_rows.push(row1);
    fd.control('FA').value = dt_rows;
});

I need to populate Column2 with a value from the field that is already on the form completed and saved. I tried adding it as
Column2: fd.field('FieldName').value
Column2: (fd.field('FieldName').value)
Column2: fd.field('FieldName').value()
Column2: (fd.field('FieldName').value())
Column2: [FieldName]
into the line:
var row1 = {Column1: "1", Column2: fd.field('FieldName').value};
but it doesn't work.

I added your code above but it stops to add the line altogether

Margo · September 27, 2024, 5:23am

@katy,

You can get the value from another field on the form like this:

//get data of the first row
var row = fd.control('Control1').widget.dataSource.data()[0]
//set column1 value
row.set("Column1", fd.field('FieldName').value)

Where have you placed the code I've shared? Why do you add a new row? I thought you need to update the existing row.