Get query strings and append to link - javascript

JavaScript novice, thanks in advance.
I'd like to get the the full string of query parameters and append them all to a link in the body. The link in the body will send the user to a registration website so I'd need those query strings to carry over to the next site. I'm thinking this would be the best way to do it, if not, please advise.
Example: http://example.com?utm_source=Twitter&utm_medium=HostedEvent&utm_campaign=Event2015
I'd like go grab ?utm_source=Twitter&utm_medium=HostedEvent&utm_campaign=Event2015 and add it to a link in the body
Link: Register

Assuming the link in the html link does not have other parameters and that you add a class to it so we can target it
Register
Then you need the following script
$(function(){
var urlparams = window.location.search;
$('.copy-url-params').prop('href', function(idx, current){
return current + urlparams;
});
});

Related

Get only a paragraph from http response [duplicate]

I'm looking for a way to get a HTML element from a string that contains HTML. Is it possible to use a jQuery selector to do this?
I have a Javascript function that gets an entire page from the server, but I only need one element from that page.
Yes, you can turn the string into elements, and select elements from it. Example:
var elements = $(theHtmlString);
var found = $('.FindMe', elements);
Just wrap the html text in the $ function. Like
$("<div>I want this element</div>")
If you are loading a page dynamically from a server then you can target just one element from the loaded page using the following form with .load()
$(selectorWhereToShowNewData).load('pagePath selectorForElementFromNewData');
For example:
$('#result').load('ajax/test.html #container');
Where:
#result is where the loaded page part will be displayed on the current page
ajax/test.html is the URL to which the server request is sent
#container is the element on the response page you want to display. Only that will be loaded into the element #result. The rest of the response page will not be displayed.
Just use $.filter
var html = "<div><span class='im-here'></span></div>"
var found = $(html).filter(".im-here")
You can use $.find
$(document).ready(function() {
var htmlVal = "<div><span class='im-here'>Span Value</span></div>";
var spanElement = $(htmlVal).find("span");
var spanVal = spanElement.text();
alert(spanVal);
});

I can't grab specific URL in search page

I enter the estate website and searched by name of the city. After that I want to grab Osaka City building URL. In here http://brillia.com/search/?area=27999 There are four of those. 
And I m using that link to grab URL.
$allDivs = $parser->getElementsByTagName('div');
foreach ($allDivs as $div) {
if ($div->getAttribute('class') == 'boxInfomation') {
$allLinks = $div->getElementsByTagName('a');
foreach ($allLinks as $a) {
$linkler[] = $a->getAttribute('href');
}
}
}
But I cant grab those. Actually I grabbed not just osaka city pages URL actually grabbed all of it. When I try to see the source the osaka page site. It shows http://brillia.com/search/ Thats why I m grabbing all other links...
But how can I grab just URLs in here -> http://brillia.com/search/?area=27999
Any idea? Thank you.
Can you do this by using jQuery? in that case this grab the a href
$("div h3 a").each(function(){
var link = $(this).attr("href");
console.log(link);
});
here a jsfiddle test
The parser relies on libxml to extract elements but that page is using html5 heavily, ommiting certain close tags, etc and that isn't really strict xml, so it's struggling to "correct mistakes" by guessing where to close missing tags, returning wrong results.
You need a parser with html5 support like HTML5DOMDocument that extends DOMDocument and should have mostly the same interface.

How to set a custom href into a button when onClick?

