"Token-input" plugin has an issue with it. That is the drop down <div> which is added dynamically to the body it do not work properly if the input box on which tokenInput is bind to is in the popup. As the drop down is created some where outside the popup and hence it do not work properly.

However to make it work, please follow the following steps. This a quick fix which I created to overcome it.

1st Step:- Adding another property under default setting in jquery.tokeninput.js file.

var DEFAULT_SETTINGS = {
.........
........
//adding div
 divId: null
};

2nd Step:- Adding the following code in the jquery.tokeninput.js file at the mentioned place. This will check if the divId property is null. If divId property is null it will work as default otherwise the new drop down will be created at the specific div mentioned.

// The list to store the dropdown items in
        if (settings.divId !== null) {
            var dropdown = $("<div>")
            .addClass($(input).data("settings").classes.dropdown)
            .appendTo($( "#"+settings.divId ))
            .hide();
        } else {
            var dropdown = $("<div>")
            .addClass($(input).data("settings").classes.dropdown)
            .appendTo("body")
            .hide();
        }

function show_dropdown() {
          if (settings.divId !== null) {
            dropdown.css({
//                position: "absolute",
//                top: token_list.offset().top + token_list.outerHeight(true),
//                left: token_list.offset().left,
//                width: token_list.width(),
//                'z-index': $(input).data("settings").zindex
            }).show();
        } else {
            dropdown.css({
                position: "absolute",
                top: token_list.offset().top + token_list.outerHeight(true),
                left: token_list.offset().left,
                width: token_list.width(),
                'z-index': $(input).data("settings").zindex
            }).show();
        }
 }

3rd Step:- Initialization or binding the tokenInput to a specific ID property on an HTML element. Add new property as "divId" .

$("#demo-input-local-custom-formatters").tokenInput(
           AJAX URL, {
                propertyToSearch: "first_name",
                ..........
                ............
                ..............
                divId: "email-list"
});

4th Step:- Adding the div element in the HTML with same id as mentioned earlier where drop-down to be created.

<label>Friend email </label>
 {!! Form::input("text", "email", "", array("placeholder" => "EMAIL", "class" => "inputStyle", "id" =>"demo-input-local-custom-formatters")) !!}
<div id="email-list"></div>