How to make the text box draggable using jQuery?

[Tesic Goran]

Is anybody there who has experience with making html input text box draggable using jQuery? I've tried to wrap text box inside div and can make it resizable, but not draggable. The div and text box are placed on standard jQuery UI dialog. Actually, I need both - draggable and resizable html input text box inside dialog. The code is as follows:

$(document).ready(function() {
    $("#btnShow").click(function(e) {
        $('#dialog').dialog("open");
    });
    $('#dialog').dialog({
        title: "Sample dialog",
        resizable: false,
        autoOpen: false,
        width: 400,
        height: 300,
        buttons: \[{ text: "OK", click: function() { /\* do something \*/ } },
            { text: "Cancel", click: function() { $(this).dialog("close") } }\]
    });
    $('#divText1').draggable({
        containment: "parent",
        cursor: "move"
    }).resizable({
        containment: "parent",
        handles: "e, w"
    });
});

<input id="btnShow" type="button" value="Show" />



    

        <input type="text" style="width: 98%;" value="Hello world!" />  

Thank you in advance. Goran

[Vitaly Tomilov]

http://jqueryui.com/demos/draggable/[^]

[ZurdoDev]

I haven't tested it but I believe the problem you are likely running into is that the textbox has input area so if you click that area and try to drag, you are in control of the textbox not the div. You need an element that you can drag, maybe put an image to the left of the textbox or something like that. But trying to drag inside a textbox will just highlight the text.

There are only 10 types of people in the world, those who understand binary and those who don't.