How to escape "&" ampersand character in form input using jQuery - php

I have a problem with my jQuery script that send data via POST method. The problem is whenever it sends data via Ajax that has an "&" ampersand in the sentence, it will cut the sentence when found "&".
Please check the images below for more info.

htmlentites
This function is identical to htmlspecialchars() in all ways, except with htmlentites(), all characters which have HTML character entity equivalents are translated into these entities.
If you're wanting to decode instead (the reverse) you can use html_entity_decode().
Example:
echo htmlentities("&"); // &
if your directly doing this in the browser you should be able to use:
encodeURIComponent(string input);
Example:
encodeURIComponent($.trim($("input[name=t-tim_rendered-"+id+"]").val().toString()));

I've been having a huge problem exactly with this situation.
This is just to say that the last answer from Andrew Koester is the perfect answer I was looking for.
In case you are passing multiple form entries from a jQuery form to PHP through the .ajax() call like this:
data: "name=" + name + "&message=" + message + ...
DON'T USE THIS METHOD, it will block the ampersand(&) character from being written by the user on any of the input fields of your form.
Use this one instead as suggested by Andrew:
data: {"name": name, "email": email, "subject": subject, "comments": comments},
This way the user can write any kind of special character whithout worrying a about conflicting with the ajax declaration.

You can use a native javascript escape() function
In line 74
data: : "&task_d=" + escape(task_d) + ""
Alternatively, you could enclose your query string values in quotes
data: : "&task_d='" + task_d + "'"

If you pass your data parameter as a Javascript object, it will convert the characters for you (and IMO make the code look neater). So you should change your $.ajax call to the following:
data: {"user_id": user_id, "time_r": time_r, "task_d": task_d, "p_id": p_id, "df": finished},

You could use 'encodeURIComponent' to accomplish the URL encoding for that component. I used this and validated with browsers IE, Firefox, and Chrome.

Related

$_POST, $_GET unescape escaped query characters

