Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

On click, suggestions are removed before event bubbles to top #118

Closed
jharding opened this issue Mar 15, 2013 · 4 comments
Closed

On click, suggestions are removed before event bubbles to top #118

jharding opened this issue Mar 15, 2013 · 4 comments
Assignees
Milestone

Comments

@jharding
Copy link
Contributor

This makes it impossible to use event delegation as noted #104.

@mcadam
Copy link

mcadam commented Mar 27, 2013

Hello,

Just to mention, I still have that problem with v0.9 and it is somethink I really would like to work ;)
Keep me posted, if you want me to try out some versions or anything

@jharding
Copy link
Contributor Author

@mcadam your best bet is to probably just watch this thread, I'll be sure to update it when I get around to fixing this.

@dukehoops-zz
Copy link

jsfiddle reproducing the problem: http://jsfiddle.net/dukehoops/gYUQL/

@jharding jharding modified the milestones: v0.10.1, v0.10.2 Feb 5, 2014
jharding pushed a commit that referenced this issue Feb 5, 2014
Remove suggestions from DOM only after the click event that originated
from a suggestion has bubbled to the root.
@yanko-belov
Copy link

$(document).ready(function(){
        $('#search2').typeahead({
                hint: true,
                highlight: true
            },
            {
                name: 'products',
                displayKey: 'name',
                source: function (query, process) {
                    return $.post("php/Products.php", { action:'sell-search',search_value: query}, function (data) {
                        process(JSON.parse(data));
                    });
                },
                templates: {
                    empty: [
                        '<div class="empty-message text-danger">',
                        '<h3>Няма намерена стока</h3>',
                        '</div>'
                    ].join('\n'),
                    suggestion: Handlebars.compile(
                        '<div class="row">' +
                            '<div class="col-xs-8"><div>{{name}}</div><div class="small text-success">{{category}}</div></div>' +
                            '<div class="col-xs-3">{{price_retail}} <span class="x-small">лв/{{measure}}<span></div>'+
                            '<div class="col-xs-1"><button class="btn btn-sm btn-warning float-right products-info "><span class="glyphicon glyphicon-info-sign"></span></button></div>' +
                        '</div>')
                }
            });
});

    $(document).on('click','.products-info', function(e){
        e.stopPropagation();
        console.log("Cliicked");
        console.log('Inside link');
        alert('test');
        return false;
    });

This is my code, I am trying to implement clickable suggestion ( by clickable I mean, when the user clicks the '.products-info' button of the suggestion a modal with info will be launched up, AND the drop down menu with the suggestions will NOT hide). I think that this is exactly the same problem with this on the issue.

What it heppans now is:
1.hide drop down menu
2.console.log("Cliicked");
3.console.log('Inside link');
4.alert('test');

P.S. I am using typeahead.js 0.10.5.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Development

No branches or pull requests

4 participants