JQuery UI resizable can't cancel resize programmatically

Question

I have been trying to create a resizable div using JQuery UI which will also resize a table contained within the div.

$("#WorkRequests").resizable({
        minWidth: $("#WorkRequests").width(),
        maxWidth: $("#WorkRequests").width(),
        handles: 's',
        resize: function (event, ui) {
            var minRows = 10;
            var rowHeight = 35;
            var rows = $("#tbl-WorkRequests-page-size").val();

            if ((rows * rowHeight) > $("#WorkRequests").height()) {
                if (rows > minRows) {
                    $("tbl-WorkRequests-page-size").val((rows - minRows).toString());
                } else {
                    return false;
                }
            }
        }
    });

However when they resize the div to be too small so that it reaches "return false;" it does not cancel the resize event like with other JQuery ui things. Why?

Also the below line:

$("tbl-WorkRequests-page-size").val((rows - minRows).toString());

Should set the value of a select list, however it does not, why?

Hi Alex! Can you please post the html code for this. Thanks :) — Ian Jasper
– Ian Jasper, Commented Mar 1, 2011 at 6:12
It would be better if you could post the HTML as well. At least the relevant bits. If return false doesn't work, have you tried changing the minHeight value inside the resize method? This would hook jqueryUIs own check methods — JohnP
– JohnP, Commented Mar 1, 2011 at 16:00

torke1 · Accepted Answer · 2011-03-16 13:24:51Z

1

The short answer is: This is not possible because draggable is not correctly implemented. return false should stop the event, but unfortunately this is not correctly implemented for resizable.

answered Mar 16, 2011 at 13:24

torke1

3512 silver badges9 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Alex Hope O'Connor · Accepted Answer · 2011-03-07 23:23:20Z

0

Turns out on this line

$("tbl-WorkRequests-page-size").val((rows - minRows).toString());

I was missing the #, sorry guys, I should have posted the html.

$("#tbl-WorkRequests-page-size").val((rows - minRows).toString());

Thanks, Alex.

answered Mar 7, 2011 at 23:23

Alex Hope O'Connor

9,75322 gold badges73 silver badges113 bronze badges

Collectives™ on Stack Overflow

JQuery UI resizable can't cancel resize programmatically

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related