Author Topic: Adding column Dynamically  (Read 5378 times)

bsolteam

  • Pro Deluxe
  • Full Member
  • *
  • Posts: 107
    • View Profile
Adding column Dynamically
« on: June 19, 2014, 08:27:51 pm »
Hi,

Is there any demo or Api for adding column dynamically. Because i didn't find any thing for adding column dynamically. I need to add a column dynamically like, same way we are using in dynamic row adding.

Thanks in advance.

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6264
    • View Profile
Re: Adding column Dynamically
« Reply #1 on: June 19, 2014, 11:26:00 pm »
colModel is an array of columns.

Add the column to colModel the way you do array manipulation in javascript.

call refresh after it.

stoodin

  • Pro Enterprise
  • Jr. Member
  • *
  • Posts: 85
    • View Profile
Re: Adding column Dynamically
« Reply #2 on: July 23, 2014, 07:31:14 pm »
I am trying to add colums dynamically (I have some nested ones) and it doesn't seems to be working.
What I am doing wrong?
function addWklyOtWO() {
    var woItm = {title:"<b>2</b>", minWidth:50, dataIndx: "num2", resizable: false, align:"center",
          colModel:[
                   {title:"<b>WO#</b>", minWidth:100, dataIndx: "woNo2", resizable: false, align:"center", cls:'Start-DayBorder',hidden:true}, 
                   {title:"<b>Units</b>", minWidth:40, dataIndx: "unts2", resizable: false, align:"center",hidden:true},
                   {title:"<b>Task#</b>", minWidth:40, dataIndx: "tsk2", resizable: false, align:"center",hidden:true},
                   {title:"<b>Ord Hrs</b>", minWidth:40, dataIndx: "ord_hrs2", resizable: false, align:"center",hidden:true},
                   {title:"<b>Veh</b>", minWidth:40, dataIndx: "veh2", resizable: false, align:"center",hidden:true},
                   {title:"<b>Veh Hrs</b>", minWidth:40, dataIndx: "veh_hrs2", resizable: false, align:"center",hidden:true},
                   {title:"",dataIndx:"vcRecId2",hidden:true},
                   {title:"",dataIndx:"lcRecId2",hidden:true}
                 ]};

   var otColMdl = $("#grid_wkly_ot").pqGrid("option", "colModel"),
      woColMdl = otColMdl[0].colModel;
   
   woColMdl.push(woItm);
   
   $("#grid_wkly_ot").pqGrid("option", "colModel", otColMdl);   
   $("#grid_wkly_ot").pqGrid("refresh");
}

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6264
    • View Profile
Re: Adding column Dynamically
« Reply #3 on: July 23, 2014, 08:54:59 pm »
Put a breakpoint in the function and check the value of otColMdl before updating colModel.

stoodin

  • Pro Enterprise
  • Jr. Member
  • *
  • Posts: 85
    • View Profile
Re: Adding column Dynamically
« Reply #4 on: July 23, 2014, 09:00:17 pm »
I do see everything fine in both woColMdl and otColMdl.
Maybe the problem with the nested columns?


stoodin

  • Pro Enterprise
  • Jr. Member
  • *
  • Posts: 85
    • View Profile
Re: Adding column Dynamically
« Reply #5 on: July 23, 2014, 09:08:55 pm »
Got it work. It is related to the nested columns

I added one line after the push:
   woColMdl.push(woItm);
   otColMdl[0].colModel = woColMdl;

and everything is working.
Thanks a lot.