Commented Issue: SPAutocomplete dropdown issue [10067]

From http://spservices.codeplex.com/discussions/354984

Hi Marc,

I'm using jQuery 1.7.1 and SPServices 0.7.0 I have three custom lists,the only thing I changed was that I disabled attachments.

In the SharePoint form I have three fields (Manufacturer, Model and Site Name which correspond to the custom lists) and have SPAutocomplete for them, here is the code:


$().SPServices.SPAutocomplete({
sourceList: "Manufacturers",
sourceColumn: "Title",
columnName: "Manufacturer",
ignoreCase: true,
numChars: 3,
slideDownSpeed: 200,
highlightClass: "ms-bold",
filterType: 'Contains',
debug: false
});

//Apply autocomplete for Models list
$().SPServices.SPAutocomplete({
sourceList: "ServerModels",
sourceColumn: "Title",
columnName: "Model",
ignoreCase: true,
numChars: 2,
slideDownSpeed: 200,
highlightClass: "ms-bold",
filterType: 'Contains',
debug: false
});

//Apply autocomplete for Site Name list
$().SPServices.SPAutocomplete({
sourceList: "SiteName",
sourceColumn: "Title",
columnName: "Site Name",
ignoreCase: true,
numChars: 3,
slideDownSpeed: 200,
highlightClass: "ms-bold",
filterType: 'Contains',
debug: false
});



When I start typing in the "Site Name" input box the Autocomplete starts working fine (I see a dropdown with the text results), then I get to the "Manufacturer" field and when I start typing the Autocomplete dropdown comes out of the "Site Name" input box, I would expected to see the dropdown in the "Manufacturer" input box, as I start typing in the last field the dropdown still remains in the "Site Name" input box.
Comments: I think I found the solution: Problem description: If you create your own form on a custom page and use the SPAutocomplete-function with more than one field, all autocomplete-dropdowns are displayed below the first autocomplete-field. Root cause: in SPServices-0.7.1a in the function SPAutocomplete in line 2904 the function "genContainerId" is called. This function tries to create a unique id for the div in the format "SPAutocomplete_"<staticName> (where staticName is the fieldName of the columnName. This works perfectly in forms of lists, but on a custom-page, this function always returns "SPAutocomplete_" as id for all dropdowns. Solution: Just below the line var containerId = genContainerId("SPAutocomplete", opt.columnName); add the following containerId = "SPAutocomplete_"==containerId?"SPAutocomplete_"+opt.columnName.replace(/ /g, ''):containerId; Result: Working :)