@Bas Gooren that code you linked was very helpful. I have what I want
up and working, but it's using a bunch of ugly jQuery ajax callbacks
hacked into StringBuilders :-(

@Don Ferguson I don't *think* this is what I'm looking for as I have
thousands of options and I don't want them rendered at page load.
Instead I want to register a function that will call-back to my Java
code when someone start typing and allows me to search. However, I did
not run it, just looked at the code.

Here is what I have, again it's ugly. Does anyone know how I can
clean-up the jQuery.ajax stuff? I've gotta imagine there is a way to
do it in Wicket.

Thanks in advance...

Bill-

public class TypeaheadField<T> extends TextField<T> implements
IResourceListener {

    private static final long serialVersionUID = 1L;

    public TypeaheadField(final String id, final IModel<T> model) {
        super(id, model);

        setOutputMarkupId(true);
        add(new AttributeModifier("data-provide", "typeahead"));
    }

    @Override
    public void renderHead(final IHeaderResponse response) {
        super.renderHead(response);

        StringBuilder sb = new StringBuilder();

        sb.append("$('#");
        sb.append(getMarkupId().replace(".", "\\\\."));
        sb.append("').typeahead(");
        sb.append(getConfig());
        sb.append(");");

        response.render(OnDomReadyHeaderItem.forScript(sb.toString()));
    }

    private String getConfig() {
        final StringBuilder ajaxCall = new StringBuilder();

        ajaxCall.append("{ \"source\": ");

        ajaxCall.append("function(query, process) { $.ajax({ url: \"");
        ajaxCall.append(urlFor(IResourceListener.INTERFACE, null));
        ajaxCall.append("\", data: { \"query\": query }, success:
function(data, status, jqXHR) { process(data); } }); }, ");

        ajaxCall.append("items: 4 }");

        return ajaxCall.toString();
    }

    @Override
    public void onResourceRequested() {
        final Request request = getRequestCycle().getRequest();
        final IRequestParameters params = request.getRequestParameters();

        final String query =
params.getParameterValue("query").toOptionalString();

        WebResponse webResponse = (WebResponse) getRequestCycle().getResponse();
        webResponse.setContentType("application/json");

        OutputStreamWriter out = new
OutputStreamWriter(webResponse.getOutputStream(),
getRequest().getCharset());
        JSONWriter json = new JSONWriter(out);

        try {
            json.array();

            json.value("Connecticut");
            json.value("California");
            json.value("Colorado");

            json.endArray();
        } catch (JSONException e) {
            throw new WicketRuntimeException("Could not write Json
response", e);
        }

        try {
            out.flush();
        } catch (IOException e) {
            throw new WicketRuntimeException("Could not write Json to
servlet response", e);
        }
    }
}



On Tue, May 14, 2013 at 10:04 PM, Don Ferguson <don.fergu...@gmail.com> wrote:
> The following seems to work (using wicket 6.7 with the experimental bootstrap 
> module).  Basically, this ajax behavior is called on page load.   At that 
> point, it writes out the javascript to initialize the object with typeahead 
> parameters.
>
> HTML:
>
>         <input wicket:id="typeahead" type="text" data-provide="typeahead" 
> data-items="4">
>
> JAVA:
>
>         add(new TextField<String>("typeahead").add(new TypeAhead()));
>
> TypeAhead Behavior:
>
> import org.apache.wicket.Component;
> import org.apache.wicket.ajax.AbstractDefaultAjaxBehavior;
> import org.apache.wicket.ajax.AjaxRequestTarget;
> import org.apache.wicket.markup.head.IHeaderResponse;
> import org.apache.wicket.markup.head.OnDomReadyHeaderItem;
>
> import java.util.Arrays;
> import java.util.List;
>
> public  class TypeAhead extends AbstractDefaultAjaxBehavior {
>     @Override
>     protected void onBind() {
>         super.onBind();
>         getComponent().setOutputMarkupId(true);
>     }
>
>     @Override
>     protected void respond(AjaxRequestTarget target) {
>         String sources = toJSONArray(getOptions());
>         String script = String.format("$('#%s').typeahead( { source: %s } 
> );", getComponent().getMarkupId(), sources);
>         target.appendJavaScript(script);
>     }
>
>     @Override
>     public void renderHead(Component component, IHeaderResponse response) {
>         super.renderHead(component, response);
>         response.render(OnDomReadyHeaderItem.forScript( 
> this.getCallbackScript() ));
>     }
>
>      // OVERRIDE THIS TO SUPPLY LIST OF OPTIONS
>     public  List<String> getOptions() {
>         return Arrays.asList( new String[] {"Alabama", "Aftermath", 
> "Absinth"} );
>     }
>
>      // There's probably a built-in method that does this…
>
>     private String toJSONArray(List<String> strings) {
>         StringBuffer result = new StringBuffer("[");
>         for (String string : strings) {
>             result.append("'");
>             result.append(string);
>             result.append("',");
>         }
>         if (strings.size() > 0) {
>             result.deleteCharAt(result.lastIndexOf(","));
>         }
>         result.append("]");
>         return result.toString();
>     }
>
> }
>
>
> Hope this works for you.
>
> -- Don Ferguson
>
>
> On Tuesday, May 14, 2013 at 1:36 PM, William Speirs wrote:
>
>> I'm trying to create a typeahead component for Wicket that uses Bootstrap's
>> Typeahead:
>>
>> To set this up though I need to provide the .typeahead method in JavaScript
>> with a function that will return the results, given the query. What I'd
>> like to do is attach that JavaScript function to a Java method much like
>> what is done with an AjaxEventBehavior [2]. I cannot figure out how to go
>> about setting all of this up... any ideas?
>>
>> Thanks...
>>
>> Bill-
>>
>> [1] http://twitter.github.io/bootstrap/javascript.html#typeahead
>> [2]
>> http://ci.apache.org/projects/wicket/apidocs/6.x/org/apache/wicket/ajax/AjaxEventBehavior.html
>>
>>
>
>

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
For additional commands, e-mail: users-h...@wicket.apache.org

Reply via email to