2017-09-29 21 views
1

DB의 데이터를 편집, 저장, 취소, 삭제 버튼과 함께 표 형식으로 표시해야합니다.wicket에서 두 개의 관련 드롭 다운으로 편집 가능한 격자를 구현하는 방법은 무엇입니까?

편집 버튼을 클릭 한 후 데이터가 두 개의 드롭 다운 선택 항목에 표시되고 첫 번째 드롭 다운에서 데이터를 선택한 다음 두 번째 드롭 다운 데이터 모델이 첫 번째 드롭 다운 선택에 따라 변경되어야합니다.

나는 https://github.com/wicketstuff/core/tree/master/editable-grid-parent을 완료했습니다. 하지만 개찰구에 1 개의 드롭 다운이있는 편집 가능한 그리드 만 표시하고 2 개의 드롭 다운을 원합니다. 이걸 도와주세요.

UPDATE : 내가 사용했던이

private List<AbstractEditablePropertyColumn<Person, String>> getColumns() 
     { 
    List<AbstractEditablePropertyColumn<Person, String>> columns = new ArrayList<AbstractEditablePropertyColumn<Person, String>>(); 
    stateDropDownPropertyColumn = new AbstractEditablePropertyColumn<Person, String>(new PropertyModel<String>(this, "selectedMake"), "state") 
    { 

     private static final long serialVersionUID = 1L; 

     public EditableCellPanel<Person> getEditableCellPanel(String componentId) 
     { 

      return getStateDDCellpanel(componentId,this);    
     } 
    }; 

    cityDropDownPropertyColumn = new AbstractEditablePropertyColumn<Person, String>(new Model<String>("CarModel"), "city"){ 

     private static final long serialVersionUID = 1L; 

     @Override 
     public EditableCellPanel<Person> getEditableCellPanel(String componentId) { 
      // TODO Auto-generated method stub 
      return getCityDDCellpanel(componentId,this); 
     }}; 

    columns.add(stateDropDownPropertyColumn); 
    columns.add(cityDropDownPropertyColumn); 
    return columns; 
} 
    private EditableRequiredDropDownCellPanel<Person, String> getStateDDCellpanel(String componentId, 
            AbstractEditablePropertyColumn<Person, String> DropDownPropertyColumn){ 

    this.stateComponentID = componentId; 
    this.stateDropDownPropertyColumn = DropDownPropertyColumn; 
    stateDropDownCellPanel = new EditableRequiredDropDownCellPanel<Person,  String>(stateComponentID, stateDropDownPropertyColumn, stateChoices); 

    return stateDropDownCellPanel; 

} 

private EditableRequiredDropDownCellPanel<Person, String> getCityDDCellpanel(String componentId, 
     AbstractEditablePropertyColumn<Person, String> DropDownPropertyColumn){ 

    this.cityComponentID = componentId; 
    this.cityDropDownPropertyColumn = DropDownPropertyColumn; 
    cityDropDownCellPanel = new EditableRequiredDropDownCellPanel<Person, String>(cityComponentID, cityDropDownPropertyColumn, cityChoices); 
    cityDropDownCellPanel.setOutputMarkupId(true); 
    cityDropDownCellPanel.setOutputMarkupPlaceholderTag(true); 
    return cityDropDownCellPanel; 

} 

내가하지 내가 드롭 다운 세포의 행동을 둘 필요가 어디 이것에 대해 어떤 생각. (첫 번째 고정, 두 번째 ID가, 의존 동적으로 계산)

+0

패턴은 둘, 셋 드롭 다운에 적용 할 수 Beahviours를 추가합니다. carefull을 읽고, 열 목록이 어떻게 빌드되었는지, 그리고 Your.를 추가하십시오. –

+0

MAYBE 당신은 "선택의 위키 동적 목록"을 원합니다 (가운데 문장은 분명하지 않습니다). 이 패턴은 쉽게 바뀔 수 있습니다. –

+0

이 소스의 패턴을 2 번 드롭 다운에 적용 할 수 있지만 선택 목록은 동적이 아닙니다. 이 소스를 어떻게 사용하고 일반적으로 wicket 드롭 다운 구성 요소 목록을 사용하여 동적으로 선택 목록을 만듭니다. – nitin

답변

0

아마 거의 직접 대답은 동적 목록에 따라 질문 : http://examples7x.wicket.apache.org/ajax/choice

가 SO 규칙을 할 수 있도록 허가 공식 예를 아파치에서 순수 링크, 발췌를 포함하지 (짧게 준비 - 컴파일하지 않음)

모델 변경 데이터를 준비하고 AJAX 이벤트 강제 새로 고침 - 아이디어의 핵심입니다. 첫 번째 '제작자'에 연결된 이벤트 (아약스 행동) 및 '모델'을 새로 고치는 행동 세력 이것은 전형적인 wicket + ajax 패턴입니다.

