CI & Jquery UI Autocomplete
1 year ago
So this is just for quick reference for all those who might find it useful:

We are using JSON with a remote call.......
So in the function which you are calling for your results, use something like this:


$data['response'] = 'true'; //Set response
$data['message'] = array(); //Create array




foreach($t as $tt)
{
$data['message'][] = array('label'=> $tt->id.' - '.$tt->title, 'value'=> $tt->id); //Add a row to array
}


//echo '


';
//echo print_r($rt);
//echo '



';
echo json_encode($data);


In your view file, you need to call the following. I have made the assumption that you have all the Jquery Libraries loaded and ready to go.
This should be placed AFTER the input field (which in this case is parentTaskID) in script tags (of course)


$(function() {




$( "#parentTaskID" ).autocomplete({
minLength: 1,
source: function(req, add){
$.ajax({
url: '',
dataType: 'json',
type: 'POST',
data: req,
success: function(data){
if(data.response =='true'){
add(data.message);
}
}
});
},
select: function(event, ui){}
});
});

Just in case anyone wants it for a quick test, the input field code is:



'parentTaskID',
'id' => 'parentTaskID',
'value' => @$parentTaskID,

);
echo form_input($data);
?>






Sorry about the bad indents, but its there. Enjoy!!! (PS I use YAML CSS framework with the form CSS add on (see their site)
Posted in: Inspiration
Posted on: 2010-12-23 10:53:36