We Keep Coding

Splitting a URL by either of 2 different parts

Currently, my code splits the URL and removes anything after &7. How can I also make it check for |relevance at the same time and split by whichever one it sees?
$(document).ready(($) => {
const params = new URLSearchParams(window.location.search);
if (params.has("query")) {
const query = params.get("query").split('%7').pop();
$("#textfield").val(query);
}
});
I tried replacing
.split('%7').pop(); with .split('%7' || '|relevance').pop(); but that didn't work.

The or needs to be in regex format.
here is where you can test regex:
https://regex101.com/r/kQwpTN/1
const query = params.get("query").split(/%7|\|relevance/).pop();
Cheers!

How do I concatenate two strings in javascript?

I want to concatenate two string in angular 7.
the function is:
getEmployment(id: number): Observable<Employment> {
const url = '${this.EmploymentUrl}/${id}';
return this.http.get<Employment>(url).pipe(
tap(_ => this.log('fetched employment id=${id}')),
catchError(this.handleError<Employment>('getEmployment id=${id}'))
);
}
However, when I inspect element in my web browser it shows that {id} is not found.
If I replace the second line with the following it works just fine.
const url = this.EmploymentUrl + '/' + id;
After a lot of googling I can't figure out why the first method doesn't work. Why doesn't it work and what is the difference between the two methods?

You should use `` instead of quotes. more info here https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals
getEmployment(id: number): Observable<Employment> {
const url = `${this.EmploymentUrl}/${id}`;
return this.http.get<Employment>(url).pipe(
tap(_ => this.log(`fetched employment id=${id}`)),
catchError(this.handleError<Employment>(`getEmployment id=${id}`))
);
}