I have a search field where users paste URLs (url is the search query). Most urls work fine, but urls with escaped characters are getting 'unescaped'. For example :
When I copy some url from Chrome browser I get escaped url:
url = input query : 'http://website.com/search/my%20query'
echo $_POST['q'] ~ result is 'http://website.com/search/my query'
The query is submitted by $.ajax :
var qurl = $("#url input[name=q]").val();
var queryString = "q="+qurl;
$.ajax({
url : "script.php",
type: "POST",
data: queryString,
.....
How can I receive the query with the escaped characters ?
Should I bother and process(escape the query of my query) the query url myself?
Magic quotes you are off:
php.ini
magic_quotes_gpc=Off
magic_quotes_runtime=Off
magic_quotes_sybase=Off
Your question is a bit short on detail so, unfortunately, there is a fair bit of speculation in this answer:
The % in %20 should be encoded as %25 (giving %2520) when the data is submitted.
PHP will then decode it to give you %20 in $_POST.
I've never heard of PHP double decoding the data before. So it sounds like the problem is that whatever is making the request is failing to encode the data. This is most likely caused by not using a regular form to submit it and using JavaScript instead.
The solution therefore, is to encode it properly in the JavaScript.
For example:
data = "query=" + encodeURIComponent( document.getElementById('myInput').value );
Update in response to JavaScript being added to the question:
var qurl = $("#url input[name=q]").val();
var queryString = "q="+qurl;
My earlier speculation is confirmed. You haven't encoded the data into the correct format for a query string. Since you are using jQuery.ajax, you can use that to handle your encoding (by passing it an object of data) instead of building the query string manually (and then passing a string):
$.ajax({
url : "script.php",
type: "POST",
data: {
q: $("#url input[name=q]").val()
},

The & is not allowed for my new password

I have a window on my site where the visitors can change them password.
The problem is that the & character is never taken :
If I put those two new passwords :
stack&
stack& (the second is the confirmation)
The insertion in the BD is stack (without the &).
This is the js code :
data: 'nouveau_mdp=' + $('input#champ_nouveau_mdp').val(),
the alert shwos me "stack&"
In PHP, a var_dump of $_POST gives me :
stack (without the &).
Is & a reserved word for jquery ?
This is my js code :
$.ajax({
type: 'POST',
url: 'modification_mdp.php',
data: 'nouveau_mdp=' + $('input#champ_nouveau_mdp').val(),
dataType: 'text',
success: function(reponse) {
reponse = $.trim(reponse);
Have you an idea to reselove this problem please ?
Thanks in advance.
Encode the field value
data: 'nouveau_mdp=' + encodeURI($('input#champ_nouveau_mdp').val()),
by this way & is encoded with the ascii number.
Try passing an associative array, which jQuery will encode for you:
data: { nouveau_mdp: $('input#champ_nouveau_mdp').val() }
You'll need to change the PHP code that receives this value to match (it gets an array rather than a string).
The ampersand character is not allowed to pass by Get method or by Post method in PHP. As the usual syntax to access the PHP by GET method is ines.php?user=username&password=mypassword,
the '&' character separates the two Variables.
That is why it is does not take '&' from 'Stack&' You may use Javascript to Validate if & is not entered in the text Box. Use JavaScript to encode the varaible... No decoding is required at the PHP end
encodeURIComponent("stack&")
This line is the problem:
data: 'nouveau_mdp=' + $('input#champ_nouveau_mdp').val(),
The & character has a special meaning in HTTP. If you had multiple parameters they would be separated by & e.g. nouveau_mdp=mynewpassword&old_mdp=myoldpassword
What you need to do is encode characters such as &, = etc as their hex equivalents i.e. %26 and %3D respectively.
In JavaScript you can do this with the encodeURI() function.
Though, as mentioned in the other answer, jQuery also allows you to pass a JSON dictionary of parameters, and it will do the encoding for you.

preserve html post data in php with javascript

I'm writing a php script that takes some c code and tests it against a few test cases.
But since the source code can have single and double quotes along with slashes, my script doesn't get the entire data when passed via a textarea. I'm posting using the .ajax method of jQuery
When I tried, here's what happens
$code_string = $_POST['code'];
echo $code_string;
the input is
int a,b;
scanf("%d%d",&a,&b);
printf("%d",a+b);
The jQuery code that posts the data is
$('#submitButton').click(
function(evt){
userCode = $('#answer').val();
$.ajax({
type : 'POST',
url : 'scripts/php/check_answer.php',
data : 'code=' + escape( userCode ),
dataType : 'text',
success : populateResponseToQuestion
});
evt.preventDefault;
});
and the output is
int a,b;
scanf("%d%d",&a,&b);
printf("%d",a b);
I want to be able to pass the data to php without anything being trimmed off. In this case the + symbol is lost. With more code, I realize more stuff would be lost or modified.
Your post data is preserved, but if you want it display correctly in HTML document you have to use <br> for new lines, so function nl2br will be helpful. You should also use htmlspecialchars or mentioned earlier htmlentities to avoid problems when posting code with < character (it can be interpreted as opening HTML tag).
[+]
As for JavaScript part, you are doing it wrong. Either use encodeURIComponent() instead of escape() or pass object to the $.ajax:
$.ajax({
type : 'POST',
url : 'scripts/php/check_answer.php',
data : { "code" : userCode },
dataType : 'text',
success : populateResponseToQuestion
});
This way jQuery will handle it for you.
htmlentities is what you're looking for.
<textarea><?php echo htmlentities($code, ENT_QUOTES, "UTF-8") ?></textarea>
You could try:
echo htmlentities($code_string);

Quotes Problem When Returning Data From PHP Script To Be Handled With JQuery/JS

Here's my problem. I have data being returned using JSON, AJAX from my php script to my page. The data is being stored in a variable data
Using the variable data, I'm trying to construct a div using javascript. However, if the data contains a single quote, it break my js code and the page script doesn't work.
example code with data being the variable containing data "The boy's bicycle":
var newrootcomment = $("<div id='container'>" + data + "</div>");
newrootcomment.prependTo($('#wholecontainer')).hide().fadeIn(300).slideDown(1000);
How do I solve this problem?
Are you using the json_encode function available in PHP? Are are you treating the response as JSON? jQuery.parseJSON(<json-string>).
From there you interact with it simple as an object.
var resp = {};
If you don't have jQuery, most browsers support JSON.parseJSON().
Also, make sure you use double quotes for attributes.
<div id="foo"></div>
This is normally how I use json_encode:
$resp = array(
"foo"=>"foo_value",
"bar"=>"bar_value",
"foo_bar"=>array("one","two",3),
"message"=>"AWesome"
)
return json_encode($resp)
Take a look at json_encode for PHP - it'll return a quoted string with JSON-safe characters - it'll escape entities like \n, \, ". etc
Edit
Note that a single quote in JSON is not required to be escaped since it surrounded by double quotes.
From what you said in a comment to #jbcurtin's answer, about your PHP code being echo json_encode('{ "author": "'.$author.'"}'); I'd say that that is one problem. You don't need to encode the entire string, only the author variable. That line should be echo '{"author": '. json_encode($author) . '}'; instead.

How can I use ajax to post message through a url and still keep line breaks?

Here is a sample of the javascript/ajax on PAGE A:
var commReq = getXmlHttpRequestObject();
function AddComment(Comment){
if (commReq.readyState == 4 || commReq.readyState == 0){
commReq.open("GET", '/receiveComment.php?com='+Comment+'&' + Math.random(), true);
commReq.onreadystatechange = handleComment;
commReq.send(null);
}
}
Now the php page that receives the comment (receiveComment.php) PAGE B:
$Comment = mysql_real_escape_string(preg_replace("/[^A-Za-z0-9_,.!#:'\"\/\n ]/","", $_GET['com']));
mysql_query("INSERT INTO Comments (Comment,Date) VALUES ('$Comment','$Date')");
Obviously these are just sample cuts but from 2 pages. Page B doesn't ever get seen since its through ajax that I'm using to store the comment. But I want to be able to store line breaks that a user may insert in the textarea box. Any help or recommendations would be greatly appreciated!
Use encodeURIComponent
commReq.open("GET", '/receiveComment.php?com='+encodeURIComponent(Comment)+'&' + Math.random(), true);
You'll still need to encode for POST (credit to agrothe)
commReq.open("POST", '/receiveComment.php?' + Math.random(), true);
commReq.onreadystatechange = handleComment;
commReq.setRequestHeader("Content-Type", "multipart/form-data");
commReq.send('com=' + encodeURIComponent(Comment));
Within your preg_replace() function call, within the first argument, you're searching for \n and replacing it with nothing. This is most likely the cause of your problem, as \n represents a linebreak because it is surrounded in double quotes.
I'd try removing "\n" from your preg_replace() function.
If it was a single quote, it would not interpret the \n as a line break, but would take it for its face value.
And FYI, passing information via GET does NOT strip out line breaks in jQuery. In older browsers, GET it does limit the URL being requested to 255 characters though (pre Firefox 1 and IE 6 days though) while POST supports an unlimited size.
Use POST instead of GET. Or URL encode the comment for the GET method.
I think POST would serve you better if you want to preserve line breaks and such.

Categories