[ASK] Integrating CI and Jquery autocomplete plugin

Posted: 18 August 2008 07:28 PM

[ Ignore ]

Summer Student

Total Posts: 6

Joined 05-07-2008

Hi all, I am trying to use the jquery autocomplete plugin and found a bit of stuck here. It seems that the plugin uses a $_GET parameter and therefore can’t work with the CI URL re-routing. It calls url like this:

http://localhost/SITE/controller/search_fullname?q=joko&limit=10&timestamp=1219101506002

I can’t get the variable q to work, but if I can rewrite the url to let’s say:

http://localhost/QMIT/plan/search_fullname/joko

then I can just adjust the controller to work accordingly, any hints?

TIA

Profile

gon

Posted: 19 August 2008 04:28 AM

[ Ignore ] [ # 1 ]

Lab Assistant

Total Posts: 127

Joined 08-06-2007

Hi,

You can edit the autocomplete plugin to make it use POST.
Just add

type: “post”,

to the configuration object sent inside $.ajax( statement, inside request() function.

Or you can enable $_GET this way. I have used it without any problem.

Cheers

Profile

Aria Rajasa

Posted: 19 August 2008 07:48 AM

[ Ignore ] [ # 2 ]

Summer Student

Total Posts: 6

Joined 05-07-2008

Thank you so much gon for the reply. I use your solution and change it to post and now it works! Thanks again!

Profile

San2k

Posted: 07 September 2008 09:46 AM

[ Ignore ] [ # 3 ]

Summer Student

Total Posts: 11

Joined 09-07-2008

Hi! I started to work with CI yesterday.

Could you please write a little example of how did you realized this autocomplete feature in CI?

Here where iam stuck - $(”#suggest1”).autocomplete(’/data_work/search_username/’,type:“post”);
});

So data_work is a cntroller. search_username - function. This function will search for usernames in DB and return it to autocomplete.

I dont know what to do next. I think its necessarily to do something with CI URI routing, but i dont know what exactly

Profile

Aria Rajasa

Posted: 07 September 2008 12:31 PM

[ Ignore ] [ # 4 ]

Summer Student

Total Posts: 6

Joined 05-07-2008

I am using the jquery autocomplete and edit the jquery.autocomplete.js. I search for:


$.ajax({type: "get"...

and edit the “get” to “post”, and it works! I also encountered another problem with thickbox. So I used the “activating the get functionality” that was also recommended and it also works :D

Hope it helps

Profile

San2k

Posted: 07 September 2008 12:51 PM

[ Ignore ] [ # 5 ]

Summer Student

Total Posts: 11

Joined 09-07-2008

Yep, did it! Thanks alot!

Profile

GrootBaas

Posted: 10 September 2008 12:26 AM

[ Ignore ] [ # 6 ]

Grad Student

Total Posts: 55

Joined 06-12-2008

Hi all,

I seem to have the same issue, but I can not find


$.ajax({type: "get"

anywhere in the jquery.autocomplete.js.

Please can someone help me in the right direction.

Thanks in advance,

Profile

Aria Rajasa

Posted: 10 September 2008 03:08 AM

[ Ignore ] [ # 7 ]

Summer Student

Total Posts: 6

Joined 05-07-2008

search for


$.ajax({mode: "abort",port: "autocomplete" + input.name,

and add type: “post” like this


$.ajax({type: "post", mode: "abort",port: "autocomplete" + input.name,

Works for me

Profile

GrootBaas

Posted: 10 September 2008 07:17 PM

[ Ignore ] [ # 8 ]

Grad Student

Total Posts: 55

Joined 06-12-2008

Guys,

Thank you so much for your help. You really make a difference in somebody’s live with the fast and educated replies. Thank you all again.

For the next person who comes across this problem ...

Inside jquery.autocomplete.js

Change

$.ajax({mode: "abort",
    port: "autocomplete" + input.name,
    dataType: options.dataType,
    url: options.url,
    data: $.extend({
    q: lastWord(term),
    limit: options.max
    }, extraParams),
    success: function(data) {
    var parsed = options.parse && options.parse(data) || parse(data);
               cache.add(term, parsed);
             success(term, parsed);
                }
}); 

to this ...

$.ajax({type: "post",
        mode: "abort",
    port: "autocomplete" + input.name,
    dataType: options.dataType,
    url: options.url,
    data: $.extend({
    q: lastWord(term),
    limit: options.max
    }, extraParams),
    success: function(data) {
    var parsed = options.parse && options.parse(data) || parse(data);
               cache.add(term, parsed);
             success(term, parsed);
                }
}); 

Then in your controller, change ....


$q = strtolower($_GET["q"]);


$q = strtolower($_POST["q"]);

Profile

mikeyhell

Posted: 14 June 2009 06:42 PM

[ Ignore ] [ # 9 ]

Lab Assistant

Total Posts: 106

Joined 01-30-2008

Adding type: “post”, in jquery.autocomplete.js throws an error:

missing } in compound statement

Anyone know why? This seemed to work before and my JS skills aren’t good enough to track it down.

Thanks

Profile

slowgary

Posted: 14 June 2009 10:24 PM

[ Ignore ] [ # 10 ]

Research Assistant

Total Posts: 683

Joined 03-21-2009

You’ll probably need to post your code Mikey.

Profile

mikeyhell

Posted: 14 June 2009 11:51 PM

[ Ignore ] [ # 11 ]

Lab Assistant

Total Posts: 106

Joined 01-30-2008

Copied from above ... I basically just added in that type:“post” but it won’t pick up the post variable ... stays as get… not sure why it won’t change but I checked on jquery forums and they said the same thing ... just add that param in and it should just work:

$.ajax({type: "post",
        mode: "abort",
    port: "autocomplete" + input.name,
    dataType: options.dataType,
    url: options.url,
    data: $.extend({
    q: lastWord(term),
    limit: options.max
    }, extraParams),
    success: function(data) {
    var parsed = options.parse && options.parse(data) || parse(data);
               cache.add(term, parsed);
             success(term, parsed);
                }
}); 

From my view:

$(document).ready(function(){
    $("#client_name").autocomplete("<?php echo base_url() ?>ajax/customers", {
        scroll: true,
        scrollHeight: 300,
        autoFill: true,
        cacheLength: 1,
        min: 1,
        max: 20,
        matchContains: false,
        onItemSelect:selectItem, selectOnly:1, elementID:'cust_id'
    }); 
}); 

Profile

slowgary

Posted: 15 June 2009 08:26 AM

[ Ignore ] [ # 12 ]

Research Assistant

Total Posts: 683

Joined 03-21-2009

I’m not sure. You said you were getting an error. What gave the error? What file was it in? Did it give you a line number?

Profile

mikeyhell

Posted: 15 June 2009 12:26 PM

[ Ignore ] [ # 13 ]

Lab Assistant

Total Posts: 106

Joined 01-30-2008

I got it worked out. I switched to the segment based autocomplete described in this thread:

Segment Based Jquery Autocomplete

I initially had some troubles with that on my local server but once I committed to my dev server everything seemed to work fine so I’m pretty sure that is the same issue I was having here. Not sure what the deal was though b/c I’m running a vm image of my dev server. Thanks anyways though.

Profile

‹‹ [SOLVED] Pagination and URI Routing Problem help tracking clicks ››

Username		Remember Me?
Password		forgot password?