Search jQuery

jQuery Forum

[autocomplete] - changing the sort order of the dropdown

in Using jQuery • 10 years ago

Hi

I have got a backend PHP script that calls MySQL in order to get town and city names.

If I type 'cam' in to the autocomplete textfield, I get something like:

Big Camberley
Camberly
Camberwell
Camden
Drone Camden

However the sort order isn't quite what I want. I want the sort order to be:

Camberley
Camberwell
Camden
Big Camberley
Drone Camden

This is because MOST users will want the search to start at the beginning of a place name (i.e. they type 'cam' intending 'Camberley', 'Camberwell' or 'Camden'). I therefore want the values with the match at the start to come first, and any other fields to come after that. But each of these two groups are sorted independently giving the second sort order above.

Is there a 'sort()' callback to do this or a specific option that can be set?

Thanks.

sucom.kum..

Re: [autocomplete] - changing the sort order of the dropdown

10 years ago

There is no direct method or option for this functionality. However, you can filter the source like the code below.

source:function(req, responseFn){
var re = $.ui.autocomplete.escapeRegex(req.term);
var pattern1 = new RegExp("^"+re, "i");
var a = $.grep(YOURARRAY, function(item, index){return pattern1.test(item);}); //build array item begins with input string
var b = $.grep(YOURARRAY, function(item, index){return ((item.toLowerCase()).indexOf(re.toLowerCase())>0);}); //build array items with input string somewhere
responseFn( a.concat(b) );
}

Any enhancement is appreciated.
/K

qwijybo

Re: [autocomplete] - changing the sort order of the dropdown

10 years ago

Hi

I had the similar problem but got it solved with another method then the one posted above since I know PHP better then JS. I simply sorted the mysql results before sending it to autocomplete.

// Receiving the result from mysql and storing it in a temp array
while ($row = mysql_fetch_array($fetch, MYSQL_ASSOC)) {
    $temp[] = $row['place'];
}

// Creating a custom callback function which sorts the array based on the length of the values
// In this case the shortest name appears on the top
// You can create any function you want here but The comparison function must return an integer less than, equal to,
// or greater than zero if the first argument is considered to be respectively less than, equal to, or greater than the second.
function mySort($a,$b){
    return strlen($a)-strlen($b);
}

// the sorting function ( php.net/manual/en/function.uasort.php )
uasort($temp,'mySort');

// Then store the sorted array in a new array ready for json encoding
foreach ($temp as $key => $value){
    $row_array['value'] = $value;
    array_push($return_arr,$row_array);
}

echo json_encode($return_arr);

You could sort the table how you want now.

Response title

Attachments

jQuery Forum

[autocomplete] - changing the sort order of the dropdown

Re: [autocomplete] - changing the sort order of the dropdown

Re: [autocomplete] - changing the sort order of the dropdown

Statistics

Tags

Actions