2013-06-04 2 views
0

나는이jQuery를 모바일 아약스 링크

<html> 
    <head> 
     ... 
    </head> 

<body> 
    <section data-role="page" data-theme="d"> 
     <section data-role="content"> 
      @RenderBody() 
     </section> 
    ... 
    @Scripts.Render("~/bundles/jquery.mobile") 
    </section> 
</body> 
</html> 

처럼 어떻게 든 찾고 마스터 레이아웃을 가지고 그리고 마스터 레이아웃의 내용 부분에 몇 가지 코드를 밀어 컨트롤러 및 템플릿의 몇 가지있다 .

내가 링크를 클릭

: 내가 볼

<a href="/Orders/EditOrder/14960">Some order</a> 

아약스 로더가 표시 될 경우, url 변경,하지만 모두가 원래 페이지의 깨진 마크 업입니다. 코드를 살펴보면 DOM에 두 페이지 섹션이 있음을 알 수 있습니다 (즉, 대상 페이지가 성공적으로 주입되었지만 표시되지 않음). 페이지를 새로 고침하면 대상 페이지가 표시됩니다.

무엇이 잘못 되었나요? 왜 멋진 JQM 페이지 전환을 얻을 수 없습니까? 고맙습니다.

답변

0

다른 페이지로 리디렉션 할 책임이있는 링크에 data-ajax = 'false'를 추가하십시오.

달리 말하지 않는 한 JQuery Mobile은 AJAX 탐색을 사용합니다. ASP.NET 리디렉션은 일반적인 요청에는 문제가 없지만 AJAX에는 문제가 발생합니다. 그래서이 경우 내 대답은 AJAX를 끄는 것입니다. 이를 위해서는 태그에 ajax = 'false'라는 속성 데이터를 추가하면됩니다.

필자의 경우 쉬운 해결책은 (각 Html.ActionLink/Url.Action을 변경하는 데 많은 시간이 소요됨) _Layout.cshtml 끝에 (body 태그를 닫기 직전에) 추가하는 것일 수 있습니다. .

$(document).on('pageinit', function() { 
    $('a').each(function() { 
    $(this).attr("data-ajax", "false"); 
}); 

});

jQuery Mobile이 링크가있는 Ajax를 사용하지 않기를 바랄 만하면 괜찮을 것입니다. 대부분의 상황에서 Ajax를 사용하고 문제가 발생할 수있는 곳에서만 선택적으로 전원을 끌 수 있습니다.