Question

I've got a small problem. I've got a standard search screen (Perl, jQuery, css, html) when the results are returned I use jquery ui selectable and print the results as ordered list, list items. This has been working fine where the user single clicks the desired record and presses the edit button, using the id selected, I redirect them to the "edit/view" screen.

Today I was asked to add double click functionality, meaning the user double clicks on the desired record and is taken to the "edit/view" page. I develop in FF and our users use IE9 (UGGGGGGGG!!!!!!!!!!). So I wrote it in FF and got it working pretty easily. Here is my selectable section of code

$(function() {
$("#selectable").selectable({
      selecting: function(event, ui){
            if( $(".ui-selected, .ui-selecting").length > 1){
                  $(ui.selecting).removeClass("ui-selecting");
            }
            if( $(".ui-selected")) {
                    $("#editbtn").prop("disabled", false);
            }
      },
      stop: function() {
                    var result = $( "#select-result" ).empty();
                    $( ".ui-selected", this ).each(function() {
                            result.html('<input type="hidden" id="clientid" name="clientid" value="'+$(this).attr("id")+'">');
                    });
            }
});
$("ol li").on("dblclick", function() {
    alert("hey man!");
    var client_id = $("#clientid").val();
    window.location = "client?client_id="+client_id+"&user_id=$user_id";
});
});

I do a few things here as I'm sure you can see... I prevent lassoing and selecting multiple records, and on select I throw the ID selected into a hidden input so I can use the id in a redirect both with jQuery and with Perl.

The new piece I've added at the bottom is the double click. I started with $('#selectable').dblclick and it worked perfectly in FF. Then I tested it in IE9 since that's what the users use and the double click doesn't fire at all.

I changed it to $('body').dblclick to make sure I wasn't crazy and of course the alert fired in IE9. And, twice now, by randomly double clicking records like a crazy man I've gotten the dblclick event to fire in IE9. It's almost like it is hidden behind the selectable event. I messed around with distance: 1, which actually caused the doubleclick event to fire in IE9, but then it prevents me from actually selecting a record and therefore the id is undefined.

Thanks in advance for the help. me=newbie.

Was it helpful?

Solution

Well, I did look in a lot of places before making the above post. Laughably, one of the first posts I looked at contained the answer and I just didn't pick up on it.

I basically added: cancel: '.ui-selected' within .selectable({

as directed here: How to enable dblclick event on elements which was binded with JQuery UI Selectable plugin?

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