I am using MVC 4 (C# with razor) and I have added a jquery datepicker to my page which works fine.
I now want to add a tooltip which I have done in the code below.
<div class="editor-label">
@Html.LabelFor(model => model.Rating)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Rating, new { title = "Rating" })
@Html.ValidationMessageFor(model => model.Rating)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.ReleaseDate)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.ReleaseDate, new { id = "ReleaseDate" })
@Html.ValidationMessageFor(model => model.ReleaseDate)
</div>
With the script as
<script type="text/javascript">
$(function () {
$('#ReleaseDate').datepicker({ dateFormat: "dd-mm-yy" });
$( document ).tooltip();
});
The date picker works fine but nothing happens with the tooltip, any ideas?
Here is the full page code for the view
@model testpage.Models.Game
@{
ViewBag.Title = "Create";
}
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css" />
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<h2>Create</h2>
@using (Html.BeginForm()) {
@Html.AntiForgeryToken()
@Html.ValidationSummary(true)
<fieldset>
<legend>Game</legend>
<div class="editor-label">
@Html.LabelFor(model => model.Title)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Title)
@Html.ValidationMessageFor(model => model.Title)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Rating)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Rating, new { @title = "Rating" })
@Html.ValidationMessageFor(model => model.Rating)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.ReleaseDate, "Release Date")
</div>
<div class="editor-field">
@Html.EditorFor(model => model.ReleaseDate, new { id = "ReleaseDate" })
@Html.ValidationMessageFor(model => model.ReleaseDate)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Price)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Price)
@Html.ValidationMessageFor(model => model.Price)
</div>
<p>
<input type="submit" value="Create" />
</p>
</fieldset>
}
<div>
@Html.ActionLink("Back to List", "Index")
</div>
<script type="text/javascript">
$(function () {
$('#ReleaseDate').datepicker({ dateFormat: "dd-mm-yy" });
$( document ).tooltip();
});
</script>
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
}