This project has moved. For the latest updates, please go here.
2

Closed

SPAutocomplete dropdown issue

description

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.
Closed Dec 28, 2013 at 6:49 PM by sympmarc
Released in 2013.02

comments

sympmarc wrote Aug 10, 2012 at 8:24 PM

I can't reproduce this in my environment. Since I'm getting ready to push out the beta of v0.7.2, I'm going to defer this to the next release.

schoppet wrote Aug 30, 2012 at 12:34 PM

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 :)

sympmarc wrote Oct 8, 2013 at 9:45 PM

Implemented in 2013.02ALPHA3. Changed genContainerId to contain schoppet's logic so that it covers all instances, not just SPAutocomplete.
    // Generate a unique id for a containing div using the function name and the column display name
    function genContainerId(funcname, columnName) {

        var staticName = $().SPServices.SPGetStaticFromDisplay({
            listName: $().SPServices.SPListNameFromUrl(),
            columnDisplayName: columnName
        });
        return funcname + "_" + (staticName !== undefined && staticName !== "") ? staticName : columnName.replace(/ /g, '');

    } // End of function genContainerId

_ssaunders wrote Mar 10, 2014 at 5:46 PM

Hi Marc,

Have just encountered this issue using SPAutocomplete in a Site Page with 2013.01.

I upgraded to 2014.01 expecting to pick up the change above, but it doesn't seem to be there ... was this backed out after 2013.02ALPHA3?

I've applied the change above and Autocomplete now works as expected in my Site Page, but concerned in case this may have implications elsewhere.

Incidentally, I had to add extra parentheses within the return statement and write as
return funcname + "_" + ((staticName !== undefined && staticName !== "") ? staticName : columnName.replace(/ /g, ''));
to get this to work.

I'd be grateful if you could let me know if this fix should be part of the codebase, or if this has been backed out for some reason.

Thanks,

Stuart