Keeping drop down open, blocking AJAX (Bootstrap)

StackOverflow https://stackoverflow.com/questions/23656061

Question

I am keeping a bootstrap drop down open when the user clicks the content of the dropdown, otherwise it should be hidden ( e.g. on outside click and when the button is pressed again)

This is working in this example:

http://jsfiddle.net/sK56j/

$(function () {
    $('.dropdown > ul').on({
        "click": function() {
            return false;
        }
    });
});

However, I am adding an ajax link (asp.net mvc) into the dropdown, when clicked the ajax event is being blocked.

How can I achieve the above without blocking all javascript events?

Here's a quick paint masterpiece for what I am trying to achieve:

https://i.stack.imgur.com/tRUCO.jpg

Thanks

EDIT:

AJAX Link Code

@Ajax.ActionLink("X", 
                 "Action", "Controller", 
                  new { <route values> }, new AjaxOptions { 
                               HttpMethod = "POST", 
                               InsertionMode = InsertionMode.Replace, 
                               UpdateTargetId = "element-id" }, 
                  new { <html attributes> })

http:// msdn.microsoft.com/en-us/library/system.web.mvc.ajax.ajaxextensions.actionlink(v=vs.118).aspx

Was it helpful?

Solution

Okay, so I'm finally starting to understand the problem. As far as I can see, there are multiple options.

You could either use the suggestions from the link you posted in the comments, or you could overwrite the bootstrap click-to-close event with a custom one. But I unfortunately don't see a clean solution (there might be one though).

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top