Problem dynamically rebuilding columns/dates

Scheduler
1

I’m having problems rebuilding my column list. I’ve set up a scheduler really as a weekly timetable, not interested in the day, month views etc. Perhaps there’s a more elegant way rather than adding lots of weeks then ignoring all the days I don’t need?
Anyway, It’s all fine but when I delete one of my dates, I’m calling all the scheduler setup again, including code below and init. But then two columns have gone, not just one. Any ideas? Thanks

// num_weeks - might be 12 for example
// dates_obj[] is my array of required dates

scheduler.attachEvent("onTemplatesReady",function(){
	
		scheduler.date.workweek_start = scheduler.date.week_start;
		scheduler.date.get_workweek_end=function(date){ 
			return scheduler.date.add(date,7*num_weeks,"day"); 
		};
		for(var i = 0; i < num_weeks; i++){
			scheduler.date.add_workweek=function(date,inc){ 
				return scheduler.date.add(date,inc*7,"day");
			};
		}
		scheduler.templates.workweek_date = scheduler.templates.week_date;
		scheduler.templates.workweek_scale_date = scheduler.date.date_to_str("%j %M");
	});

	//hide days not required
	scheduler.ignore_workweek = function(date){

		var sched_date = date.getTime();

		for(var i = 0; i < num_weeks; i++){ // go through my list of required dates
	
			var my_date =  dates_obj[i].date_id ;

			if (sched_date ==  my_date )
				return false;
		}
		return true;
	};
2

Hello,
I didn’t get any replies to this, so I’m asking again with a link highlighting the problem:
http://www.rotating-timetable.com/2021/delete_problem.shtml

If you click Delete Week the number of visible weeks goes from 7 to 5.
Here is the HTML:

<body id = "home"  onLoad = "MakeGrid()">
<div id="scheduler_here" class="dhx_cal_container" style='width:100%; height:400px;'>
  <div class="dhx_cal_navline">
    <div class="dhx_cal_prev_button">&nbsp;</div>
    <div class="dhx_cal_next_button">&nbsp;</div>
    <div class="dhx_cal_today_button"></div>
    <div class="dhx_cal_date"></div>
    <div class="dhx_cal_tab" name="workweek_tab" style="right:204px;"></div>
    <div class="dhx_cal_tab" name="day_tab" style="right:204px;"></div>
    <div class="dhx_cal_tab" name="week_tab" style="right:140px;"></div>
    <div class="dhx_cal_tab" name="month_tab" style="right:76px;"></div>
  </div>
  <div class="dhx_cal_header"> </div>
  <div class="dhx_cal_data"> </div>
</div>
<input  type="button" id = "update" value="       Delete week       " onclick = "deleteWeek()" />
</body>

and the JS:

var datesIDs =  [ 1621292400000, 1621897200000,1622502000000, 1623106800000, 
1623711600000,1624316400000, 1624921200000];

function MakeGrid(){
	
	var num_dates = datesIDs.length;

	scheduler.locale.labels.workweek_tab = "Chosen Days";
	scheduler.config.hour_size_px = 60;
	scheduler.config.first_hour = 10;
	scheduler.config.last_hour = 16;
	
	scheduler.attachEvent("onTemplatesReady",function(){

		scheduler.date.workweek_start = scheduler.date.week_start;
		scheduler.date.get_workweek_end=function(date){ 
			return scheduler.date.add(date,7*num_dates,"day"); 
		};
		for(var i = 0; i < num_dates; i++){
			scheduler.date.add_workweek=function(date,inc){ 
				return scheduler.date.add(date,inc*7,"day");
			};
		}
		scheduler.templates.workweek_date = scheduler.templates.week_date;
		scheduler.templates.workweek_scale_date = scheduler.date.date_to_str("%j %M");
	});
	scheduler.ignore_workweek = function(date){

		var sched_date = date.getTime();

		for(var i = 0; i < num_dates; i++){
			var e =  datesIDs[i];
			if (sched_date ==  e )
				return false;
		}
		return true;
	};

	scheduler.init('scheduler_here',new Date(datesIDs[0]),"workweek");
}

    function deleteWeek(){
	
	datesIDs.splice(2, 1);
	MakeGrid();

}

3

Hello @Greg_Chapman ,

Sorry for the delay.

Regarding this part:

Perhaps there’s a more elegant way rather than adding lots of weeks then ignoring all the days I don’t need?

It’s a normal solution, and I can’t suppose how you can upgrade this logic.

Regarding the second post, I checked the provided link:
http://www.rotating-timetable.com/2021/delete_problem.shtml

And it displays nothing:

Probably this issue occurs because you are filtering all dates excluding the ones inside the array with this code:

	scheduler.ignore_workweek = function(date){

		var sched_date = date.getTime();

		for(var i = 0; i < num_dates; i++){
			var e =  datesIDs[i];
			if (sched_date ==  e )
				return false;
		}
		return true;
	};

As returning true means that date will be blocked, if you will change it to follows:

	scheduler.ignore_workweek = function(date){

		var sched_date = date.getTime();

		for(var i = 0; i < num_dates; i++){
			var e =  datesIDs[i];
			if (sched_date ==  e )
				return true;
		}
		return false;
	};

The problem should be fixed.

Here is the updated snippet :

If I misunderstood, could you please reproduce the issue in the snippet above(open the snippet above => reproduce the issue on “HTML/CODE” tabs => click the share button)?

Kind regards,

4

Thanks so much for this. It’s odd the original page didn’t show but I’ve edited the snippet to do what I want now:
http://snippet.dhtmlx.com/5/0c1d28a3c

I wanted to delete a particular week. The true and false lines were the right way round - but by calling Render rather than Init it seems to work fine.
Cheers
Greg