日期选择器未显示在浏览器中

时间:2012-10-23 15:20:33

标签: c# c#-4.0 razor telerik asp.net-mvc-4

我的代码:

@using Telerik.Web.Mvc.UI;
@using Telerik.Web.UI;

@{
    ViewBag.Title = "Home Page";
}
<script type="text/javascript" src="~/Scripts/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="~/Scripts/jquery-ui-1.8.11.js"></script>
<script type="text/javascript" src="~/Scripts/jquery-ui-1.8.20.min.js"></script>
<script type="text/javascript" src="~/Scripts/jquery-ui-1.9.0.custom.min.css"></script>
<script type="text/javascript" src="~/Scripts/jquery-ui-1.9.0.custom.css"></script>

<script type="text/javascript">
    console.log($)
</script>
@(Html.Telerik().DatePicker()
    .Name("DatePickerDOB")
    .HtmlAttributes(new { style = "width: 140px; " })
)

@section featured {
    <section class="featured">
        <div class="content-wrapper">
            <hgroup class="title">
                <h1>@ViewBag.Title.</h1>
                <h2>@ViewBag.Message</h2>
            </hgroup>
            <p>
                To learn more about ASP.NET MVC visit <a href="http://asp.net/mvc" title="ASP.NET MVC Website">
                    http://asp.net/mvc</a>. The page features <mark>videos, tutorials,
                        and samples</mark> to help you get the most from ASP.NET MVC. If you have
                any questions about ASP.NET MVC visit <a href="http://forums.asp.net/1146.aspx/1?MVC"
                    title="ASP.NET MVC Forum">our forums</a>.
            </p>
        </div>
    </section>
}
<h3>We suggest the following:</h3>
<ol class="round">
    <li class="one">
        <h5>Getting Started</h5>
        ASP.NET MVC gives you a powerful, patterns-based way to build dynamic websites that
        enables a clean separation of concerns and that gives you full control over markup
        for enjoyable, agile development. ASP.NET MVC includes many features that enable
        fast, TDD-friendly development for creating sophisticated applications that use
        the latest web standards. <a href="http://go.microsoft.com/fwlink/?LinkId=245151">Learn
            more</a></li>
    <li class="two">
        <h5>Add NuGet packages and jump start your coding</h5>
        NuGet makes it easy to install and update free libraries and tools. <a href="http://go.microsoft.com/fwlink/?LinkId=245153">
            Learn more</a></li>
    <li class="three">
        <h5>Find Web Hosting</h5>
        You can easily find a web hosting company that offers the right mix of features
        and price for your applications. <a href="http://go.microsoft.com/fwlink/?LinkId=245157">Learn
            more</a></li>
</ol>

当我点击日期选择器文本字段时,我不知道在显示DatePicker时我还需要做些什么。请帮助。感谢。

1 个答案:

答案 0 :(得分:1)

没有错
@(Html.Telerik().DatePicker()
    .Name("DatePickerDOB")
    .HtmlAttributes(new { style = "width: 140px; " })
)

它在我的项目中工作正常(虽然点击图标时日历会打开,而不是文本框,但我认为这实际上不是你的问题。)

检查确定

@(Html.Telerik().ScriptRegistrar()
正在呼叫

。 Noramlly这是在_Layout中,但可以使用Telerik控件直接放在文件中。

在旁注(我不认为这会导致你的问题,但肯定没有帮助),这些行是错误的:

<script type="text/javascript" src="~/Scripts/jquery-ui-1.9.0.custom.min.css"></script>
<script type="text/javascript" src="~/Scripts/jquery-ui-1.9.0.custom.css"></script>

.css文件不是脚本。它们应该像这样引用:

<link href="~/Scripts/jquery-ui-1.9.0.custom.min.css" rel="stylesheet" type="text/css"/>

你似乎并没有在这个页面上使用任何jQuery,所以你可能不需要导入所有这些脚本和css文件。 Telerik使用自己的jQuery脚本,这就是Registrar脚本的用途。