Author Topic: Add datepicker in the column header  (Read 463 times)

vijay@spinetechnologies

  • Pro Enterprise
  • Jr. Member
  • *
  • Posts: 87
    • View Profile
Add datepicker in the column header
« on: June 16, 2022, 06:29:40 pm »

Hi Paramveer,

We are facing some difficulties to achieve the user requirement.

As per the requirement, we have to provide a date selection in the column header.  So whenever the user changes the date from the column header date picker, all the rows will update with the same date.

We have not found any live examples for the same. Please guide us to implement the same

Thank you

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6310
    • View Profile
Re: Add datepicker in the column header
« Reply #1 on: June 17, 2022, 01:18:59 pm »
date selection control in header cell is not supported, but it can be added in 1st row with help of column.render callback.

Code: [Select]
postRenderInterval: -1,
colModel:[{
dataIndx: 'rank',
render: function(ui){
if(ui.rowIndx==0)
return "<input type='date' />";
},
postRender: function(ui){
var grid = this;
$(ui.cell).find('input').on('change', function(){
alert("do stuff");
});
}
},

vijay@spinetechnologies

  • Pro Enterprise
  • Jr. Member
  • *
  • Posts: 87
    • View Profile
Re: Add datepicker in the column header
« Reply #2 on: June 17, 2022, 03:44:33 pm »
Thank for your reply