We Keep Coding

Trying to get a correct url output

I am kinda new to asp.net mvc website with jquery, razor, javascript and html. Right now my actionlink has a problem where I cannot insert the filter part, into ..page/?sortMethod=StartDate
filters?=pending generates from a button (pending is just 1 of the many status)
?sortMethod=StartDate generates from actionlink.
I am trying to make them work together to get:
..page/?filters?=pending&sortMethod=StartDate
I tried to do a script that tries to replace the
This is the initial code, sortMethod is a string.
<script>
$(function () {
$("#filterUidClear").click(function () {
$("#filterUid").val('');
});
$('#filterPending').checkboxradio();
$('#filterDirect').checkboxradio();
$('#ApplyFilter').click(function () {
var params = "";
if ($('#filterPending')[0].checked) {
params = "filters=pending";
}
if ($('#filterDirect')[0].checked) {
if (params !== "") {
params = params + "&";
}
params = params + "filters=direct";
}
$("#param").val("?" + params);
window.location.href = "?" + params;
});
});
</script>
#Html.ActionLink("Leave Date", "Index", new { sortMethod = ViewBag.StartDate })
This is the new modified one
#Html.ActionLink("Leave Date", "Index", new { sortMethod = ViewBag.StartDate }, new { id = action })
<script>
$(function() {
$('#action').click(function() {
var filterparam = $("#param").val();
this.href = this.href + '?filters=' + encodeURIComponent(filterparam) + '&sortMethod=' + #ViewBag.StartDate;
});
</script>
I am trying to make them work together to get:
..page/?filters=pending&sortMethod=StartDate but to no avail.
The table will display filtered with pending results and sorted by date
Right now it displays ..page/?action&sortingMethod=StartDate
the table shows sorted by date but no filter and action is not being replaced by filter type e.g. ?filters=pending

How can add parameters to href url when click on tag a?

I want From home page send parameter id to carts page:
This is current code, but it not woking:
detail
<script>
function addParam()
{
var url = window.location.href;
var listId = localStorage.getItem('IDs', '');
url=url+ "?id=" +listId;
window.location.href = url;
}
</script>
How can add parameters to href url when click on tag a?

Either just override it by grabbing the element's (here done by passing this to the function) href
detail
<script>
function addParam(el)
{
var listId = localStorage.getItem('IDs', '');
window.location.href = el.href + "?id=" +listId;
}
</script>
Or append it to the element's href
detail
<script>
function addParam(el)
{
var listId = localStorage.getItem('IDs', '');
el.href += "?id=" +listId;
}
</script>

How can I add a parameter to my url, without reload the page?

I have this url http://localhost:1234/pag1
I want to be like below when I click on the div:
http://localhost:1234/pag1?fare=standar
and I have an onclick event function:
<div id="" onclick="addUrl();"> </div>
And the js code:
<script type="text/javascript">
function addUrl() {
var url = window.location.href;
window.location.hash = '?fare=standar';
};
</script>
This give me this result:
http://localhost:1234/pag1#?fare=standar
And I don't Know how to remove the (#). I only need to add the parameter to the url, without refresh the page.
Suggest me! Thank's.

Use window.history.pushState( {} , '', '?fare=standar' );
This should update the url without refresh.
You can also do a bit of reseach on pushState as the implementation can differ.

window.location.hash always put "#" in url
you can use to push paramter in url by using this function
function setGetParameter(paramName, paramValue)
{
var url = window.location.href;
if (url.indexOf(paramName + "=") >= 0)
{
var prefix = url.substring(0, url.indexOf(paramName));
var suffix = url.substring(url.indexOf(paramName));
suffix = suffix.substring(suffix.indexOf("=") + 1);
suffix = (suffix.indexOf("&") >= 0) ? suffix.substring(suffix.indexOf("&")) : "";
url = prefix + paramName + "=" + paramValue + suffix;
}
else
{
if (url.indexOf("?") < 0)
url += "?" + paramName + "=" + paramValue;
else
url += "&" + paramName + "=" + paramValue;
}
window.location.href = url;
}
i hope this will helpful to you

Try this
HTML
<div onclick="addUrl()"> </div>
Javascript
<script type="text/javascript">
function addUrl() {
var url = window.history.pushState( {} , '', '?fare=standar' );
</script>
Quick Explanation : When user clicks on div, URL will update without refreshing the page.
Hope this will work for you,
thank you :-).

Try this
var myURL = document.location;
document.location = myURL + "?a=parameter";
Or
location.hash = 'a=parameter'
Or without reloading the page
window.history.pushState("object or string", "Title", "new url");
Or without reloading the page
window.history.replaceState(null, null, "/another-new-url");

Why dont you use jQuery? I prepared sample like here in JsFiddle:
$("#clickableDiv").click(function(){
var url = "http://localhost:1234/pag1";
var parameter = "fare=standar";
$("#AppendUrl").text(url+ "?" + parameter);
});

Variables in function to use in jquery

I'm not sure how to get this to work so that it takes the variable from the getrandomvideos and uses it in the jquery statement. I want the user to press a button then have a name randomly chosen then submited to the jquery statement which would then format the JSON that is returned.
<!doctype html>
<html>
<head>
<title>Trove Basic Search</title>
<meta charset="utf-8">
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
</head>
<body>
<h2>Search Trove</h2>
<button type="submit" id="searchbtn">Search</button>
<hr />
<div id="output">
<h4>Search Results</h4>
</div>
<script type="text/javascript">
function getRandomVideo() {
var searches = [
'beethoven',
'mozart',
'beethoven',
'debussy',
]
var rand = Math.floor(Math.random()*videos.length);
var search = searches[rand];
return search
}
var apiKey = "jja10ssv4950uh65";
var searchTerm = getRandomVideo();
$(document).ready(function(){
// There is an issue with TROVE applications where the first search will result in nothing being returned
// To get around this, we perform a dummy submit. Not sure how to do this
$("#searchbtn").submit
$("#searchbtn").submit(function() {
var url = "http://api.trove.nla.gov.au/result?key=" + apiKey + "&encoding=json&zone=newspaper&sortby=relevance&q=" + searchTerm + "&s=0&n=5&include=articletext,pdf&encoding=json&callback=?";
console.log(url);
$.getJSON(url, function(data) {
$('#output').empty();
$.each(data.response.zone[0].records.article, function(index, value) {
$("#output").append("<p>" + value.articleText +"</p>");
});
});
});
});
</script>
</body>
</html>

It could be better if you just put function inside ready function, and just use click function for your submit button like so :
$(document).ready(function(){
function getRandomVideo() {
var searches = [
'beethoven',
'mozart',
'beethoven',
'debussy',
];
// this should be searches.length
// var rand = Math.floor(Math.random()*videos.length);
var rand = Math.floor(Math.random() * searches.length);
var search = searches[rand];
return search
}
var apiKey = "jja10ssv4950uh65";
// just use click event
$("#searchbtn").click(function(e) {
// we disable default behavior of button
e,preventDefault();
// here we call the function every time submit button clicked
var searchTerm = getRandomVideo();
var url = "http://api.trove.nla.gov.au/result?key=" + apiKey + "&encoding=json&zone=newspaper&sortby=relevance&q=" + searchTerm + "&s=0&n=5&include=articletext,pdf&encoding=json&callback=?";
console.log(url);
$.getJSON(url, function(data) {
$('#output').empty();
$.each(data.response.zone[0].records.article, function(index, value) {
$("#output").append("<p>" + value.articleText +"</p>");
});
});
});
});

In the current implementation, you are getting the name on page load, and that will be used every single time. To change it every time user clicks.
Replace the line with:
var url = "http://api.trove.nla.gov.au/result?key=" + apiKey + "&encoding=json&zone=newspaper&sortby=relevance&q=" + searchTerm + "&s=0&n=5&include=articletext,pdf&encoding=json&callback=?";
Get a new video every time this is called
var searchTerm = getRandomVideo();
var url = "http://api.trove.nla.gov.au/result?key=" + apiKey + "&encoding=json&zone=newspaper&sortby=relevance&q=" + searchTerm + "&s=0&n=5&include=articletext,pdf&encoding=json&callback=?";

Try this code:
var url = "http://api.trove.nla.gov.au/result?key=" + apiKey + "&encoding=json&zone=newspaper&sortby=relevance&q=" + searchTerm + "&s=0&n=5&include=articletext,pdf&encoding=json&callback=?";

How to remove url variable, then replace with new url using jQuery

I have the code below that adds the lang variable to a url each time a flag is clicked. But I need to add an additional piece - I want to remove the previous lang variable first, before adding a new one.
Currently my code keeps adding on to the previous url variable. How can I fix this?
<script type="text/javascript">
jQuery(document).ready(function($) {
$("a.flag").on('click',function() {
var lang_prefix = $(this).attr("title");
window.location.href = window.location.href + '?lang=' + lang_prefix;
});
});
</script>

If lang is the only query parameter you're using...
<script type="text/javascript">
jQuery(document).ready(function($) {
$("a.flag").on('click',function() {
var lang_prefix = $(this).attr("title");
window.location.href = window.location.href.split('?')[0] + '?lang=' + lang_prefix;
});
});
</script>