We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

Add / Modify Dialog

Dear All

Is there a way to set the start, end, baselinestart and end dates in the Add and Edit Dialog by a value of my own?


1 Reply

SR Suriyaprasanth Ravikumar Syncfusion Team August 31, 2017 12:46 PM UTC

Hi Martin, 
            We can achieve this requirement by using “ActionBegin” client side event. This event will be triggered when we open a add/edit dialog with argument “requestType” as“openEditDialog/OpenAddDialog”. 
By using this event we can customize each item available in dialog. We have prepared a sample and updated the startDate,endDate,baselineStartDate and baselineEndDate in this event. 
While adding new record, we have performed some internal calculation hence its necessary to update the date values in “args.data" also. 
Please refer the following code snippet. 
<ej:Gantt ID="GanttControl" runat="server" EndDateMapping="EndDate" 
                " StartDateMapping="StartDate" DurationMapping="Duration" 
BaselineStartDateMapping="BaselineStartDate" BaselineEndDateMapping="BaselineEndDate" 
                ActionBegin="actionBegin" ...> 
<script type="text/javascript"> 
         //Event trigger at the add/edit dialog. 
            function actionBegin(args) { 
                if (args.requestType == "OpenAddDialog") { 
                    $("#GanttControlstartDateAdd").ejDatePicker('model.value', '10/27/2013'); // $("# + control ID + Field + Add") 
                    $("#GanttControlendDateAdd").ejDatePicker('model.value', '11/01/2013'); 
                    args.data.startDate = '10/27/2013'; 
                    args.data.endDate = '11/1/2013'; 
                    args.data.duration = parseFloat($("#GanttControldurationAdd").val()); 
                    $("#GanttControlbaselineStartDateAdd").ejDatePicker('model.value', '10/27/2013'); 
                    $("#GanttControlbaselineEndDateAdd").ejDatePicker('model.value', '10/30/2013'); 
                if (args.requestType == "openEditDialog") { 
                    $("#GanttControlstartDateEdit").ejDatePicker('model.value', '10/27/2013'); // $("# + control ID + Field + Edit") 
                    $("#GanttControlendDateEdit").ejDatePicker('model.value', '11/01/2013'); 
                    $("#GanttControlbaselineStartDateEdit").ejDatePicker('model.value', '10/27/2013'); 
                    $("#GanttControlbaselineEndDateEdit").ejDatePicker('model.value', '10/30/2013'); 
We have prepared a sample as per your requirement, please find the sample location below. 
Please let us know if require further assistance on this. 
Suriyaprasanth R. 

Live Chat Icon For mobile
Up arrow icon