/** 
* Linked select boxes example 
* 
* @author Igor Vaynberg (ivaynberg) 
*/ 
public class ChoicePage extends BasePage 
{ 
private String selectedMake; 

private final Map<String, List<String>> modelsMap = new HashMap<>(); // map:company->model 

/** 
* @return Currently selected make 
*/ 
public String getSelectedMake() 
{ 
    return selectedMake; 
} 

/** 
* @param selectedMake 
*   The make that is currently selected 
*/ 
public void setSelectedMake(String selectedMake) 
{ 
    this.selectedMake = selectedMake; 
} 

/** 
* Constructor. 
*/ 
public ChoicePage() 
{ 
    modelsMap.put("AUDI", Arrays.asList("A4", "A6", "TT")); 
    modelsMap.put("CADILLAC", Arrays.asList("CTS", "DTS", "ESCALADE", "SRX", "DEVILLE")); 
    modelsMap.put("FORD", Arrays.asList("CROWN", "ESCAPE", "EXPEDITION", "EXPLORER", "F-150")); 

    IModel<List<String>> makeChoices = new AbstractReadOnlyModel<List<String>>() 
    { 
     @Override 
     public List<String> getObject() 
     { 
      return new ArrayList<>(modelsMap.keySet()); 
     } 

    }; 

    IModel<List<String>> modelChoices = new AbstractReadOnlyModel<List<String>>() 
    { 
     @Override 
     public List<String> getObject() 
     { 
      List<String> models = modelsMap.get(selectedMake); 
      if (models == null) 
      { 
       models = Collections.emptyList(); 
      } 
      return models; 
     } 

    }; 

    Form<?> form = new Form("form"); 
    add(form); 

    final DropDownChoice<String> makes = new DropDownChoice<>("makes", 
     new PropertyModel<String>(this, "selectedMake"), makeChoices); 

    final DropDownChoice<String> models = new DropDownChoice<>("models", 
     new Model<String>(), modelChoices); 
    models.setOutputMarkupId(true); 

    form.add(makes); 
    form.add(models); 

    ... 

    makes.add(new AjaxFormComponentUpdatingBehavior("change") 
    { 
     @Override 
     protected void onUpdate(AjaxRequestTarget target) 
     { 
      target.add(models); 
     } 
    }); 
    } 
} 

의견 후 업데이트. 이전 github 코드로 돌아가려면 고정 목록을 모델로 대체해야합니다. 방법??? 파생하거나 복사, IModel과 contructor를 추가 ... 개찰구는 아주 좋은 객체 디자인을하고 있습니다. 비슷한 방식으로 그리드 작성자에게 알려지지 않은 열 유형을 추가합니다.

BTW '귀하의 의견'은 매우 효과적입니다. 미안하지만, 할 수 있으면 도와 줄 수는 있어도 너를 위해 완전한 프로젝트를 만들지는 마. 희망 당신은 코딩과 함께 즐길 수 있습니다.

package org.wicketstuff.egrid.column; 

import java.util.List; 

import org.apache.wicket.extensions.markup.html.repeater.data.table.PropertyColumn; 
import org.apache.wicket.markup.html.form.DropDownChoice; 
import org.apache.wicket.markup.html.form.FormComponent; 
/** 
* 
* @author Nadeem Mohammad 
* 
*/ 
public class EditableRequiredDropDownCellPanel<T, S> extends EditableCellPanel 
{ 

    private static final long serialVersionUID = 1L; 

    public EditableRequiredDropDownCellPanel(final String id, final PropertyColumn<T, S> column, @SuppressWarnings("rawtypes") final List choices) 
    { 
     super(id); 

     @SuppressWarnings("unchecked") 
     DropDownChoice<T> field = new DropDownChoice<T>("dropdown", choices); <--- **** Here should be model **** 
     field.setLabel(column.getDisplayModel()); 
     add(field); 
    } 

    @Override 
    public FormComponent<?> getEditableComponent() 
    { 
     return (FormComponent<?>) get("dropdown"); 
    } 
} 

여기에 변경된 클래스 수익률 :

columns.add(new AbstractEditablePropertyColumn<Person, String>(new Model<String>("Age"), "age") 
     { 

      private static final long serialVersionUID = 1L; 

      public EditableCellPanel getEditableCellPanel(String componentId) 
      { 
       return new ***** EditableRequiredDropDownCellPanel ***** <Person, String>(componentId, this, Arrays.asList("10","11","12","13","14","15")); 
      } 

}); 

도이 소스에서

+0

@jackez 괜찮습니다. 그러나이 예제를 편집 가능한 그리드 예제로 사용하려고 시도했지만 작동하지 않습니다. getColumn()으로 편집 가능한 격자 예제에서 아이디어를 주시겠습니까? – nitin

+0

그건 내 질문에 어디 코드에 행동을 넣어해야합니다. – nitin

+0

도움을 청하십시오. – nitin