EN
JavaScript - how to get url request parameters in JavaScript?
9
points
In JavaScript it is possible to get url request parameters using following logic.
Note: to see better how below example works copy code into your project.
1. Url request parameters logic example
index.htm file:
// ONLINE-RUNNER:browser;
<!doctype html>
<html lang="en">
<head>
<script>
// 'use strict';
(function (window) {
var PARAMETER_REGEX = /^([^=]+)(?:=(.*))?$/g;
function matchParameter(text) {
PARAMETER_REGEX.lastIndex = 0;
return PARAMETER_REGEX.exec(text);
}
function decodeComponent(part) {
if (part) {
return decodeURIComponent(part);
}
return null;
}
function parseParameters(search) {
var parameters = { };
var postfix = search.substring(1);
if (postfix) {
var parts = postfix.split('&');
for (var i = 0; i < parts.length; ++i) {
var part = parts[i];
if (part) {
var match = matchParameter(part);
if (match) {
var name = decodeComponent(match[1]);
parameters[name] = decodeComponent(match[2]);
}
}
}
}
return parameters;
}
window.RequestParameters = new function() {
var search = window.location.search;
var parameters = search ? parseParameters(search) : { };
this.getParameter = function getParameter(name, defaultValue) {
return parameters[name] || defaultValue;
};
this.getParameters = function getParameters() {
var result = [ ];
for (var key in parameters) {
result.push({ name: key, value: parameters[key] });
}
return result;
};
};
})(window);
</script>
</head>
<body>
<pre id="result"></pre>
<script>
function getAllRequestParameters() {
var parameters = RequestParameters.getParameters();
var result = '';
for (var i = 0; i < parameters.length; ++i) {
result += name + ': ' + value + '<br />';
}
return '------- ALL REQUEST PARAMETERS -------<br />' +
result +
'--------------------------------------<br />';
}
function getPaginationRequestParameters() {
var pageNumber = RequestParameters.getParameter('page-number', '1');
var pageSize = RequestParameters.getParameter('page-size', '20');
var pageOrdering = RequestParameters.getParameter('page-ordering', 'A-Z');
return 'page-number: ' + pageNumber + ', ' +
'page-size: ' + pageSize + ', ' +
'page-ordering: ' + pageOrdering +
'<br />';
}
var result = document.querySelector('#result');
result.innerHTML += getAllRequestParameters();
result.innerHTML += getPaginationRequestParameters();
</script>
</body>
</html>Example result:
