2011-09-15 59 views
8

我正在使用GWT 2.3.I,我正在使用GWT單元格表。這裏下面 是我的單元格表的代碼:如何申請像GWT單元格表上的搜索?

public class FormGrid extends SuperGrid { 

List<Form> formList; 


@Override 
public void setColumns(CellTable table) { 
    TextColumn<Form> nameColumn = new TextColumn<Form>() { 
     @Override 
     public String getValue(Form object) { 
      return object.getName(); 
     } 
    }; 
    table.addColumn(nameColumn, "Name"); 
} 

@Override 
public void setData() { 
    if (formList != null && formList.size() > 0) { 
     AsyncDataProvider<Form> provider = new AsyncDataProvider<Form>() { 
      @Override 
      protected void onRangeChanged(HasData<Form> display) { 
       int start = display.getVisibleRange().getStart(); 
       int end = start + display.getVisibleRange().getLength(); 
       end = end >= formList.size() ? formList.size() : end; 
       List<Form> sub = formList.subList(start, end); 
       updateRowData(start, sub); 
      } 
     }; 
     provider.addDataDisplay(getTable()); 
     provider.updateRowCount(formList.size(), true); 
    } 
} 

public List<Form> getFormList() { 
    return formList; 
} 

public void setFormList(List<Form> formList) { 
    this.formList = formList; 
} 

}

在我這組列,設置數據將被稱爲回回超類flow.This細胞表工作正常。 現在我想在這個單元格表中放置一個過濾器類型的工具(比如搜索)。它應該是這樣的,在單元格表格上方有一個texbox,並且在該文本框中寫入了什麼,它應該向所有表單該文本框值的名稱。

例如我在網格中有1000個窗體。現在,如果用戶在單元格表格上方的某個過濾器文本框中寫入「應用程序」,那麼名稱中具有「應用程序」的所有窗體都將被過濾,而網格僅具有這些窗體只要。

這是第一種情況:

另一種情況是我只呈現網格name.I一列已在形式(描述,標籤),但我不渲染them.now用於濾波器兩個屬性如果用戶在過濾器框中寫入「app」,則應該對所有三個(名稱,描述和標籤)進行查詢,並且如果'app'與三個中的任何一個匹配,則應該返回。

我沒有得到如何在單元格表中應用過濾器。 請幫我。提前感謝。

回答

4

您可以在expenses示例中找到實現。

下面是步驟

1)創建一個文本框和搜索按鈕的簡短摘要。
2)一個clickHandler事件添加到搜索按鈕(你也可以添加KeyUpHandler到文本框或者)

searchButton.addClickHandler(new ClickHandler() { 
    public void onClick(ClickEvent event) { 
     search(); 
    } 
}); 

3)在搜索功能檢索搜索字符串,並將其存儲。

private void search() { 
    searchString = searchBox.getText(); 
    setData(); 
    } 

4)修改使用setData()函數把搜索字符串考慮

@Override 
public void setData() { 
    if (formList != null && formList.size() > 0) { 
     AsyncDataProvider<Form> provider = new AsyncDataProvider<Form>() { 
      @Override 
      protected void onRangeChanged(HasData<Form> display) { 
       int start = display.getVisibleRange().getStart(); 
       int end = start + display.getVisibleRange().getLength(); 
       //new function if searchString is specified take into account 
       List<Form> sub = getSubList(start,end); 
       end = end >= sub.size() ? sub.size() : end; 
       updateRowData(sub.subList(start, end);, sub); 
      } 
     }; 
     provider.addDataDisplay(getTable()); 
     provider.updateRowCount(formList.size(), true); 
    } 
} 

private List<Form> getSubList(int start, int end) { 
    List<Form> filtered_list = null; 
    if (searchString != null) { 
     filtered_list= new ArrayList<Form>(); 
     for (Form form : formList) { 
      if (form.getName().equals(searchString) || form.getTag().equals(searchString) || form.getDescription().equals(searchString)) 
       filtered_list.add(form);     
     } 
    } 
    else 
     filtered_list = formList; 
    return filtered_list; 
} 
2

可以提出另一種解決方案是什麼,可以使用很容易多次。 想法是爲您的手機表創建自定義提供程序。 GWT celltable filtering

Video在這篇文章中顯示它的行動。

這是您必須實現的自定義列表數據提供程序代碼的一部分。

@Override 
protected void updateRowData(HasData display, int start, List values) { 
    if (!hasFilter() || filter == null) { // we don't need to filter, so call base class 
     super.updateRowData(display, start, values); 
    } else { 
     int end = start + values.size(); 
     Range range = display.getVisibleRange(); 
     int curStart = range.getStart(); 
     int curLength = range.getLength(); 
     int curEnd = curStart + curLength; 
     if (start == curStart || (curStart < end && curEnd > start)) { 
      int realStart = curStart < start ? start : curStart; 
      int realEnd = curEnd > end ? end : curEnd; 
      int realLength = realEnd - realStart; 
      List<t> resulted = new ArrayList<t>(realLength); 
      for (int i = realStart - start; i < realStart - start + realLength; i++) { 
       if (filter.isValid((T) values.get(i), getFilter())) { 
        resulted.add((T) values.get(i)); 
       } 
      } 
      display.setRowData(realStart, resulted); 
      display.setRowCount(resulted.size()); 
     } 
    } 
}