>  기사  >  웹 프론트엔드  >  extjs 목록 상자에 목록 항목을 동적으로 추가하는 방법(multiselect)_extjs

extjs 목록 상자에 목록 항목을 동적으로 추가하는 방법(multiselect)_extjs

WBOY
WBOY원래의
2016-05-16 18:48:561488검색

생성 시 자동으로 로드되는 ArrayStore(키워드: data: ds)이므로 동적 추가의 예는 없지만 우리 프로젝트에는 세 개의 목록 상자가 있어야 하고 마지막 두 개의 내용은 기반이어야 합니다. 첫 번째 목록 상자의 내용에 동적 로드가 적용되므로 첫 번째 목록 상자의 내용을 선택할 때 마지막 두 목록 상자의 내용이 동적으로 채워져야 합니다. 이전 버전 2.2의 예제는 인터넷에 없어서 목록 데이터를 동적으로 제어하는 ​​기능을 찾는 데 하루를 보냈습니다. 우선 내 방법은 공식적인 방법이 아니었습니다. 내가 생각해낸 아이디어는 다음과 같습니다.
이 메서드 이전에 다중 선택 개체에 대한 내 저장소는 다음과 같이 정의됩니다.

코드 복사 코드는 다음과 같습니다.

flowDs = new Ext.data.ArrayStore({
data: [[123,123]],
필드: ['value','text']
} );

(1)var toflowStore = msForm.getForm().findField('toflow').store; 이름을 기준으로 다중 선택 객체의 저장 객체
(2) Ext.data.Record 객체를 생성합니다. 이것은 제가 오랫동안 추가하려고 생각했던 방법인데 너무 어리석은 자책입니다. :
코드 복사 코드는 다음과 같습니다.

var Record = new Object();
record.value = "2";
record.text = "3";
var records = new Ext.data.Record(record); 생성된 Ext.data.Record 객체를 multiselect 저장소 객체에 추가합니다.
toflowStore.add(record1);
위의 세 단계를 통해 목록 multisleect에 목록 항목을 동적으로 추가할 수 있습니다. Remove()/removeAll() 메소드를 통해 항목을 삭제할 수 있습니다. 구체적인 사용 방법은 샘플 코드의 ItemSelector.js에서 확인할 수 있습니다.
위의 분석을 통해 multiselect의 생성 규칙을 대략적으로 추정할 수 있습니다. 저장소에 있는 속성 필드: ['value', 'text']입니다. 생성할 때 시스템은 속성 데이터를 통해 반복합니다. [[123,123]]의 콘텐츠는 객체 객체로 생성된 다음 해당 객체에 기록됩니다. 다음 코드와 유사한 저장소 객체:



코드 복사 코드는 다음과 같습니다. var item = [],itemObj,record;
for(var i = 0; i< this.data.length;i ){
item = this.data[i]
itemObj = new Object ();
itemObj.value = item[0];
itemObj.text = item[1]
record = new Ext.Record(itemObj)
(기록);
}


위 내용은 단지 내 추측일 뿐입니다. extjs의 엔지니어가 이 절차를 주의 깊게 연구하지 않은 것인가요?
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.