Suggestions z-index problem when in static UITableView cell

[MarcMeszaros]

For the app I'm working on, there is a form with some textfields. The autocomplete works without a problem inside a regular view in a view controller, but there are some z-index issues when the autocomplete textfield is inside a static cell of a UITableView.

It's hard to show with screenshots, but you can see the form below with the autocomplete suggestions showing up. When you try and click on one it dismisses the dialog and selects the MRN field below the suggestions.

[EddyBorja]

Interesting, seems like a hit test issue. I'll investigate it.

[MarcMeszaros]

I'm relatively new to iOS development, but is there anything I can do to help trace the problem?

[EddyBorja]

Is your project available on github?

What happens if the autocomplete menu appears but there's no cell underneath it? Do the taps still go to the autocomplete table or do they not register?

[MarcMeszaros]

Unfortunately it's a closed source app.

Taps are not registered. Could it be that the UITableViewController is receiving the touch events and the TableView for the suggestions is not?

Aside: I added an extra UIView in my layout, dragged and dropped the textfield from the static cell into the view and it worked. No code changes were made. I drag it back into the the tableview cell and it stops working again.

Static cell setup:

Suggestion touch event working in with autocomplete textfield in UIView above and outside of the tableview:

[EddyBorja]

I think the issue is that a UIView only detects touches that are within it's frame, but an autocomplete tableview lies outside a cell's frame. As a test, I bet if your tableview cell was a lot larger so that autocomplete table were able to appear in it, the touches would register.

If you need a solution quickly, consider using the autocomplete table as a keyboard accessory, just set the autoCompleteTableAppearsAsKeyboardAccessory property for the textfield to true.

[MarcMeszaros]

You are correct. A larger cell containing the suggestions correctly register touch events and fills in the textfield.

[EddyBorja]

Yea, then it's a hit test issue. I'll have to think about this.

[angelmic]

MLPAutoCompleteTextField is great controller but I also got this problem.

[akac]

For me, neither the keyboard accessory works or it under the cell. Also when using it as a keyboard accessory, its showing over the keyboard itself.

Very weird.

[EddyBorja]

Can you post a screenshot of what you mean with the cell showing over the keyboard accessory?

[brentrr]

Thanks a lot for providing this code. It adds nice functionality that is easy to use.

I'm sure there is probably a better way to do this, but I made the following changes (marked with brr) that seem to fix the issue of the touches not being detected when the MLPAutoCompleteTextField is in a subview.

In MLPAutoCompleteTextField.h

@property (strong, retain) UIView *autoCompleteTableSuperView;  // brr - added property

In MLPAutoCompleteTextField.m

- (void)expandDropDownAutoCompleteTableForNumberOfRows:(NSInteger)numberOfRows
{
    [self resetDropDownAutoCompleteTableFrameForNumberOfRows:numberOfRows];

    if(numberOfRows && (self.autoCompleteTableViewHidden == NO)){
        [self.autoCompleteTableView setAlpha:1];

        if(!self.autoCompleteTableView.superview){
            if([self.autoCompleteDelegate
                respondsToSelector:@selector(autoCompleteTextField:willShowAutoCompleteTableView:)]){
                [self.autoCompleteDelegate autoCompleteTextField:self
                                   willShowAutoCompleteTableView:self.autoCompleteTableView];
            }
        }

        [self.superview bringSubviewToFront:self];

        // brr - start changes: See if a different super view should be used, if not, use ours
        if (self.autoCompleteTableSuperView == nil) {
            self.autoCompleteTableSuperView = self.superview;
        }
        [self.autoCompleteTableSuperView insertSubview:self.autoCompleteTableView
                         belowSubview:self];
        // brr - end changes

        [self.autoCompleteTableView setUserInteractionEnabled:YES];
        if(self.showTextFieldDropShadowWhenAutoCompleteTableIsOpen){
            [self.layer setShadowColor:[[UIColor blackColor] CGColor]];
            [self.layer setShadowOffset:CGSizeMake(0, 1)];
            [self.layer setShadowOpacity:0.35];
        }
    } else {
        [self closeAutoCompleteTableView];
        [self restoreOriginalShadowProperties];
        [self.autoCompleteTableView.layer setShadowOpacity:0.0];
    }
}

In the subview, set the autoCompleteTableSuperView property to its superview and the touches will be detected. If you use MLPAutoCompleteTextField in the top view or view with enough space for the drop down, just don't set the property to have it function as normal.

    _studentText.autoCompleteTableSuperView = self.superview;  // be sure to do this after the view has been added

[mikumi]

Any update on an official fix for this issue? Effectively MLPAutoCompleteTextField cannot be used in UITableViews :-/

[akac]

We are using the "brr" changes above successfully.

[mikumi]

Thanks for that. With the suggestion above I still had problems with positioning in some cases. In case you are interested I have created a pull request that fixes both issues without the usage of an extra property. Pull request: https://github.com/EddyBorja/MLPAutoCompleteTextField/pull/30

[EddyBorja]

The pull request has been merged, so the issue should be fixed now.