こんにちは皆さん、jquery を使用して datepicker で mvc アプリケーションを作成しました。たとえば、特定の日付をクリックすると、対応するイベントがリストとして表示されます。次のコード スニペットは正常に動作しますが、Opera モバイル エミュレーターを使用して同じページを実行するとクリックイベントが発生していませんでした。
jquery:
jquery-ui-1.8.20.custom.css
Note:I used the following link as reference
http://www.hongkiat.com/blog/jquery-ui-datepicker/
If anyone give the solution,it ll great helpful to me.
@model IEnumerable<WazUpDataServicesMVC4.Model.EventViewModel>
@{
ViewBag.Title = "Calendar";
}
@section Header
{
<a href="@Url.Action("Index", "Events")" data-icon="back" class="ui-btn- left">Events</a>
<h1>@ViewBag.Title</h1>
<link href="@(Url.Content("~/Content/datepicker.css"))" rel="stylesheet" type="text/css" />
$(function () {
$('#datepicker').datepicker({
inline: true,
//nextText: '→',
//prevText: '←',
showOtherMonths: true,
//dateFormat: 'dd MM yy',
dayNamesMin: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
onSelect: function (date, obj) {
if (date) {
$("#listLayers").find("a:[data-date!='" + date + "']").parent().parent().parent().slideUp();
$("#listLayers").find("a:[data-date='" + date + "']").parent().parent().parent().slideDown();
} else {
$("#listLayers").find("a").parent().parent().parent().slideDown();
}
}
});
});
</script>
}
<div id="datepicker"></div>
<ul data-role="listview" data-inset="true" id="listLayers">
@foreach (var item in Model)
{
string display = "none";
if (DateTime.Now.ToString("MM/dd/yyyy") == item.DateEventTo.ToString("MM/dd/yyyy"))
{
display = "block";
}
<li style="display:@(display);">
<a data-date="@(item.DateEventTo.ToString("MM/dd/yyyy"))" class="calendar-link" href="@Url.Action("Events", "Events", new { id = item.EventID,description=item.Description })">
@item.Description
</a>
</li>
}
</ul>