Autocomplete does not Autocomplete Correctly

[<M/>]

I wrote an autocomplete input (i don't think that is the best thing to call it) in jquery. What it does is auto completes your text. It does that but it autocompletes by re-displaying the whole word/s rather than displaying what is left.

I think I am un-clear, I may need to repeat.

*I will provide my code if needed (jQuery)!

[pritaeas]

Without code, it'll be difficult to spot the problem. If you can reproduce the problem on jsfiddle even better.

[<M/>]

Sorry for my late response... I forgot about this thread... (sadly)

Here is my php

$q = strtolower($_GET["q"]);
if (!$q) return;
$items = array(
"        Los Angeles"=>"1",
"        Dubai"=>"2",
"        New York"=>"3",
"        Kabul"=>"4"
);

foreach ($items as $key=>$value) {
    if (strpos(strtolower($key), $q) !== false) {
        echo "$key|$value\n";
    }
}

?>

jquery

<script type="text/javascript">
  function findValue(li) {
    if( li == null ) return alert("No match!");
    if( !!li.extra ) var sValue = li.extra[0];
    else var sValue = li.selectValue;
  }
  function selectItem(li) {
        findValue(li);
  }
  function formatItem(row) {
        return row[0] + " (id: " + row[1] + ")";
  }
  function lookupAjax(){
    var oSuggest = $("#CityAjax")[0].autocompleter;
    oSuggest.findValue();
    return false;
  }
  function lookupLocal(){
        var oSuggest = $("#CityLocal")[0].autocompleter;
        oSuggest.findValue();
        return false;
  }
    $("#CityAjax").autocomplete(
      "autocomplete.php",
      {
            delay:10,
            minChars:2,
            matchSubset:1,
            matchContains:1,
            cacheLength:10,
            onItemSelect:selectItem,
            onFindValue:findValue,
            formatItem:formatItem,
            autoFill:true
        }
    );

</script>

[<M/>]

I forgot to mention but what does "OP Kudos" mean? I see it on the link if you click this thread...

(please disregard me posting twice in the same thread)

[<M/>]

anyone?

[pritaeas]

What autocomplete plugin are you using?

[<M/>]

i am not using a plugin, i am trying to do this from scratch.

[pritaeas]

$("#CityAjax").autocomplete(

This call, where is it defined? I don't see code for autocomplete.

[<M/>]

I think that could be the problem, how would i fix that?

[pritaeas]

That would be creating a plugin with that name.

[<M/>]

How would you set up the plugin, I'm not sure how to do that?

[Dani]

OP Kudos means that the thread's original poster (YOU!) has lots of kudos with our community.

[<M/>]

Oh okay, but are you able to assist me with the original question though?

[<M/>]

I have another question about OP Kudos... you said it means (I) have lots of kudos with our community but why is that all my threads don't have OP Kudos on it?... Sorry if you count this as a bump... I couldn't edit my post and add on to it.

[pritaeas]

How would you set up the plugin, I'm not sure how to do that?

You can find lots of samples on the subject. See the jQuery website or use a search engine.

Additionally, I have three older plugins on GitHub which you can check out.

[<M/>]

Do you have link to those samples on GitHub?

[Charutayal]

Please go though the link and check the solution with Source code.

http://jqueryui.com/autocomplete/

post me updated :)

[pritaeas]

Sorry. Thought I'd added them:

https://github.com/pritaeas/hp-jquery

The first three links on my website here has usage demos too.

[<M/>]

okay thanks, I am going to check on those and update my progress afterwards

[diafol]

jQueryUI has a sample too: http://jqueryui.com/autocomplete/

LakTek seems to have a nice tute - but I can't comment on the quality too much:
http://www.laktek.com/2011/03/03/introducing-jquery-smart-autocomplete/