2014-02-19 3 views
1

ZK에서 찾을 수없는 선택형과 함께 Listbox의 매우 일반적인 기능을 구현하고 싶습니다.ZK 사용자 정의 목록 상자 구성 요소

상황 : 사용자가 목록 상자에서 값을 선택합니다. 값을 선택하고 사용자가 해당 목록을 다시 열면 모델을 동일한 모델로 변경해야하지만 빈 listitem이 앞에 와야합니다. 그가 그 빈 값을 선택하면, 다시 모델은 동일하게 변경해야하지만, 인덱스 0

에서 빈을 listitem없이 나는 쓰기 같은 것들을 많이 시도 :

1) ZUL에서 동적 모델을. 그것은 일종의,하지만 나는 ZUL을 가능한 한 간단하고 깨끗하게 유지하고 싶습니다.

<listbox id="x" mold="select" model="@load(not empty vm.criteria[self.id].selectedItem ? 
vm.metaDataMap[self.id].model : vm.metaDataMap[self.id].modelWithEmptyValue)" 
    selectedItem="@bind(vm.criteria[self.id].selectedItem)"> 
    <listitem> 
     <listcell label="@load(each.value)" value="@load(each)" /> 
    </listitem> 
</listbox> 

2) 내 목록 상자에 SelectorComposer를 작성하십시오. 레이블과 값이 사라지기 때문에 값이 "@bind (vm.criteria [self.id] .selectedItem)"로 설정되지 않기 때문에 제대로 작동하지 않았습니다. 그리고 index`es

public class ListboxComposer extends SelectorComposer<Listbox> { 
private static final long serialVersionUID = 1L; 

public ListModelList<CaseStatusEnum> status = new ListModelList<CaseStatusEnum>(CaseStatusEnum.values()); 
public ListModelList<CaseStatusEnum> statusWithEmpty = new ListModelList<CaseStatusEnum>(CaseStatusEnum.values()); 

public Listbox comp; 

public void doAfterCompose(Listbox comp) throws Exception { 
    super.doAfterCompose(comp); 
    comp.setModel(new ListModelList<CaseStatusEnum>(status)); 
    statusWithEmpty.add(0, null); 
} 

public ListModelList<CaseStatusEnum> getStatus() { 
    return status; 
} 

@Listen("onSelect = listbox") 
public void onSelect(SelectEvent<Listitem, CaseStatusEnum> evt) { 
    Listbox listbox = this.getSelf(); 
    Listitem selectedItem = listbox.getSelectedItem(); 
    int selectedIndex = selectedItem.getIndex(); 
    if (listbox.getSelectedItem().getValue() != null) { 
     listbox.setModel(statusWithEmpty); 
     if (selectedIndex >= listbox.getModel().getSize()) { 
      listbox.setSelectedIndex(listbox.getModel().getSize()-1); 
     } else { 
      listbox.setSelectedIndex(selectedIndex+1); 
      listbox.getItemAtIndex(selectedIndex+1).setLabel(selectedItem.getLabel()); 
      listbox.getItemAtIndex(selectedIndex+1).setValue(selectedItem.getValue()); 
     } 
    } else { 
     listbox.setModel(status); 
     listbox.clearSelection(); 
    } 
} 
} 

와 내 ZUL에서 몇 가지 문제 :

<listbox id="x" mold="select" apply="lt.pathxxx.ListboxComposer" 
    model="${composer.status}" 
    selectedItem="@bind(vm.criteria[self.id].selectedItem)"> 
    <listitem> 
     <listcell label="@load(each.value)" value="@load(each)" /> 
    </listitem> 
</listbox> 

3) 난 목록 상자를 확장하여 사용자 정의 구성 요소를 만들려고. 그러나 나는 그것을 만들지 않았다.

그래서 기본적으로 목록 상자를 확장하여 내 맞춤 구성 요소를 작성하고 싶습니다. 선택한 항목이 있는지 여부에 따라 모델을 조작 할 수 있습니까, 아니면 아니요 (null)? 그것을하는 적당한 방법은 무엇인가?

편집 : 는 기본적으로, 필요한 것을 내가 ONE 목록 상자와 모델 (많은 ListItems) 자바에서 설정해야합니다 모든이 필요

<hlayout id="x"> 
    <listbox mold="select" selectedItem="@bind(vm.criteria[self.parent.id].order)" 
     visible="@load(not empty vm.criteria[self.parent.id].order)"> 
     <listitem label="" value="" /> 
     <listitem label="Descending" value="desc" /> 
     <listitem label="Ascending" value="asc" /> 
    </listbox> 
    <listbox mold="select" selectedItem="@bind(vm.criteria[self.parent.id].order)" 
     visible="@load(empty vm.criteria[self.parent.id].order)"> 
     <listitem label="Descending" value="desc" /> 
     <listitem label="Ascending" value="asc" /> 
    </listbox> 
<hlayout> 

입니다. 어쩌면 내가 더 분명하게 만들었을거야! 답변 해 주셔서 감사합니다!

답변

2

ZUL :

<listbox mold="select" model="@load(vm.listboxModel)" selectedItem="@bind(vm.selectedListBoxItem)" onSelect="@command('check')"> 
    <listitem> 
     <listcell label="@load(each.value)" value="@load(each)" /> 
    </listitem> 
</listbox> 

VM :

private ListModelList listData; // of course init and fill it 
private Person selectedListBoxItem; 

public ListModelList getListData() { 
    return listData; 
} 

public void setSelectedListBoxItem(Person selectedListBoxItem) { 
    this.selectedListBoxItem = selectedListBoxItem; 
} 

public Person getSelectedListBoxItem() { 
    return selectedListBoxItem; 
} 

@Command 
@NotifyChange("listData") 
public void check() { 
    if (selectedListBoxItem != null) { 
     if (listData.get(0) != null) { 
      System.out.println("added null"); 
      listData.add(0, null); 
     } 
    } else { 
     if (listData.get(0) == null) { 
      System.out.println("removed null"); 
      listData.remove(0); 
     } 
    } 
} 

편집 :보기 다음과 같습니다? 그래서 당신은 그가 할 필요가 무엇을한다는 것을 확인할 수 System.out.println("removed null");에 (그것을 테스트 않았다.이

희망은 당신이 원하는 무엇 (그것 내가 무엇을) 당신의 질문을 이해합니다.

Greetz 진정.

+0

없음 :(나는 다른 기능을 필요가 없습니다. 의사 코드 하면 (selectedItem가 = NULL) {(데이터, 데이터, 데이터)와 같은 주고 모델 } 다른 (널 (null), 데이터, 데이터, 데이터) 기타에서 같은 모델을 제공 단어를 선택했으면 목록 상자에 빈 선택을 추가하고 싶습니다. – Osvaldas

+0

오, 쉬워요. 코드를 리펙토링합니다. – chillworld

+0

예, 이것이 제가 필요로하는 것입니다! 감사! – Osvaldas