Real time Google-like search?

[coryendle]

I am using Smart GWT 2.5.

I was looking for the correct UI widget to perform a search like the one you do at google.com where the search list provides search suggestions in a drop down list dynamically when you start typing.

Can someone tell me what Smart GWT UI widget I should use for that? And are there any examples out there for this?

Thanks,
Cory

[Isomorphic]

ComboBoxItem. If you want the exact appearance of Google search, setShowPickerIcon(false).

[coryendle]

Thanks! I got that working. But now, I am running into another problem.

I am using SmartGWT 2.4 with a client only DataSource that is getting its search results from an RPC call. I retrieve new results when the user types in text. The problem is that I can not find a way to remove the existing data in the datasource before adding the new data based on the search results. Therefore, the ComboBoxItem is showing the same data multiple times.

I tried removing the datasource data by using this call (based on reading this forum)

setTestData(new DataClass[]{});

But this didn't seem to remove any data.

Can anyone suggest a way to remove the existing data in a datasource for a ComboBoxItem before adding more data via the datasource?

Here is my code that I am using.

ComboBox definition:

 

public class SearchComboBoxItem extends ComboBoxItem {
	
	private ComboBoxItem i_searchCombo;
	private CategorySearchDS i_categorySearchDS;
	
	public SearchComboBoxItem() {
		super("search", "Search");
		
		i_categorySearchDS = CategorySearchDS.getInstance();
		
		setAddUnknownValues(true);
		setDefaultToFirstOption(true);
		setCompleteOnTab(true);
		setHint("Enter Search Text");  
		setShowHintInField(true);  
		setWidth(240);
		setOptionDataSource(i_categorySearchDS);
		setAutoFetchData(false);
	
		
		// set the id and display field mapping.
		setDisplayField("label");
		setValueField("id");

                addKeyUpHandler(new KeyUpHandler() {
			
			@Override
			public void onKeyUp(KeyUpEvent event) {
				// Don't start searching until there are at least 2 characters.
				if (getDisplayValue().length() >= 2) {
					Criteria criteria = new Criteria();
					criteria.addCriteria("searchText", getDisplayValue());
					i_categorySearchDS.fetchData(criteria);
				}
				else {
					
				}
				
			}
		});

    }

Here is the DataSource Code:

 
public class CategorySearchDS extends DataSource {
        private static CategorySearchDS instance = null;

	public static CategorySearchDS getInstance() {
		if (instance == null) {
			instance = new CategorySearchDS(DATASOURCE_ID);
		}
		return instance;
	}

	private CategorySearchDS(String id) {

		setID(id);
		setRecordXPath(RECORD_X_PATH);

		DataSourceTextField idField = new DataSourceTextField("id", "Id",128, true);
		idField.setValueXPath(X_PATH_ID);
		idField.setPrimaryKey(true);
		idField.setHidden(true);

		DataSourceTextField labelField = new DataSourceTextField("label","Label", 128, true);
		labelField.setValueXPath(X_PATH_LABEL);

		setFields(idField, labelField);
		setClientOnly(true);
	}

	/*
	 * (non-Javadoc)
	 * 
	 * @see
	 * com.smartgwt.client.data.DataSource#fetchData(com.smartgwt.client.data
	 * .Criteria)
	 */
	@Override
	public void fetchData(Criteria criteria) {

		final String searchText = criteria.getAttribute("searchText");
		serviceAsync service = GWT.create(service.class);
		service.getCategorySearch(searchText, new AsyncCallback<String>() {

			public void onFailure(Throwable caught) {

			}

			public void onSuccess(String elements) {

				// REMOVE all data before setting new
				setTestData(new DataClass[]{});

                                // Convert XML into Records
				Record[] fetchRecords = getRecords(elements);

				// ADD each record from the search
				for (Record record : fetchRecords) {
					addData(record);
				}
			}
		});
		
		//super.fetchData(criteria);
	}
}

Thanks,
Cory

[coryendle]

I have returned to this issue and I still don't have a work around.

Is there anyone out that that can suggest what I may be doing wrong?

Thanks,
Cory

[Isomorphic]

Do not call addData() just call setTestData().

[coryendle]

Thanks! That worked.