Adding Seven Days to the End Date After Editing the Start Date by JS

Application Scenario

You have two date widgets, one for the start date and the other for the end date. To query data in a week, you may want to set the end date to seven days after the start date automatically after selecting a start date. The following figure shows the actual effect.

Implementation Method

You can add an After Editing event to the start date and use JavaScript to set the end date to seven days after the start date.

Event Adding

Enter the editing page of the parameter panel, select the starttime widget, and add an After Editing event, as shown in the following figure.

The JavaScript code is as follows.

var date1=new Date(this.getValue());
var date2= new Date();
date2.setTime(date1.getTime()+(7*24*60*60*1000));
this.options.form.getWidgetByName("endtime").setValue(date2);

Effect Display

Save the template, and click Pagination Preview. The following figure shows the effect.

Note:

The effect cannot be previewed on mobile terminals.

For details, you can download the template Adding Seven Days to the End Date After Editing the Start Date by JS.cpt.