달력 페이지 :JQuery와 모바일 및 변경 페이지 기능, 이중 POST 요청
$(document).delegate('#ViewOrders', 'pageinit', function() {
var ordersSource, calendar;
var ordersParams = new Object();
var tonnageParams = new Object();
if (parseInt($("#ddlRooms").val()) > 0) {
tonnageParams.RoomId = $("#ddlRooms").val();
}
$.post('/AdminPages/Mobile/Ajax/Ajax.ashx?p=GetTonnage', tonnageParams, function (data) {
ordersSource = data;
setTimeout(function() {
calendar = $("#calendar").fullCalendar({
header: {
left: 'prev,next today',
center: '',
right: 'title'
},
isRTL: false,
theme: true,
selectable: true,
select: function (start, end, allDay) {
ordersParams.Start = getDateString(start);
ordersParams.End = getDateString(end);
if ($("#ddlRooms").val() > 0) {
ordersParams.RoomId = $("#ddlRooms").val();
}
else {
delete ordersParams.RoomId;
}
$.mobile.changePage("ShowOrders.aspx", { data: ordersParams, transition: 'slide', rel: 'dialog' });
calendar.fullCalendar('destroy');
},
events: ordersSource
});
}, 500);
});
$("#ddlRooms").change(function() {
var elem = $(this);
calendar.fullCalendar('removeEventSource', ordersSource);
tonnageParams = new Object();
if (parseInt(elem.val()) > 0) {
tonnageParams.RoomId = elem.val();
}
$.post('/AdminPages/Mobile/Ajax/Ajax.ashx?p=GetTonnage', tonnageParams, function (data) {
ordersSource = data;
calendar.fullCalendar('addEventSource', ordersSource);
});
});
});
결과 페이지 :
$(document).delegate('#ViewOrders', 'pageinit', function() {
$("#btnBack").click(function() {
var id = $(this).data('backid');
$.mobile.changePage("ViewOrders.aspx", { data: { RoomId: id }, reloadPage: true, transition: 'slide', reverse: true });
});
});
(스크립트는의 생명의 시작 부분에 하나 개의 파일에 위치하여 업로드 응용 프로그램 및 페이지를로드하지 않습니다.)
내가 뭘하려는 것은 달력이있는 페이지가 있습니다. 날짜를 선택할 때 사용자는 선택한 날짜 매개 변수로 다른 날짜로 이동합니다. 두 번째 페이지에서 그는 해당 날짜에 주문을 봅니다. 캘린더에 다시 버튼이 있습니다. 내 문제는 선택 "ddlRooms"의 캘린더 변경 이벤트로 돌아 가면 '게시'가 두 번 발생한다는 것입니다. 나는 이것을 시도했다 :
$("#ddlRooms").unbind('change').change(function() {
...
});
그러나 UI 다음 선택 제대로 작동하지 않습니다.