Paste a treated text where the pointer is

Question

I have the following problem:

Some people in my work copy texts of some words and paste in forms which I do (inside the GED), but sometimes in this copy and paste it take with the text some invalid characters, for example those quotation marks: "

I had the idea to capture the necklace, treat it and then paste the treaty text. Follows the code:

$(document).ready(function(){
	var clipboardData, pastedData;
	$(":input").on("paste", function (e) {
            e.preventDefault();
			clipboardData = e.clipboardData || window.clipboardData;
    		pastedData = clipboardData.getData('text');
			// smart single quotes and apostrophe
			pastedData = pastedData.replace(/[\u2018\u2019\u201A]/g, "\'");
			// smart double quotes
			pastedData = pastedData.replace(/[\u201C\u201D\u201E]/g, "\"");
			// ellipsis
			pastedData = pastedData.replace(/\u2026/g, "...");
			// dashes
			pastedData = pastedData.replace(/[\u2013\u2014]/g, "-");
			this.value += pastedData;
	});
});

I used at the time of pasting after treating the "value +=" however in this case, whenever someone put the pointer in the middle of a text already typed, it will ignore where the pointer is and will "paste" the contents of the treatise at the end of the text. How can I put the contents of the treated Paste where the pointer is?

Answer 1

You’ll need to work with Selection Ranges.

Here this function will insert the values from the pointer position:

function insertAtCursor(myField, myValue) {
    //IE support
    if (document.selection) {
        myField.focus();
        sel = document.selection.createRange();
        sel.text = myValue;
    }
    //MOZILLA and others
    else if (myField.selectionStart || myField.selectionStart == '0') {
        var startPos = myField.selectionStart;
        var endPos = myField.selectionEnd;
        myField.value = myField.value.substring(0, startPos) +
            myValue +
            myField.value.substring(endPos, myField.value.length);
    } else {
        myField.value += myValue;
    }
}

Now replace this.value += pastedData; for insertAtCursor(this, pastedData); in your script.

Source: https://stackoverflow.com/questions/11076975/insert-text-into-textarea-at-cursor-position-javascript#Answer-11077016

Answer 2

Apparently I was able to find a solution to the problem:

$(document).ready(function(){
	var clipboardData, pastedData;
	$(":input").on("paste", function (e) {
		e.preventDefault();
		clipboardData = e.clipboardData || window.clipboardData;
		pastedData = clipboardData.getData('text');
		var hist = pastedData;
		// smart single quotes and apostrophe
		pastedData = pastedData.replace(/[\u2018\u2019\u201A]/g, "\'");
		// smart double quotes
		pastedData = pastedData.replace(/[\u201C\u201D\u201E]/g, "\"");
		// ellipsis
		pastedData = pastedData.replace(/\u2026/g, "...");
		// dashes
		pastedData = pastedData.replace(/[\u2013\u2014]/g, "-");
		//alert(pastedData+" != "+hist);
		if (document.selection) {
			//For browsers like Internet Explorer
			this.focus();
			var sel = document.selection.createRange();
			sel.text = pastedData;
			this.focus();
		}else if (this.selectionStart || this.selectionStart == '0') {
			//For browsers like Firefox and Webkit based
			var startPos = this.selectionStart;
			var endPos = this.selectionEnd;
			var scrollTop = this.scrollTop;
			this.value = this.value.substring(0, startPos)+pastedData+this.value.substring(endPos,this.value.length);
			this.focus();
			this.selectionStart = startPos + pastedData.length;
			this.selectionEnd = startPos + pastedData.length;
			this.scrollTop = scrollTop;
		} else {
			this.value += pastedData;
			this.focus();
		}
	});
});

Source: https://stackoverflow.com/questions/946534/insert-text-into-textarea-with-jquery