Extjs 동적 탭을 저장하고 페이지로드시 다시 렌더링 할 수 있습니까?

Question

Extjs를 사용하여 동적으로 새 탭을 추가하고 있습니다.하지만 사용자가 다시 방문 할 때마다 사용자가 동적으로 만드는 모든 탭을 렌더링해야하기 때문에 새로 추가 한 탭을 어딘가에 (아마 데이터베이스에) 저장할 수있는 방법이 있습니다. 그 페이지.

나는 탭에서 쿠키의 상태를 저장할 수 있지만 .. 새로 만든 탭의 상태를 저장하려면 먼저 탭의 HTML (?) 스 니펫을 저장해야한다는 것을 알고 있습니다. 어딘가에? 여기 비현실적 일을하려고

var tab; 
var tabIndex = 0; 
var tabArray = []; 

Ext.application({ 
    launch: function() { 
    Ext.state.Manager.setProvider(new Ext.state.CookieProvider({ 
     expires: new Date(new Date().getTime() + (1000 * 60 * 60 * 24 * 7)) 
    })); 
    Ext.create('Ext.container.Viewport', { 
     layout: 'absolute', 
     items: [{ 
     x: 50, 
     y: 50, 
     width: 300, 
     height: 300, 
     xtype: 'tabpanel', 
     stateful: true, 
     stateId: 'tp1', 
     stateEvents: ['tabchange'], 
     getState: function() { 
      return { 
      activeTab: this.items.findIndex('id',this.getActiveTab().id) 
      }; 
     }, 
     applyState: function(s) { 
      this.setActiveTab(s.activeTab); 
     }, 
     items: [{ 
      id: 'c0', 
      title: 'Tab One' 
     }, { 
      id: 'c1', 
      title: 'Tab Two' 
     }, { 
      id: 'c2', 
      title: 'Tab Three' 
     }], 
     bbar: [ 
        { 
         text: 'Add Tab', 
         //region: 'south', 
         xtype: 'button', 
         handler: function() { 
          var tabs = this.up('tabpanel'); 
          tab = tabs.add({ 
           title: 'Tab ', 
           closable:true, 
           xtype:'panel', 
           width: '100%', 
           height: '100%', 
           items: []             
          }).show(); 
         } 
        } 
       ] 
     }] 
    }); 
    } 
}); 

암 : 여기

내 코드? 또는 어떻게 든 새로 생성 된 탭을 저장하고 페이지로드시 새로 생성 된 탭으로 전체 tabpanel을 렌더링 할 수 있습니까?

그런 광범위한 질문을 드려 죄송합니다.

감사합니다.

Answer 1

나는 비슷한 일을 과거에 해왔다. 이것은 우리가 가진 디자인 접근법입니다. 막연하지만 아직 수행했습니다.

탭을 동적으로 만들고 항목 (패널/입력 필드)을 추가하고이 항목의 값을 변경하면 (예 : 텍스트 상자에 텍스트를 입력하고 확인란을 선택하는 것과 같이) 마지막으로 save를 누르면 JSON으로 모든 데이터를 추출합니다.

저장해야하는 값 (항목, 값, 하위 구조의 유형 등)에 따라 사용자 정의 빌드가 필요합니다.

그런 다음 페이지를 다시 렌더링하려면 JSON을 사용하여 페이지를 다시 렌더링해야합니다. 이 솔루션을 만드는 것은 쉽지 않습니다. 그러나 일단 완료되면 모든 탭에 대해 재사용 할 수 있습니다. 그러나 동적 인 경우도 있습니다.

그리고 마지막으로, 확실히 가능한 그