Question

In Firefox only, if I highlight text and drop it into the middle of an existing textfield I get an error message:

The URL is invalid and cannot be loaded.

I created a sample here http://jsfiddle.net/XtGdd/2/

Highlight the drag me text. Then click and drag it into the text of the input box.
– If I drop it after the input text, it will run fine.
– If I drop it inside the input text I get the error.

Does anyone know why this is happening and how to work around it?

What I am trying to do is to replace the value of the textfield by the one dropped. In this case, to clear the field and replace with the dropped text.

Answer 1

I have found a solution I put in http://jsfiddle.net/XtGdd/12/ thanks from this question

$('#text_input_')
    .bind("dragover", false)    #=> for Chrome to catch the drop event;
    .bind("dragenter", false)   #=> for Chrome to catch the drop event;
    .bind('drop', function(e){  #=> Cancel the drop and just set the value directly;
        $('#text_input_').val(e.originalEvent.dataTransfer.getData("text/plain"));
        return false;
});

I don’t really feel safe with it but at the moment, that is the only thing I found.