I have a URL
http://localhost:8080/BIM/teacher/reports/section-exercise/assignment?x=1&y=2&z=3
I have 2 btns
I'm not sure how would I bind those 2 btn to the correct URL.
If the Remediation is clicked, I want to set the href to
http://localhost:8080/BIM/teacher/reports/section-exercise/remediation?x=1&y=2&z=3
The only different is the 4th segment, the rest stay the same.
Any helps / suggestions on them will be much appreciated !
I guess - I might have to :
grab the whole URL
re-construct the newURL, store it in a variable
bind that newURL to my btn.
I hope I'm in the right track for this.
Let me know if you guys, notice something.
Here you can change the URL to what ever you like.
I am using Replace fucntion to change the URL on the fly
var url='http://localhost:8080/BIM/teacher/reports/section-exercise/assignment?x=1&y=2&z=3'
$('button1').click(function() {
$(this).attr('href', url);
});
$('button2').click(function() {
$(this).attr('href', url.replace('assignment','remediation');
});
$(/*remediation button selector*/).click(function() {
$(/*assignment performance button selector*/).attr('href', 'http://localhost:8080/BIM/teacher/reports/section-exercise/remediation?x=1&y=2&z=3');
});
I'm not sure if you meant you want the Remediation button to change the href for the first button, or if you want them to just have different hrefs; if it's the latter, they can just have the different hrefs directly in the HTML, no JS needed.
Aminas answer is good, but in case the first URL isn't always the same I would recommend this function (using Regex) to change only the file name of an URL:
function changeFileName(strURL, strNewName) {
return strURL.replace(/[^\/?]*(?=\?|$)/, strNewName);
}
This (a) works no matter what the original file name was, and (b) won't cause problem if the path contains the file name.

jQuery Make a Link in Active Status

I am working on a HTML template, but I cannot touch the HTML code, I can only work on CSS and JS files. So I cannot in any way edit the HTML code.
What I am trying to achieve is to put some links in active status when jQuery or Javascript recognizes that the current page URL is the same one of the link I want to put in active status, without editing the HTML code.
Is there a way to do it? I tried in many ways but with no luck.
Here is the HTML code ( Remember I cannot edit it ).
<span class="Tag_Nav_Aux">
Create Account
|
Login
|
My Cart
</span>
The jQuery or Javascript code should work on different links, other than the ones I reported above, since the HTML changes when the user is logged in or logged out.
So the jQuery should point the class Tag_Nav_Aux and add the Active class to any a tag it will find that has the link the same of the current URL.
You can do something like this. Your file name from the URL
var filename = window.location.href.substr(window.location.href.lastIndexOf("/")+1);
After that get the anchor from the navigation and apply some class.
$("span.Tag_Nav_Aux a[href*="+filename+"]").addClass('active');
Here you have to write a CSS active class which will make that link to appear like an active link.
Try this script
jQuery(function($){
$('.Tag_Nav_Aux a').filter(function(){
return $(this).attr('href').toLowerCase() === window.location.pathname.toLowerCase();
}).addClass('active');
});
and create a CSS rule for
.Tag_Nav_Aux a.active{
// style you want the active link to have
}
$(document).ready(function() {
var url = window.location.href.toLowerCase();
$(".Tag_Nav_Aux a").each(function() {
var $this = $(this);
var href = $this.attr("href").toLowerCase();
if(url.indexOf(href) > -1) {
$this.addClass("active");
}
});
});​
I think you need to check the current page url and assign a class to the item like to active.
I usually do putting class="active" based on current URL match with help of server side code.
But if you dont want server code you can do with help of JavaScript
var currentPage=window.location.href;
if(currentPage=="")
{
//logic to find and add a Class for the proper anchor tag
}

Links in javascript

I have some dynamically created links in my pages and what I need to do is when I click on the link, I should pass the name of the link to another page. So, please show me a way to accomplish this. Thanx in advance :)
If you are using jquery, you can use :
<html>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
foo bar
<script>
$('a').click(function () { alert($(this).text()); /* attr('href') */ });
</script>
</html>
Of course the html an so are not good, but the click thing is what you need.
Then you could use ajax, or a parameter in the target URL to give the link to the other page.
But why don't you generate that when creating links?
I mean add a href="mylink?from=mylink".
Edit: corrected with your comment. What you need is text() rather than attr('href').
document.getElementById('anchor').innerHTML;
then you can pass this value as a parameter, to another page.
documetn.getElementById("mylink").setAttribute("href", "newlink");
documetn.getElementById("mylink").InnerHTML = "new link name";
var link = document.getElementById('link');
link.setAttribute("href", link.getAttribute("href") + "?linkName=" + encodeURI(link.innerHTML));
This will make your link be something like this:
<a id="link" href="http://somewebsite.com?linkName=Name_of_the_link">Name_of_the_link</a>
Then on the "other" page you can access the link name through the GET variable linkName.

Categories