SPServices.SPAutocomplete : Hide Field After User Input?

Jun 11, 2013 at 1:59 PM
Edited Jun 11, 2013 at 2:44 PM
When I clean the textbox via jquery

The spautocomplete div is still filled with values and thus will take focus when i focus() on the textbox with values that are not longer in there.

is there a "clean" option? (Since hide() does not seem to work to get focus back on the textfield)
Coordinator
Jun 12, 2013 at 1:05 AM
I'm not sure exactly what you're trying to do. Do you just want the input element to be hidden after a value is selected? Have you tried either .hide() or .prop("disabled", true)?

M.
Jun 24, 2013 at 12:00 AM
Here is the code: http://edward.de.leau.net/about/sharepoint

The function SingleLookupEventHandler:
    function SingleLookupEventHandler(event, objLookup) {
        var singleValueEntered = $(objLookup.singleLookupSelector).val();       
        if (event.type === 'click') {addChoice(singleValueEntered,objLookup);} else {
            if (!(event.which==48 && singleValueEntered.length==0)) {
                $(objLookup.singleLookupSelector).val(singleValueEntered.replace(/\D/g,'').toString(7));
                $(objLookup.singleLookupSelector).val(singleValueEntered.replace(/^(?!0)/g,'0'+singleValueEntered));
            }           
            if (singleValueEntered.length > objLookup.singleLookupColumnTitleTrigger) { 
                var valueExists = false;
                $(objLookup.singleAutoLookupSelector + " LI").each(
                    function () {if ($(this).text() === singleValueEntered) {valueExists = true;}                   
                });
                if (valueExists == false) {InsertButton(singleValueEntered, objLookup);}
                else {AddButton(singleValueEntered, objLookup);}                
                if (event.type === 'keydown' && event.which == 13) {
                    $(objLookup.buttonSelector).trigger('click');
                    $(objLookup.singleLookupSelector).trigger('click');
                    resetFields(objLookup,true);
                    // @todo focus does not focus...                    
                    $(objLookup.singleLookupSelector).focus();
                }
            } else {resetFields(objLookup,false);}
        }
    }
will not focus again on the text field while the "resetfields" does do a hide():
    function resetFields(objLookup,complete) {
        $("#"+objLookup.buttonId).hide();
        if (complete) {
            $(objLookup.singleLookupSelector).val('');
            $(objLookup.singleAutoLookupSelector).hide();
        }   
    }
So: when the user presses "ENTER" instead of clicking an item in the autolookup div/ul/li (because I also check on "Enter") :
// add eventhandler on keyup on single lookup / enter
            $(objLookup.singleLookupSelector).keyup(function(event) {                   
                SingleLookupEventHandler(event,objLookup);
            }).keydown(function(event) {SingleLookupEventHandler(event,objLookup);});           
            // add eventhandler on mouseclick on spautocomplete box single lookup
            $(objLookup.singleAutoLookupSelector).click(function() {
                SingleLookupEventHandler(event,objLookup);
            })
all works fine except that the focus not return on the textfield.

WHERE DOES THE FOCUS GO? --> the focus goes on the right area on the multilookup list on the added value. So somehow the "setting focus on the newly added item in the multilookup list) (which the function addChoice does , called in the function "insertOne" (underneath) takes precedence OVER setting the focus again on the field although this happens much earlier in the flow.
function insertOne(singleValueEntered, objLookup) {
     $().SPServices({
        operation: "UpdateListItems",
        async: false,
        batchCmd: "New",
        listName: objLookup.sourceList,
        valuepairs: [[objLookup.sourceColumnName, singleValueEntered],["Title", objLookup.insertListAnnotation]],
        completefunc: function(xData, Status) {
            var newId = $(xData.responseXML).SPFilterNode("z:row").attr("ows_ID");
            insertChoice(newId, singleValueEntered, objLookup)
            addChoice(singleValueEntered, objLookup)
            resetFields(objLookup,false);
        }
    });
}
So... while I am typing this... the problem lies not within the autocomplete box, the problem lies in the multilookup list newly added item (on the right hand side of the multilookup box) that retains the focus even although I specify focus() on the textbox.

And just to check: if I put an "alert" directly above the focus() I get the alert but setting focus: no.

It must be something very simple. Maybe... the "adding a value to multilookup list" takes some while processing and even although I set focus the textbox to which the autolookup is attached it takes just a little longer and sets the focus after I set my focus or... maybe the autolookup removes my focus and sets it back to the default focus. MAYBE I should try "remove focus" before I set a new focus but I thought focus() would do that, that would be most logical. No that last one is nonsense indeed. Well.. as you can see: im not quite out of it.
Coordinator
Jun 24, 2013 at 3:49 AM
I still can't get my head around what you are trying to do. This may be a case where a picture is worth a thousand words. Can you add a picture of what you're doing into your post?

M.