The following
code in javascript exchanges the displayed URL of a web page at runtime by
adjusting the parameter with an input field.
Javascript,
Browser URL, Parameter, Query
Javascript code:
|
function onValueChanged(e) {
var sValue =
document.getElementById('input_Field').value;
replace_Parameter_in_URL("parameter1",sValue);
}
function replace_Parameter_in_URL(parameterName,newValue)
{
//----<
replace_Parameter_in_URL() >----
//*replace
query-string parameter with new value
var url=location.href;
var re = new RegExp("([?&])" + parameterName + "=.*?(&|$)", "i");
var separator = url.indexOf('?') !== -1 ? "&" : "?";
var sNewUrl = "";
if (url.match(re)) {
sNewUrl= url.replace(re, '$1' + parameterName + "=" + newValue + '$2');
}
else {
sNewUrl = url + separator + parameterName + "=" + newValue;
}
//replace
URL
history.pushState({}, null,
sNewUrl);
//----</ replace_Parameter_in_URL() >----
}
|
Note:
Writing back to location.href or location.search always leads to a reload of
the page. Therefore, history.pushState exchanges the page URL.
|
@*format Grid in javascript
file *@
<script src="~/js/jsDemo.js"></script>
<form>
<div style="margin:10px;width:300px">
URL-Change
<input id="input_Field" type="text" onkeyup="onValueChanged()"/>
</div>
..
|
