Unable to extract post arguments after encodeURIComponent() - php

Question

I encoded a parameter string from the fields collected by a form using encodeURIComponent() and then sent it to the server using XMLHttpRequest.
In the server side PHP script I'm using extract(urldecode($_POST), EXTR_SKIP); to extract the parameters to variables.
Although the process was working fine before I added the encoding of the URI component, the variables are now not being extracted on the server. What am I doing wrong please?
This is the JavaScript which does the sending:
function postData(url, parameters, postprocess, displayURL, runOnError) {
// Check whether user action has already failed validation
if (typeof cancel !== 'undefined') {
// Deleting a variable only works if a global
delete cancel;
return false;
}
var
xmlHttp = AJAX(),
resp,
defcon,
json;
parameters = EncodeURIComponent(parameters);
if( url.charAt( 0 ) === '&' ) {
url = url.slice( 1 );
}
xmlHttp.onreadystatechange = function(){
if (xmlHttp.readyState == 4) {
resp = xmlHttp.responseText;
checkSessionTimeout(resp);
// REDIRECT TO POST-PROCESSORS
if (postprocess !== '') {
// Goto custom post processing function
eval(unescape(postprocess));
}
// Determine whether json response or not
else if ( resp.charAt( 0 ) == '{' ) {
// it's json so redirect to...
jsonGenericRespHandler(resp, displayURL);
} else {
// Use generic post process
/* The following is depreciated. We should
* be using jsonGenericRespHandler(resp).
*/
if (resp.toLowerCase().indexOf('error') > -1) defcon = 'error';
else if (resp.toLowerCase().indexOf('success') > -1) defcon = 'success';
else if (resp.toLowerCase().indexOf('warn') > -1) defcon = 'warn';
else defcon = 'info';
// Make sure we don't miss an important message.
if (defcon === 'warn' || defcon === 'error') {
alert(resp);
eval(runOnError);
} else {
// Redirect to dashboard
if (displayURL === '') {
ajaxLoader('main/home.php', 'contentMain');
} else if (displayURL !== 0) {
ajaxLoader(displayURL, 'contentMain');
}
showMessage(defcon, resp);
}
}
}
}
xmlHttp.open("POST", url, true);
xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlHttp.setRequestHeader("Content-length", parameters.length);
xmlHttp.setRequestHeader("Connection", "close");
xmlHttp.send(parameters);
}
I should probably mention that the reason I added encodeURIComponent() was because I noticed that if the visitor entered a legitimate ampersand in the form, it was being treated as an extra argument on the server.