向Asp.net MVC应用程序添加数据报警器
向Asp.net MVC应用程序添加数据报警器
提问于 2014-01-12 18:36:14
我正在构建一个Asp.net MVC应用程序，并希望添加一个数据报警器。
在视图中，我的表单中有这个代码。
@Html.LabelFor(b => b.Date)
@Html.EditorFor(b => b.Date, new {id = "news_date"})这是我用来制作数据报警器的javascript。
$(document).ready(function () {
$("#news_date").datepicker({ dateFormat: 'dd/mm/yy' });
});我希望这样，当用户单击文本框时，会出现一个数据报警器，然后他们可以选择一个日期。目前，当我单击文本框时不会发生任何事情，因此我认为javascript或将其链接到textbox是有问题的。有什么想法吗？
编辑: Web控制台显示此错误：
TypeError: $(...).datepicker is not a function编辑:这是从浏览器控制台编译和获取的代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Enter Transaction - My ASP.NET MVC Application</title>
<link href="/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<meta name="viewport" content="width=device-width" />
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/ui-lightness/jquery-ui.min.css"/>
<link href="/Content/site.css" rel="stylesheet"/>
<script src="/Scripts/modernizr-2.6.2.js"></script>
</head>
<body>
<header>
<div class="content-wrapper">
<div class="float-left">
<p class="site-title"><a href="/">your logo here</a></p>
</div>
<div class="float-right">
<nav>
<ul id="menu">
<li><a href="/">Home</a></li>
<li><a href="/Home/About">About</a></li>
<li><a href="/Home/Contact">Contact</a></li>
</ul>
</nav>
</div>
</div>
</header>
<div id="body">
<section class="content-wrapper main-content clear-fix">
<script type="text/javascript">
$(document).ready(function () {
$("#Date").datepicker({ dateFormat: 'dd/mm/yy' });
});
</script>
<h2>Enter Transaction</h2>
<form action="/Home/EnterTransaction" method="post"> <p>
<label for="Type">Type</label>
<select id="TypeItems" name="TypeItems"><option value="0">Type1</option>
<option value="1">Type2</option>
</select>
<br />
<label for="Date">Date</label>
<select id="UserItems" name="UserItems"><option value="0">User1</option>
<option value="1">User2</option>
</select>
<br />
<label for="Date">Date</label>
<input type="text" id="news_date" name="news_date" />
<input class="text-box single-line" data-val="true" data-val-date="The field Date must be a date." data-val-required="The Date field is required." id="Date" name="Date" type="date" value="12/01/2014" />
</p>
<input type="submit" value="Submit">
<p></p>
</form>
</section>
</div>
<footer>
<div class="content-wrapper">
<div class="float-left">
<p>© 2014 - My ASP.NET MVC Application</p>
</div>
</div>
</footer>
<script src="/Scripts/jquery-2.0.3.js"></script>
</body>
</html>回答 1
Stack Overflow用户
回答已采纳
发布于 2014-01-12 19:07:19
有两件事：
首先，确保您引用了jquery和jqueryui。
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/ui-lightness/jquery-ui.min.css"/>您还需要引用jquery。
其次，不存在以htmlattributes作为参数的EditorFor过载。
你应该去做
@Html.LabelFor(b => b.Date)
@Html.EditorFor(b => b.Date)对于jquery部分
$(document).ready(function () {
$("#@Html.IdFor(m => m.Date)").datepicker({ dateFormat: 'dd/mm/yy' });
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/21078690
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号