how to leave only the input of a dialog with the draggable disabled?

0

I have a function that makes the dialog get draggable enabled but I need to be able to edit an input within this dialog. How do I just make this input not inheriting draggable from parent dialog?

function to leave draggable enabled:

function addDraggable(identifier, cancel) { 
 $('.'+identifier).parent().draggable({
        cancel: cancel + ", :button"
    });
 focusInputText();

}

function focusInputText() { 
    $( 'input[type=text].urlCam' ).click(function(event) {
        event.preventDefault();
        $( this ).focus();
    });
}
    
asked by anonymous 28.11.2017 / 12:42

1 answer

0

Just add some selector for this input in the cancel property.

See an example:

$('#drag').draggable({
    cancel: '.dont-drag'
});
div {
  height: 400px;
  width: 400px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><scriptsrc="https://code.jquery.com/ui/1.12.1/jquery-ui.js"
  integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30="
  crossorigin="anonymous"></script>

<div id="drag" style="background-color: #CCC">

<input class="dont-drag" type="text">
<input type="text">
<button class="dont-drag">Botão 1</button>
<button>Botão 2</button>

</div>
    
28.11.2017 / 12:49