2011-05-12 2 views
5

그래서 많은 애니메이션 가능 UI 요소가있는 복잡한 페이지를 만들 계획입니다. 이러한 애니메이션 가능 UI 요소의 상태 (확장/축소, 강조 표시 등)를 유지하는 명확한 방법을 찾고 싶습니다. 몇 가지 아이디어가 있지만 누군가가 js 프레임 워크를 알고 있으므로 바퀴를 다시 발명하지 않는다는 것을 알고 싶습니다.포스트 백에서 UI 요소 상태를 유지하는 방법은 무엇입니까? (ASP.NET MVC)

편집

내 생각은 지금까지입니다 : 폼 게시물에

1) 각 UI 요소의 상태를 얻을 데이터를 게시하는 추가합니다. 나는 특별한 CSS 클래스 (추적을위한 등록 유형)로 상태를 추적하고자하는 모든 UI 요소를 표시하고 다형성 방식으로 상태를 얻을 수있는 콜백을 지원한다고 생각하고있다 (각 UI 요소

2) 클라이언트에서 보낸 상태 정보를 인식하고 UI 요소의 html을 올바른 상태로 출력 할 수있는 UI 요소에 대한 HtmlHelpers를 만듭니다 (예 : 확장, 선택 색인, 강조 표시 등). 클라이언트 측에서 상태를 복원하려고하는 모든 곳에서 js가 터지기보다는 서버 측에서 상태를 설정하는 것이 더 바람직합니까?)

3) WebControls 또는 ViewState와 같이 복잡하거나 비대하지 않아야합니다.

그런 식으로 작동하는 프레임 워크가 있습니까? 그렇다면 프레임 워크는 좋은 아이디어처럼 제안 된 프레임 워크 사운드를 재생합니까?

+0

주를 유지하기를 계획하는 기간은 어떻게됩니까? 세션 당? – ataddeini

+0

처음에는 세션 당. 그러나 내가이 권리를 쌓으면 나는 원한다면 DB에 상태를 저장할 수 있고 내 "사용자 정의 상태 관리 논리"를 가지고 작업 할 수 있다고 확신합니다. 곧 내 질문에 대한 자세한 내용을 업데이트하겠습니다. – enamrik

+0

상자에서 꺼내 줄만한 것을 알지 못합니다. 나는 단지 Github의 저장소에 대한 빠른 검색을 수행했지만 나에게 뛰어 들지는 않았다. (아마도 Codeplex뿐만 아니라 거기에 대한 철저한 조사가 필요할 것이다.) 당신의 접근 방식이 좋은 생각처럼 들린다. HtmlHelpers가 내가 생각하는 방법입니다. – ataddeini

답변

2


나는 당신이 모든 데이터/상태 관리 로직을 통합하고 그것을 즉 당신이 좋아하는 방식의 .toJSON() 기능을 사용하여 서버로 전송을 지속 할 수 있기 때문에 KnockoutJS, 당신이 도움이 될 것 같아요.

아마 @ Schwarty의 localStorage 솔루션과 통합 할 수 있습니까?

+0

KnockoutJS/localStorage 콤보 접근법이 마음에 듭니다. –

+0

제안 해 주셔서 감사합니다. 녹아웃은 굉장해 보인다. 하지만 html 요소와의 데이터 바인딩입니다. UI 구성 요소의 상태를 유지하는 것에 대해 이야기하고있었습니다 (예 :아코디언, 부동 div) 그들 안에 많은 html 요소가 있습니다. 상태는 js 라이브러리 객체를 통해서만 사용할 수 있습니다. – enamrik

+0

@enamrik 당신은 다음을 보았습니까 : http://knockoutjs.com/documentation/style-binding.html 및 http://knockoutjs.com/documentation/css-binding.html? 예를 들어, ui-state-active 클래스 또는 상단 및 왼쪽 스타일 속성을 뷰 모델에 바인딩 할 수 있습니다. –

1

나는 이것과 비슷한 것을 과거에 해왔고 jQuery 쿠키 플러그인을 사용했다. 이는 실행 가능한 옵션 일 수 있습니다. 상태를 유지해야하는 기간과 쿠키를 사용하는 사용자에게 의존 할 수 있는지 여부에 달려 있습니다. 그들은 (사용자의 UI 상태가 저장되는로 범위 확인 있다고 가정하지 않는 경우

http://plugins.jquery.com/project/Cookie

0

당신은 사용자 에이전트가 지원하는 경우 localStorage를 사용 (대부분이 할) 및 쿠키 또는 세션에 다시 떨어질 수 여러 장치 사용에 걸쳐 해당 상태를 유지하는 대신 개별 시스템 수준에서). MVC 3에서 Modernizr을 사용하여 localStorage 지원을 확인하고이를 저장/검색 할 수있는 방법에 대한 게시물을 가지고 있습니다. Learn how to use Modernizr from the ASP.NET MVC3 Tools Update to store user data via HTML5 localStorage

관련 문제