Update query strings onChange - reactjs - javascript

I have a url with query strings which looks like this
http://localhost:3000/collection?page=1&limit=15&filter=%27%27&filterInitDate=2019/11/11&filterEndDate=2019/11/11
I want to update just the filterInitDate when i select a date from my date input. I know i can update the url simply by using this.props.history.push but how can i just change/update the filterInitDate when i change the date input
ideally something like this
history.push(`/collection?filterInitDate=${startDate}`)

You can use the URL and URLSearchParams classes for that, here is an example:
const urlStr = 'http://localhost:3000/collection?page=1&limit=15&filter=%27%27&filterInitDate=2019/11/11&filterEndDate=2019/11/11';
const url = new URL(urlStr);
url.searchParams.set("filterInitDate", "2019/11/12");
console.log(url.toString());
And an example specific to react router will look like this:
const query = new URLSearchParams(history.location.search);
query.set("filterInitDate", startDate);
history.replace({
search: query.toString()
});

Related

How to pass URL query string to website header?

I have this type of URL:
www.domain.com/postname?emailid=somethingsomething
I must place this part:
somethingsomething
inside WP header, more accurate inside JS snippet, as follows:
<script>
window.HashedEmail = 'somethingsomething';
</script>
EDIT: Suggested answer shows how to extract particular data but not how to place extracted data into header, for example - how to manipulate with extracted dataset
Maybe I missed something but this looks like a solution for me
const urlSearchParams = new URLSearchParams(window.location.search);
const emailid = urlSearchParams.get('emailid');
window.HashedEmail = emailid;

How to get the URL parameter using Javascript in raw format

So I currently get passed a query parameter in one of my URLs on my web application. The query paramater looks like
https://localhost:8080/home?code=v%5E1.1%23i%5E1%23p%5E3%23I%5E3%23f%5E0%23r%5E1%23t%5EUl41XzEwOkFGNjA3MEMzMzRGOThFRTgwMkMxRUVGQjhGRUZEOTREXzJfMSNFXjI2MA%3D%3D&expires_in=299
I am currently parsing that code parameter using
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
const code = urlParams.get('code')
const expires_in = urlParams.get('expires_in')
However the parsed URLSearchParams looks like
v^1.1#i^1#p^3#I^3#f^0#r^1#t^Ul41XzEwOkFGNjA3MEMzMzRGOThFRTgwMkMxRUVGQjhGRUZEOTREXzJfMSNFXjI2MA==
I want to use the raw code parameter seen in the URL. Is there a way to get this?

axios didn't return data with matching query string of parameter object but returns all the data in vanila JS

i have an api endpoint https://countriesnode.herokuapp.com/v1/countries.
Now i am fetching all the countries by
axios.get('https://countriesnode.herokuapp.com/v1/countries')
it returns successfully. Besides I want to fetch single countries with the country code like 'BB' .and i am trying with params and my object is like below
axios.get('https://countriesnode.herokuapp.com/v1/countries',
{
params: {
code: codeId
}
but it returns all the data like above rather than showing a single country with the following code. I also want to extract only the currency and area code. I wanted to try like this, don't know it gonna work or not.
.then(axios.spread((object) => {
console.log('Currency: ', object.data.currency);
console.log('Area code: ', object.data.emojiU);
}));
please someone help me... It took me almose the hole day for this but not able to success.
As per your comment, if you want to get the data of a specific country, you only have to append the country code id to the URL:
const codeId = 'BB';
axios.get(`https://countriesnode.herokuapp.com/v1/countries/${codeId}`)
Would give you the data for Barbados.
If you want to access the currency attribute you can do so with the code:
const codeId = 'BB';
axios.get(`https://countriesnode.herokuapp.com/v1/countries/${codeId}`).then(function(response) {
const currency = response.data.currency;
});

Firestore query date range with using 'where'

I need to grab doc from collection if its today and status true, but it seems not working is there any better solution for this query?
My query:
var query = firebase.firestore().collection("book")
query = query.where('completed', '==', true)
query = query.orderBy('publishdate').startAt(1555567200000).endAt(1555653599999)
query.get().then(...)
I've also tried:
var query = firebase.firestore().collection("book")
query = query.where('completed', '==', true)
query = query.where('publishdate', '>', 1555567200000)
query.get().then(...)
but no result
I had to do two things to get this working:
Create a composite index by clicking on the link that showed up in my JavaScript console.
Pass in the timestamp as a proper Date() instead of a number: query = query.orderBy('publishdate').startAt(new Date(1555653600000));
With that it works fine for me. See a working sample here: https://jsbin.com/gufogib/edit?js,console

Duplicate parameters in Angular $http

I want to add multiple parameters with the same name to a request URL. I'm using Angular's $http.
The URL should look like this:
http://myBaseUrl?name1=value1&name1=value2...
I know that it is possible to make something like this when I set the values as an array:
http://myBaseUrl?name1=value1,value2...
But it has to be like the first one.
If you're using HttpClient you can use HttpParams for this.
let params = new HttpParams();
// Assign parameters
params = params.append('firstParameter', 'valueOne');
params = params.append('firstParameter', 'valueTwo');
// Get request
this.http.get(`http://example.com`, { params }).subscribe();

Categories

Resources