tread
tread

Reputation: 11098

JQuery UI autocomplete with Zend Framework Request URL issues?

I am using:

$( "#search" ).autocomplete({
      source: "http://ztest.local/ajax/ac"
    });

So if a user types in the search box, a request is sent to the server...problem is I would like the format to be of the form:

http://ztest.local/ajax/ac/term/foo

However the request is given as:

http://ztest.local/ajax/ac?term=foo

I have tried:

source: 'http://ztest.local/ajax/ac/term/' + encodeURIComponent($('#search').val()

however that didn't even make a request...

Not sure how to move forward, somewhat related question

Upvotes: 0

Views: 164

Answers (1)

Chayemor
Chayemor

Reputation: 3707

I used JQuery-Autocomplete with Zend for a project couple of months ago. Here is how I wrote up the source, hope it helps.

 $( "#unit_autocomplete" ).autocomplete({
        source: function( request, response ) {     
            $.ajax({
                url: 'http://localhost/becasPropias/public/unit/autocomplete/format/json'+
                     '/type/'+type+'/term/'+request.term,
                dataType: "json",
                success: function( data ) {
                    $("#unit_autocomplete").removeClass('ui-autocomplete-loading');
                },
                error: function(jqXHR, textStatus, errorThrown ){
                    $("#unit_autocomplete").removeClass('ui-autocomplete-loading');
                } 
            });
        },
        minLength:2,
        select: function(event, selectedItem) {
            toggle('hidden_unit', selectedItem['item']);
        },
        open: function() {
            $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
        },
        close: function() {
            $( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
        }
    });

Out of this whole code, here is the part that interests you:

source: function( request, response ) {     
            $.ajax({
                url: 'http://localhost/becasPropias/public/unit/autocomplete/format/json'+
                     '/type/'+type+'/term/'+request.term,
                dataType: "json",
                success: function( data ) {
                    $("#unit_autocomplete").removeClass('ui-autocomplete-loading');
                },
                error: function(jqXHR, textStatus, errorThrown ){
                    $("#unit_autocomplete").removeClass('ui-autocomplete-loading');
                } 
            });
        }

And out of this code

    url: 'http://localhost/becasPropias/public/unit/autocomplete/format/json'+
                     '/type/'+type+'/term/'+request.term,

As you see, you can put in the url as you need. The code for this is available in my git account.

Upvotes: 1

Related Questions