Unable to select the next month on the DatePicker, may this be a BUG?

[Carlo]

This is the code we're using:

@(Html.EJ().DatePicker("DatePicker").Locale("it-IT"))

The problem arises when I try to change the month after clicking on the calendar icon: if I click the left arrow, selecting a previous month, everything works smoothly. Instead, if I try to click on the right arrow, nothing happens (apart from a broken animation being displayed, where Month and Year text between the arrows rapidly moves left and right).

Is there maybe something wrong in the syntax we're using?

[Carlo]

Today, to narrow down the reasons which may be causing this problem, I tried to do the following:

-create a new application with the template "Syncfusion ASP.NET MVC Application" which you kindly provided

-I selected MVC4 and after that I selected TimePicker, DatePicker, DateTimePicker

-I put @(Html.EJ().DatePicker("DatePicker")) inside the default Index.cshtml, created by default

-> The problem is still there :(

I included the .zip of the solution, so that it may be easier for you to provide an answer

Attachment: testDatePicker_99813eda.zip

[Kasithangam C]

Hi Carlo,

We have analyzed your query with the provided sample. We suspect that, this issue “when try to click on the right arrow, nothing happens in datepicker control” might have occurred because the css which is overwritten from the “Site.css” file
To resolve this issue, please comment out the below code site.css which is referred in Bundle.config file in App_Start folder,
<code>

bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css"));
</code>

We have modified your sample based on this and please find the sample under the following location,

Sample: Sample

If still you face any problem, please revert us by modifying the sample based on your application along with replication procedure. This would be helpful for us to serve you.

Please let us know if you have further queries.

Regards,
Kasithangam

[Carlo]

Thanks. The problem was caused by the following text (contained in site.css, as you pointed out):

a:active, a:hover {

    color: #333;

    outline: none;

    padding-left: 3px;

    padding-right: 3px;

    text-decoration: underline;

}

by removing the padding the problem is now solved, but I have a question: apart from this issue, is site.css (and the other css which get icluded in the project wizard you supplied) safe to use or there may be many other issues like this down the road? Maybe it's better to write our custom .css from scratch? Nevertheless, thanks a lot for your kind help.

[Saranya Sivakumar]

Hi Carlo,

Thanks for your update.

In order to ensure site.css affects our control please share us the list of the Syncfusion components which you are using in your application. We will check and ensure the details. We can overwrite the css of the component using an API called “CssClass”. We have to specify a class name for “CssClass” property as shown in the following code snippet.

<code>

@(Html.EJ().DatePicker("DatePicker").CssClass("vista"))

</code>

After setting CssClass, we have to apply styles to the class in the style section as shown below.

<code>

.vista a:hover, .vista a:active {

        padding-left: 0px;

        padding-right: 0px;

    }

</code>

We can customize the style according to our need. We have prepared the sample based on your requirement and the same can be downloaded from the following location.

http://www.syncfusion.com/downloads/support/forum/119713/testDatePicker-182443818.zip

Please let us know if you have further queries.

Regards,

Saranya.S

[Carlo]

Hi there. Thanks a lot for putting all this effort in helping me out. Currently I'm using the following components:

• Grid
  
• DatePicker
  
• DateTimePicker
  
• TimePicker
  
• CheckBox ( with which I'm having problems setting / getting values, as I explain here: https://www.syncfusion.com/forums/119749/set-and-get-checkbox-value-programmatically-with-jquery)
  
• DropDownList
  
• RadioButton
  
• Button
  

I may add that in the future, when the application which I'm developing will be more mature, I intend to add a couple of Gantt's and some sort of navigation menu but, for the time being, I only need the aforemented ones to be working.

[Saranya Sivakumar]

Hi Carlo,

Thanks for your update.

We have checked the reported controls (Checkbox,Datepicker,DateTimepicker,Timepicker,Dropdownlist,Radiobutton, Button) against site.css file and it is working fine except the DatePicker and DateTimePicker control as you have reported in the query. As we have said in the previous update we can overcome this by overwriting the style section of DatePicker and DateTimePicker control using the API called “CssClass”.

We have also analyzed the Grid control with referring site.css and found that there is no issue will occur in Grid control while using Site.css file in your application.
For your reference we have created a sample with enabled major features like editing, scrolling, filtering and etc… and the same can be downloaded from the following link.
Sample Link: SampleDemo

Please let us know if you have any other queries.

Regards,

Saranya.S