Beacuase you are using quote (') instead backtick (`)
getEmployment(id: number): Observable<Employment> {
const url = `${this.EmploymentUrl}/${id}`;
return this.http.get<Employment>(url).pipe(
tap(_ => this.log('fetched employment id=${id}')),
catchError(this.handleError<Employment>('getEmployment id=${id}'))
);
}

The answer was simply that I have to use backpacks (`) instead of single quotes (')
Like so:
const url = `${this.EmploymentUrl}/${id}`;

Or you can just do a simple string concat like
const url:string = this.Employment+'/'+id; // id will be converted into a string

How to send a string as a parameter of an API method through URL which contains '+' in Typescript

I am new to Angular 4. Here I am trying to pass a string to an API call .
Currently I just assigned the sequence of characters to a string variable and passed it to an API URL .
Here the problem is when I receive the string in API it loses the + in the string and each + is replaced by a space .
So how should I pass the string which has the + symbols in it to the API.
app.component.ts
var isValidString = "AhU29yCXdtoaNyQ8rhUBZMz0MieMNBTUaaA04hO+pGzd/iK01sQx6ckMi8LqCdyphShlBt9QhLtCizcUsy708eU90GD7Qg==";
this.CartdataService.validateString(isValidString).subscribe(data => {
console.log(data);
});
Here the string has a + in it ,which is not present when I receive it in my API function.
Angular.Service:
validateString(isValidString){
return this.http.get(this.validate_User_Password_URL = this.SERVER_URL+`/api/ECOMAPI/validateUserPassword/?mValidateString=${validateString}`);
}
In API
public async Task<HttpResponseMessage> validvalidateUserPassword(string myString)
{
if (myString) != " ")
{
.............
}
}
While debugging the myString the string has the space instead of +
Can anyone help me to fix this .

Have you tried url encoding the string and check if it works?
You can use encodeURIComponent() to encode special characters.
var isValidString = "AhU29yCXdtoaNyQ8rhUBZMz0MieMNBTUaaA04hO+pGzd/iK01sQx6ckMi8LqCdyphShlBt9QhLtCizcUsy708eU90GD7Qg==";
var encoded = encodeURIComponent(isValidString);
// then append the encoded one to the url instead of the original string

You can use the encodeURI and decodeURI
var encoded = encodeURI(uri);
Your code
var isValidString = encodeURI("AhU29yCXdtoaNyQ8rhU+pGzd/i......");
// now call the service method with above encoded string
Move to your API Code:
if (!string.IsNullOrEmpty(myString))
{
myString = HttpUtility.UrlDecode(myString);
// Rest of your code
}

I'm quite sure that if you use HttpParams instead of assembling the string by yourself, Angular does the encoding stuff for you. Something like this
let str = "adam+eve"
let params = new HttpParams().set("isValidString", str);
return this.http.get("http://foo.bar", {params}) as Observable<Any>
should result in a call to
http://foo.bar?validString=adam+eve

Javascript how to remove parameter from URL sting by value?

How to remove parameters with value = 3 from URL string?
Example URL string:
https://www.example.com/test/index.html?param1=4&param2=3&param3=2&param4=1&param5=3

If you are targeting browsers that support URL and URLSearchParams you can loop over the URL's searchParams object, check each parameter's value, and delete() as necessary. Finally using URL's href property to get the final url.
var url = new URL(`https://www.example.com/test/index.html?param1=4&param2=3&param3=2&param4=1&param5=3`)
//need a clone of the searchParams
//otherwise looping while iterating over
//it will cause problems
var params = new URLSearchParams(url.searchParams.toString());
for(let param of params){
if(param[1]==3){
url.searchParams.delete(param[0]);
}
}
console.log(url.href)

There is a way to do this with a single regex, using some magic, but I believe that would require using lookbehinds, which most JavaScript regex engines mostly don't yet support. As an alternative, we can try splitting the query string, then just examining each component to see if the value be 3. If so, then we remove that query parameter.
var url = "https://www.example.com/test/index.html?param1=4&param2=3&param3=2&param4=1&param5=3";
var parts = url.split(/\?/);
var params = parts[1].replace(/^.*\?/, "").split(/&/);
var param_out = "";
params.forEach(function(x){
if (!/.*=3$/.test(x))
param_out += x;
});
url = parts[0] + (param_out !== "" ? "?" + param_out : "");
console.log(url);

You could use a regular expression replace. Split off the query string and then .replace &s (or the initial ^) up until =3s:
const str = 'https://www.example.com/test/index.html?param1=4&param2=3&param3=2&param4=1&param5=3';
const [base, qs] = str.split('?');
const replacedQs = qs.replace(/(^|&)[^=]+=3\b/g, '');
const output = base + (replacedQs ? '?' + replacedQs : '');
console.log(output);

How to split a word for getting a specific value in Javascript or Jquery? [duplicate]

How do I get the last segment of a url? I have the following script which displays the full url of the anchor tag clicked:
$(".tag_name_goes_here").live('click', function(event)
{
event.preventDefault();
alert($(this).attr("href"));
});
If the url is
http://mywebsite/folder/file
how do I only get it to display the "file" part of the url in the alert box?

You can also use the lastIndexOf() function to locate the last occurrence of the / character in your URL, then the substring() function to return the substring starting from that location:
console.log(this.href.substring(this.href.lastIndexOf('/') + 1));
That way, you'll avoid creating an array containing all your URL segments, as split() does.

var parts = 'http://mywebsite/folder/file'.split('/');
var lastSegment = parts.pop() || parts.pop(); // handle potential trailing slash
console.log(lastSegment);

window.location.pathname.split("/").pop()

The other answers may work if the path is simple, consisting only of simple path elements. But when it contains query params as well, they break.
Better use URL object for this instead to get a more robust solution. It is a parsed interpretation of the present URL:
Input:
const href = 'https://stackoverflow.com/boo?q=foo&s=bar'
const segments = new URL(href).pathname.split('/');
const last = segments.pop() || segments.pop(); // Handle potential trailing slash
console.log(last);
Output: 'boo'
This works for all common browsers. Only our dying IE doesn't support that (and won't). For IE there is a polyfills available, though (if you care at all).

Just another solution with regex.
var href = location.href;
console.log(href.match(/([^\/]*)\/*$/)[1]);

Javascript has the function split associated to string object that can help you:
const url = "http://mywebsite/folder/file";
const array = url.split('/');
const lastsegment = array[array.length-1];

Shortest way how to get URL Last Segment with split(), filter() and pop()
function getLastUrlSegment(url) {
return new URL(url).pathname.split('/').filter(Boolean).pop();
}
console.log(getLastUrlSegment(window.location.href));
console.log(getLastUrlSegment('https://x.com/boo'));
console.log(getLastUrlSegment('https://x.com/boo/'));
console.log(getLastUrlSegment('https://x.com/boo?q=foo&s=bar=aaa'));
console.log(getLastUrlSegment('https://x.com/boo?q=foo#this'));
console.log(getLastUrlSegment('https://x.com/last segment with spaces'));
Works for me.

Or you could use a regular expression:
alert(href.replace(/.*\//, ''));

var urlChunks = 'mywebsite/folder/file'.split('/');
alert(urlChunks[urlChunks.length - 1]);

Returns the last segment, regardless of trailing slashes:
var val = 'http://mywebsite/folder/file//'.split('/').filter(Boolean).pop();
console.log(val);

I know, it is too late, but for others:
I highly recommended use PURL jquery plugin. Motivation for PURL is that url can be segmented by '#' too (example: angular.js links), i.e. url could looks like
http://test.com/#/about/us/
or
http://test.com/#sky=blue&grass=green
And with PURL you can easy decide (segment/fsegment) which segment you want to get.
For "classic" last segment you could write:
var url = $.url('http://test.com/dir/index.html?key=value');
var lastSegment = url.segment().pop(); // index.html

Get the Last Segment using RegEx
str.replace(/.*\/(\w+)\/?$/, '$1');
$1 means using the capturing group. using in RegEx (\w+) create the first group then the whole string replace with the capture group.
let str = 'http://mywebsite/folder/file';
let lastSegment = str.replace(/.*\/(\w+)\/?$/, '$1');
console.log(lastSegment);

Also,
var url = $(this).attr("href");
var part = url.substring(url.lastIndexOf('/') + 1);

Building on Frédéric's answer using only javascript:
var url = document.URL
window.alert(url.substr(url.lastIndexOf('/') + 1));

If you aren't worried about generating the extra elements using the split then filter could handle the issue you mention of the trailing slash (Assuming you have browser support for filter).
url.split('/').filter(function (s) { return !!s }).pop()

window.alert(this.pathname.substr(this.pathname.lastIndexOf('/') + 1));
Use the native pathname property because it's simplest and has already been parsed and resolved by the browser. $(this).attr("href") can return values like ../.. which would not give you the correct result.
If you need to keep the search and hash (e.g. foo?bar#baz from http://quux.com/path/to/foo?bar#baz) use this:
window.alert(this.pathname.substr(this.pathname.lastIndexOf('/') + 1) + this.search + this.hash);

To get the last segment of your current window:
window.location.href.substr(window.location.href.lastIndexOf('/') +1)

you can first remove if there is / at the end and then get last part of url
let locationLastPart = window.location.pathname
if (locationLastPart.substring(locationLastPart.length-1) == "/") {
locationLastPart = locationLastPart.substring(0, locationLastPart.length-1);
}
locationLastPart = locationLastPart.substr(locationLastPart.lastIndexOf('/') + 1);

var pathname = window.location.pathname; // Returns path only
var url = window.location.href; // Returns full URL
Copied from this answer

// Store original location in loc like: http://test.com/one/ (ending slash)
var loc = location.href;
// If the last char is a slash trim it, otherwise return the original loc
loc = loc.lastIndexOf('/') == (loc.length -1) ? loc.substring(0,loc.length-1) : loc.substring(0,loc.lastIndexOf('/'));
var targetValue = loc.substring(loc.lastIndexOf('/') + 1);
targetValue = one
If your url looks like:
http://test.com/one/
or
http://test.com/one
or
http://test.com/one/index.htm
Then loc ends up looking like:
http://test.com/one
Now, since you want the last item, run the next step to load the value (targetValue) you originally wanted.
var targetValue = loc.substr(loc.lastIndexOf('/') + 1);
// Store original location in loc like: http://test.com/one/ (ending slash)
let loc = "http://test.com/one/index.htm";
console.log("starting loc value = " + loc);
// If the last char is a slash trim it, otherwise return the original loc
loc = loc.lastIndexOf('/') == (loc.length -1) ? loc.substring(0,loc.length-1) : loc.substring(0,loc.lastIndexOf('/'));
let targetValue = loc.substring(loc.lastIndexOf('/') + 1);
console.log("targetValue = " + targetValue);
console.log("loc = " + loc);

Updated raddevus answer :
var loc = window.location.href;
loc = loc.lastIndexOf('/') == loc.length - 1 ? loc.substr(0, loc.length - 1) : loc.substr(0, loc.length + 1);
var targetValue = loc.substr(loc.lastIndexOf('/') + 1);
Prints last path of url as string :
test.com/path-name = path-name
test.com/path-name/ = path-name

I am using regex and split:
var last_path = location.href.match(/./(.[\w])/)[1].split("#")[0].split("?")[0]
In the end it will ignore # ? & / ending urls, which happens a lot. Example:
https://cardsrealm.com/profile/cardsRealm -> Returns cardsRealm
https://cardsrealm.com/profile/cardsRealm#hello -> Returns cardsRealm
https://cardsrealm.com/profile/cardsRealm?hello -> Returns cardsRealm
https://cardsrealm.com/profile/cardsRealm/ -> Returns cardsRealm

I don't really know if regex is the right way to solve this issue as it can really affect efficiency of your code, but the below regex will help you fetch the last segment and it will still give you the last segment even if the URL is followed by an empty /. The regex that I came up with is:
[^\/]+[\/]?$

I know it is old but if you want to get this from an URL you could simply use:
document.location.pathname.substring(document.location.pathname.lastIndexOf('/.') + 1);
document.location.pathname gets the pathname from the current URL.
lastIndexOf get the index of the last occurrence of the following Regex, in our case is /.. The dot means any character, thus, it will not count if the / is the last character on the URL.
substring will cut the string between two indexes.

if the url is http://localhost/madukaonline/shop.php?shop=79
console.log(location.search); will bring ?shop=79
so the simplest way is to use location.search
you can lookup for more info here
and here

You can do this with simple paths (w/0) querystrings etc.
Granted probably overly complex and probably not performant, but I wanted to use reduce for the fun of it.
"/foo/bar/"
.split(path.sep)
.filter(x => x !== "")
.reduce((_, part, i, arr) => {
if (i == arr.length - 1) return part;
}, "");
Split the string on path separators.
Filter out empty string path parts (this could happen with trailing slash in path).
Reduce the array of path parts to the last one.

Adding up to the great Sebastian Barth answer.
if href is a variable that you are parsing, new URL will throw a TypeError so to be in the safe side you should try - catch
try{
const segments = new URL(href).pathname.split('/');
const last = segments.pop() || segments.pop(); // Handle potential trailing slash
console.log(last);
}catch (error){
//Uups, href wasn't a valid URL (empty string or malformed URL)
console.log('TypeError ->',error);
}

I believe it's safer to remove the tail slash('/') before doing substring. Because I got an empty string in my scenario.
window.alert((window.location.pathname).replace(/\/$/, "").substr((window.location.pathname.replace(/\/$/, "")).lastIndexOf('/') + 1));

Bestway to get URL Last Segment Remove (-) and (/) also
jQuery(document).ready(function(){
var path = window.location.pathname;
var parts = path.split('/');
var lastSegment = parts.pop() || parts.pop(); // handle potential trailing slash
lastSegment = lastSegment.replace('-',' ').replace('-',' ');
jQuery('.archive .filters').before('<div class="product_heading"><h3>Best '+lastSegment+' Deals </h3></div>');
});

A way to avoid query params
const urlString = "https://stackoverflow.com/last-segment?param=123"
const url = new URL(urlString);
url.search = '';
const lastSegment = url.pathname.split('/').pop();
console.log(lastSegment)