AutoComplete Source from API

Forums Autocomplete AutoComplete Source from API

Tagged: 

This topic contains 7 replies, has 3 voices, and was last updated by  Alexander Bautz 1 month, 2 weeks ago.

  • Author
    Posts
  • #25436

    Kasey
    Participant

    Alex,

    I’m wondering if it would be possible to use AutoComplete with a datasource of an external REST API instead of a SharePoint list? If not I’ll go down the jQuery UI AutoComplete path but I like yours better.

    • This topic was modified 5 months ago by  Kasey. Reason: Wrong forum
  • #25462

    Alexander Bautz
    Keymaster

    I haven’t added any official method to override this, but you can hack it by overriding the default function for getting the items like this:

    // Copy default function
    spjs.ac.getAllItemsREST_old = spjs.ac.getAllItemsREST;
    // Override default function
    spjs.ac.getAllItemsREST = function (argObj) {
        // Add your custom code here and ensure the output is in this format - including the fields you have specified as "ShowField", "SearchField" and "optionDetailFields":
        spjs.ac.data.dataObj[argObj.applyTo] = {
            "done": true,
            "items": [
                {
                    "ID": 1,
                    "Title": "Item 1"
                },
                {
                    "ID": 2,
                    "Title": "Item 2"
                }
            ]
        };
        setTimeout(function () {
            jQspjs("#spjs_acspinner_" + argObj.applyTo).hide().next().show();
            spjs.ac.data.loadFinished = new Date().valueOf();
        }, 100);
    };

    This function must be placed ABOVE the call to spjs.ac.textField({…}); and you must use the following settings:

    ...
    "useREST":true,
    "preloadData":true,
    ...

    If you use autocomplete for other fields and want to use the built in function for those, you must reset the function back to the default after you have finished calling the one using the custom function – do it like this:

    // Reset default function
    spjs.ac.getAllItemsREST = spjs.ac.getAllItemsREST_old;

    Let me know how this works out.

    Alexander

  • #26935

    lzuhuo
    Participant

    Hi Alex.
    This is really useful for my projects.
    So, I wonder know, if is it possible update items array with new data while the user typing. For example: I have an ajax request API to return more then 45.000 users, but I want to filter using part of user full name on query. The objective is return less results then 45.000.

  • #26956

    lzuhuo
    Participant

    Let’s Go

    I tryed to use filterREST but is not exacly what I need.
    For example:
    Full Name: Elizeu Eslon Marinho Oliveira.
    When the length of the user’s string typed is more then 5, I use an Ajax API resquest to return a JSON object and insert in “obj_aluno” in this part:

    spjs.ac.data.dataObj[argObj.applyTo] = {
    “done”: true,
    “items”: obj_aluno
    };

    Until this part, the AC Solution works fine. But when the user type in the same field, a diferent name, I intend call another Ajax API request, with another object, and I cant update the spjs.ac.data.dataObj without kill the AC function to reload new options.

  • #26966

    Alexander Bautz
    Keymaster

    I’m sorry, but this is not supported. Why are you using a separate Ajax request? – is the data not in a SharePoint list?

    Alexander

  • #26988

    lzuhuo
    Participant

    No. I published an C# Api on Sharepoint IIS to retrieve data from another database as JSON. Much better and faster then using External List Connection.

  • #26995

    Alexander Bautz
    Keymaster

    If your Ajax request gets all the items and you modify the spjs.ac.getAllItemsREST function like my example in my reply above it should work, but if your Ajax request only gets a subset of items based on your input in the field it won’t work without modifying other parts of the code.

    Alexander

You must be logged in to reply to this topic.