Pressing ENTER in <textarea> to break a line

Question

I consider myself a beginner in web development, and I am facing some issues with entering line-breaks in textarea.

My code looks like the following (pure javascript)

function upldNot(){ 
    xhttp = new XMLHttpRequest();
    var d = document.getElementById("textarea-input").value;

    d = d.replace(/(\n|\r\n)/g, "<br>$1");   // added this line to break lines

    xhttp.onreadystatechange = function(){
        if(this.readyState == 4 && this.status == 200){
            document.getElementById("output").innerHTML = this.responseText;
        }
    };
    xhttp.open("GET","upload_not.php?d="+d, true);
    xhttp.send();
}

My purpose is to send the input data from the textarea to a php.file that is uploading it to the database, and then display all the rows from the table. (This works perfectly)

Also, when the input data contains an "enter", it must be read as a line break. My code works in IE perfectly, but not in Chrome. Chrome returns the following message:

[Deprecation] Resource requests whose URLs contained both removed whitespace (\n, \r, \t) characters and less-than characters (<) are blocked. Please remove newlines and encode less-than characters from places like element attribute values in order to load these resources. See https://www.chromestatus.com/feature/5735596811091968 for more details.

I am not even sure about that what it means exactly. Could you please give me a hand with tips, or other solutions that is supported by most of the browsers?

Many thanks, and really sorry for this silly question.

Answer 1

The content you are adding to you url contains html elements <br/>, and according to the chrome error it doesn't allow such content in a url request sent from the browser.

You can try encodeURI(d) before adding it to the url.

xhttp.open("GET","upload_not.php?d="+encodeURI(d), true);