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

Datepicker only displays as textbox when using VS Debugger

Just starting out coding, so apologies if this is a simple mistake somewhere.  But, trying to just follow the Getting Started guide and make a simple page with just a datepicker.   The code is shown below:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <title>My first HTML page</title>
    <link rel='nofollow' href="Content/ej/web/default-theme/ej.web.all.min.css" rel="stylesheet" />
    <script src="Scripts/jquery-2.1.4.min.js"></script>
    <script src="Scripts/jquery.easing.1.3.min.js"></script>
    <script src="Scripts/jsrender.min.js"></script>
    <script src="Scripts/ej/ej.web.all.min.js"></script>
    <!--Container for ejDatePicker widget-->
    <input id="startDate" type="text" />

    <script type="text/javascript">
            $(function () {
                // initialization of ejDatePicker control

When I run the Debugger a new tab is opened but the date picker does not display correctly (See attached Bad Date Picker).  It only shows the text input box.  If I click inside the box, it pops up a single date which can be chosen, but you never see the calendar control. 

If I put the same Content and Scripts folders in a normal directory on my computer and copy and paste the HTML above from VS and paste in to an HTML file.  Then open the file with Chrome, it works fine (see Good Date Picker attached).

Am I missing something in VS to get the control to work properly in Debugger?



Attachment: DatePicker_4797d35c.zip

1 Reply

TM Thirukumaran Murugan Syncfusion Team July 4, 2016 11:20 AM UTC

Hi Mark,   
Thanks for contacting Syncfusion Support.   
We have analyzed your query,”Datepicker only displays as textbox when using VS Debugger.”   
When you try to run the same html file in Visual Studio as well as from the normal directory, you may get path reference error in both scripts and styleThis is so because the file path for the normal directory based html file will traverse from the folder directory, but for the Visual Studio, it will start from the root directory.  
Please refer to the below mentioned code blocks for the normal directory based html file and for the Visual Studio file.                                                                                                                                                                                    
1.    Visual Studio html file path reference:  
    <script src="../scripts/ej.web.all.min.js" type="text/javascript"></script>   
2.    Normal directory html file path reference:  
<script src="../DatePicker/scripts/ej.web.all.min.js"type="text/javascript"></script>  
The path reference error is the issue at your end while running the normal directory based html file in Visual Studio. By checking with the developer option like inspect (F12) in chrome, we can conclude whether the referred scripts and style source file are loaded properly to the html file or not.   
Thirukumaran M.  

Live Chat Icon For mobile
Up arrow icon