2012-12-11 4 views
0

달력 페이지 :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 다음 선택 제대로 작동하지 않습니다.

답변

1

이벤트 바인드/언 바인드 및 켜기/끄기 대신 사용할 수 있습니다. 다시 바인드하기 전에 jQuery 이벤트 필터를 사용하여 바인드 해제하는 대신, 이벤트가 이미 바인드되었는지 식별하는 데 사용할 수 있습니다. 내 회전 목마 DIV 많은 내부 블록을 가지고 있지만 원칙은 동일하기 때문에

$('#carousel div:Event(!click)').each(function(){ 

}); 

내가 각을 사용하고 있습니다 :

http://www.codenothing.com/archives/2009/event-filter/

이 내 사용 예이다. #carousel 내부 div 요소에 click 이벤트가 없으면 해당 이벤트를 추가하십시오. 귀하의 경우 여러 개의 이벤트 바인딩이 방지됩니다 (문제가있는 경우).