I have a few jQuery Datepicker controls that are being displayed inside of a .net 4.0 web application. The calendar controls appear on the screen whenever textbox controls are
clicked. Everything works fine for all browsers while debugging. Everything continues to work fine in IE 11 and Chrome when the changes are deployed to IIS. However, the calendar
control does not appear when the textbox controls are clicked in Edge when deployed to IIS. Does anyone know what would prevent the calendar control from being displayed in Edge when
deployed to IIS? I assume the links are fine since everything works fine in IE and Chrome.
The links are below are included on the master page.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="X-UA-Compatible" content="IE=EDGE" />
<title></title>
<meta name="robots" content="noindex, nofollow" />
<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=0" />
<!-- Icons -->
<!-- The following icons can be replaced with your own, they are used by desktop and mobile browsers -->
<link rel="shortcut icon" href="img/favicon.png" />
<link rel="apple-touch-icon" href="img/icon57.png" sizes="57x57" />
<link rel="apple-touch-icon" href="img/icon72.png" sizes="72x72" />
<link rel="apple-touch-icon" href="img/icon76.png" sizes="76x76" />
<link rel="apple-touch-icon" href="img/icon114.png" sizes="114x114" />
<link rel="apple-touch-icon" href="img/icon120.png" sizes="120x120" />
<link rel="apple-touch-icon" href="img/icon144.png" sizes="144x144" />
<link rel="apple-touch-icon" href="img/icon152.png" sizes="152x152" />
<link rel="apple-touch-icon" href="img/icon180.png" sizes="180x180" />
<!-- END Icons -->
<link rel="stylesheet" href="js/css/jquery-ui-1.10.1.css" type="text/css" />
<!-- Stylesheets -->
<!-- Bootstrap is included in its original form, unaltered -->
<link rel="stylesheet" href="css/bootstrap.min.css" type="text/css" />
<!-- Related styles of various icon packs and plugins -->
<link rel="stylesheet" href="css/plugins.css" type="text/css" />
<!-- The main stylesheet of this template. All Bootstrap overwrites are defined in here -->
<link rel="stylesheet" href="css/main.css" type="text/css" />
<!-- Include a specific file here from css/themes/ folder to alter the default theme of the template -->
<!-- The themes stylesheet of this template (for using specific theme color in individual elements - must included last) -->
<link rel="stylesheet" href="css/themes.css" type="text/css" />
<!-- END Stylesheets -->
<!-- Calendar Style -->
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css" />
Webform
<div class="col-md-1">
<asp:TextBox ID="txtEntryDate" ClientIDMode="Static" runat="server" CssClass="form-control input-datepicker-close date "
data-date-format="mm/dd/yyyy"></asp:TextBox>
</div>
app.js
$('.input-datepicker-close').datepicker({ weekStart: 0, todayHighlight: true, clearBtn: true }).on('changeDate', function (e) { $(this).datepicker('hide'); });
