Using daterangepicker within form

[Stephan Schrade]

Hi support,

I have included the daterangepicker in my form with the following code:

HTML:

<input id="challengeevent-daterange" type="text" name="Challengeevent[daterange]">

JS:

var datepicker1 = new ej.calendars.DateRangePicker({

// format: 'yyyy-mm-dd',

firstDayOfWeek: 1,

placeholder: '<?=Yii::t('app', 'Date Range')?>',

startDate: new Date('<?=$model->datestart?>'),

endDate: new Date('<?=$model->dateend?>'),

floatLabelType: 'Auto'

});

datepicker1.appendTo('#challengeevent-daterange');

I can easily preset the values from my database, but when I want to save new values form the form, I only get the new value of the endDate.

What can I do to get the new values of startDate and endDate?

This is the retuned array from the form:

Challengeevent

[ 'caption' => 'xxxxx' 'challengegroupid' => '6' 'visibilityuser' => 'all' 'daterange' => '1.12.2030' 'opened' => '1' ]

Regards,

Stephan

[Sevvandhi Nagulan]

Hi Stephan,  

Greetings from Syncfusion support.  

  

We have checked the reported issue. In daterangepicker we have maintained hidden inputs for start date and end date to send the value to server. So we suggest to take the value using input element as mentioned code snippet,  

  

  console.log(formObject['date'][0].value)  

  

   

Please find the sample below,  

Sample Link: https://stackblitz.com/edit/gswcpp-ms5wmk?file=index.html  

  

Regards,  

Sevvandhi N  

[Stephan Schrade]

Hi support,

many thanks for your reply. 

Bit this ist not very comfortable. 

I dont get the two values to the backend. 

Do I have to use javascript on the client side to fill two form fields?

This is not what the developer does expect from a form widget like datarangepicker. 

Regards,

Stephan

[Sevvandhi Nagulan]

Hi Stephan,     

  

We can able to reproduce the reported scenario in our end. We have rendered the DateRangePicker in the php and get the value using name attribute in the submit action. In DateRangePicker we have maintained hidden inputs for startDate and endDate. So when you take the value by using the name attribute startDate only will return if name attribute is not a array. To get rid reported issue we suggest to define the name attribute(daterange) as array and get the both startDate and endDate as mentioned below code snippet, 

 

<input name="daterange[]" id="date" /> 

<?php 

if(isset($_GET['submit'])) { 

    $username = $_GET['daterange']; 

    foreach( $username as $key => $n ) { 

        print $n."\n"; 

      } 

} 

?> 

 

Please find the sample below, 

 

Sample Link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/helloworld1911999425 

 

Regards,     

Sevvandhi N