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.
Unfortunately, activation email could not send to your email. Please try again.

DatePicker methods/properties can be accessed only after plugin creation

Thread ID:

Created:

Updated:

Platform:

Replies:

132976 Oct 2,2017 06:18 AM Oct 9,2017 07:12 AM ASP.NET MVC 3
loading
Tags: DatePicker
Phil
Asked On October 2, 2017 06:18 AM

Hello

On my website are 2 DatePicker controls ("from" and "to"). I use the unobtrusive option and a model where the values of the 2 DatePickers are stored and sent to the server with ajax.

What I want to achieve is the following:
When the "from" date is changed, check if it is bigger than the to date, if so set "to" to "from".
When the "to" date is changed, check if it is smaller than the from date, if so set "from" to "to".

Therefore I have a function for the "onChange" event of both DatePickers, where I check these conditions. 
However, if I want to access the DatePickers like this "var fromDP = $("#FromDatePicker").data("ejDatePicker");" the variable is "undefined".
If I try to access it like this "var fromDP = $("#statsFromDatePicker").ejDatePicker('instance');" I always get the following error:
"Uncaught ejDatePicker: methods/properties can be accessed only after plugin creation. Error: ejDatePicker: methods/properties can be accessed only after plugin creation"

It seems a bit odd that I get this error, since the control is clearly created (I can choose dates and the onChange event is fired).
Since I use the "FOR" controls I need to change some things, as stated in the article How to define properties for FOR controls, however this did not change anything for me. I still get the same errors as before.

In my .cshtml the DatePickers are like this:

...
@(Html.EJ().DatePickerFor(f => f.From, (Syncfusion.JavaScript.Models.DatePickerProperties)ViewData["fromProperties"]))
...


The controller code:

...
var fromProperties = new DatePickerProperties
{
Locale = "en-GB",
DateFormat = "dd.MM.yyyy",
HtmlAttributes = new Dictionary<string, object> { {"id", "FromDatePicker" } },
Change = "datePickerFromOnChange",
Create = "datePickerOnCreate"
};
ViewData["fromProps"] = fromProps;
...


Could you help me solve this issue?


Kind regards

Phil


Shameer Ali Baig Sulaiman Ali Baig [Syncfusion]
Replied On October 3, 2017 08:20 AM

Hi Phil, 
 
Thanks for contacting Syncfusion Support. 
 
The reported error may occur when incorrect control id were used while creating instance of the control. In DatePickerFor, model’s property name will be set as the id of DatePicker. We have modified the code sample provided by you to resolve this error. 
 
[my.cshtml] 
 
    @Html.EJ().DatePickerFor(model => model.From, (Syncfusion.JavaScript.Models.DatePickerProperties)ViewData["date"]).Width("100%") 
             
            @Html.EJ().DatePickerFor(model => model.To, (Syncfusion.JavaScript.Models.DatePickerProperties)ViewData["date"]).Width("100%") 
 
<script> 
    function OnSelect(args) { 
        alert("yes") 
        var p = $("#From").ejDatePicker("instance"); 
        var m = $("#To").ejDatePicker("instance"); 
        if (p.model.value < m.model.value) { 
            val = p.element.val(); 
            p.option("value", m.element.val()); 
            m.option("value", val); 
        } 
    } 
</script> 
 
 
  
For your convenience, we have also attached a sample based on your requirement. 
 
Sample: 
 
Please check out the below link to know further about Strongly-Typed HTML Helper support in EJ controls. 
 
 
Regards, 
 
Shameer Ali Baig S. 


Phil
Replied On October 6, 2017 06:08 AM

Hello


It is exactly as you said, I used the wrong Id to access the DatePicker.

I just needed to use "From" instead of "FromDatePicker" ($("#From").ejDatePicker("instance")) and everything works as expected.

Thank you a lot for your help.


Kind regards

Phil


Shameer Ali Baig Sulaiman Ali Baig [Syncfusion]
Replied On October 9, 2017 07:12 AM

Hi Phil, 
 
Thanks for the update. We are happy to hear that the issue is resolved at your end. Please get back to us if you need any further assistance on this.  
 
Regards, 
 
Shameer Ali Baig S. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;