탭 탐색 - 프레임 또는 AJAX?
https://stackoverflow.com/questions/253248
-
05-07-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
Russian문제
나는 꽤 표준적인 웹 인터페이스라고 생각하는 것을 가지고 있습니다.
상단에 있는 일련의 탭을 통해 액세스할 수 있는 4가지 ListView(그리드 컨트롤)가 있습니다.
나는 이것을 다음과 같이 구현했습니다.
대체 텍스트 http://img402.imageshack.us/img402/1530/pagedu8.jpg
탭 1은 그리드 1을 포함하는 페이지 1을 프레임 2에 로드하고, 탭 2는 그리드 2를 포함하는 페이지 2를 프레임 2에 로드합니다.
그러나 이는 그리드의 항목을 클릭하고 DetailsPage1.aspx를 프레임 2에 로드하면 프레임 1과 탭이 계속 표시되고 활성화된다는 의미입니다.
저는 하나의 프레임만 갖고 HttpRequest(또는 asp.net의 WebRequest)를 사용하여 탭 클릭에 따라 동적으로 페이지를 로드해야 한다는 조언을 받았습니다.
이것이 올바른 접근 방식입니까?유용한 자료나 팁이 있다면 알려주시면 감사하겠습니다!
감사해요
해결책
프레임은 절대 금물입니다.다른 기술을 사용하여 얻을 수 없는 프레임에는 이점이 없습니다.
그렇다면 AJAX를 사용해야 한다는 뜻인가요?반드시 그런 것은 아닙니다.AJAX는 풍부하고 원활한 인터페이스를 제공해야 할 필요성을 느끼는 경우 완벽한 솔루션이지만 꼭 필요한 것은 아닙니다.
서버 측 포함을 사용하여 탭을 다른(공통) 하위 페이지로 분리할 수 있지만 ASP.NET을 언급했으므로(프레임워크 v2 이상에서 실행한다고 가정) 마스터 페이지를 사용하는 것이 좋습니다. 탭은 하나의 콘텐츠 섹션이나 마스터 자체에 있고 그리드/세부 정보는 다른 콘텐츠 섹션에 있습니다.
두 기술의 주요 차이점은 AJAX를 사용하면 탭에서 탭으로의 전환이 원활하고 매끄럽게 진행된다는 점입니다. 그러나 a) 약간의 추가 작업이 필요합니다(특히 AJAX 프레임워크에 익숙하지 않은 경우). b) 본질적으로 4개의 페이지가 하나로 합쳐져 있으며, 페이지가 '더 무거워' 유지 관리가 더 복잡합니다.AJAX가 아닌 경로를 선택한 경우 주요 차이점은 각 탭을 클릭할 때마다 작지만 뚜렷한 새로 고침 효과가 있다는 것입니다(매번 새 페이지가 로드되므로).
물론 마스터 페이지는 어쨌든 일관된 사이트 스타일과 구조를 유지하는 데 유용하므로 마스터 페이지 시스템과 함께 AJAX를 사용하지 못할 이유가 없습니다.
다른 팁
프레임은 절름발이입니다. 사용자가 북마크를 설정하고 사용자가 Google을 통해 사이트를 방문하면 항해 프레임이 보이지 않습니다. 따라서 더러운 자바 스크립트가 많이 필요합니다. 이것을 확인하려면. JavaScript가 필요한 경우 처음부터 바로 수행하고 Ajax를 사용하십시오.
Ajax는 최고의 선택입니다. 그러나 백/포워드를 통해 탐색 할 수 있도록 명심하십시오. 가장 좋은 선택은 페이지 해시를 변경하는 것입니다. 나는 다음과 같은 것을 사용했습니다.
두 번째 탭의 첫 번째 탭 domain.com/#tab2의 domain.com/#tab1
등등.
jQuery를 사용하는 경우 이것 좋은 출발이 될 수 있습니다 (나는 그것을 사용하고 아무런 문제가 없었습니다). 그래도 모든 인기있는 프레임 워크에 대한 솔루션이 있다고 확신합니다 :)
프레임을 사용하는 대신 다른 모든 페이지에 탐색 페이지를 포함시켜야합니다. 브라우저는 모든 페이지에 동일한 문서를 포함하고 캐시를 포함한다는 것을 알 수 있습니다.
당신은 시도 했습니까? Tabcontainer 또는 4 개의 디테일 패널을 모두로드하고 탭 선택 변경에 패널을 표시/숨기는가?
사용자가 볼 수있는 화면에 따라 세부 사항보기를 동적으로로드하면 사용자가 입력 한 정보를 지속하는 데 어려움이있을 수 있으며 대기가 발생합니다 (사용자는 대기하지 않아도됩니다).
JQuery 및 JQuery UI 플러그인을 사용하는 것이 좋습니다. 프레임이 필요하지 않습니다.
Stingyjack처럼, 나는 Tabcontainer 제어하지만, 당신이 할 경우 뷰 스테이트가 너무 커지지 않도록주의를 기울일 수 있습니다.
예를 들어, 해당 탭이 보이지 않을 때까지 그리드 뷰에 아무것도로드하지 말고 컨텐츠를 제거하지 않으면 (필요한 경우 데이터베이스로 다시 저장하십시오. TabContainer의 ActiveAbchanged 이벤트를 사용하면이 전략의 핵심이 될 것입니다. 그리드의 Diable Viewstate이지만 컨테이너를 위해 두십시오.
ASP.NET을 사용하고 있으므로 4 개의 컨트롤을 모두 mutliview에로드 한 다음 PostBack에서는 버튼을 클릭 한 Visible을 설정하십시오.
http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.mitiview.aspx
당신이하지 않는 한 프레임 (또는 해당 문제에 대한 iframes)을 사용하지 마십시오. 물론 해야 하다...
내가 사용할 수있는 유일한 유효한 이유 (i) 프레임은 실제로 파일 업로드 컨트롤이며, 그것이 유효한지 확실하지 않습니다 ...
