How to pass a variable with url on javascript fetch() method?

Question

I'm trying to fetch data from URL with GET method on javascript,

fetch('/api/staffattendance/{makedate}')
  .then(res => res.json())
  .then(res => {
    //this.staffs = res.data;
    console.log(res.data);
  })
  .catch(err => console.log(err));

How can I pass the variable here:

fetch('/api/staffattendance/{makedate}')

Like this

Thanks in Advance,

Did you search a bit? Maybe `\`my_string${my_variable}\`` is what you are looking for. Or string concatenation. There are plenty of solution available and well documented — Ulysse BN, Jun 22 '18 at 07:50
Looks like you're trying to use [`Template Literals`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals) — Alex, Jun 22 '18 at 08:01
Does this answer your question? [Most efficient way to concatenate strings in JavaScript?](https://stackoverflow.com/questions/16696632/most-efficient-way-to-concatenate-strings-in-javascript) — miken32, Jan 17 '20 at 17:42

Shreyak Upadhyay · Answer 1 · 2020-01-03T09:42:43.817

6

One method is the string concatenation but js has introduced another mechanism called template literal:

Embed the string with `` and user variable with ${makedate}.

`/api/staffattendance/${makedate}`

Let me know if this helps.

edited Jan 03 '20 at 09:42

answered Sep 13 '19 at 18:39

Shreyak Upadhyay

439
6
10

Hi guys, I tried all solution mention in this. but nothing worked. I want to fetch data for "vall" id, please help me. fetch('https://performancetestdmb.azurewebsites.net/api/products/'+vall+'/Category2') – Manpreet Dhiman Apr 07 '21 at 11:57

score 2 · Answer 2 · edited Jan 02 '20 at 16:25

2

You can also put the string in backticks ``, and include ${yourVariable} where you want your variable, example:

  fetch(`/api/staffattendance/${makedate}`)
    .then(res => res.json())
    .then(res => {
      //this.staffs = res.data;
      console.log(res.data);
    })
    .catch(err => console.log(err));

edited Jan 02 '20 at 16:25

miken32

42,008
16
111
154

answered Dec 21 '18 at 22:32

andres aguirre gonzalez

51
3

How can I use this in ejs? – Prathamesh More Apr 01 '20 at 08:42

score 1 · Answer 3 · edited Feb 27 '19 at 19:50

1

Did you encompass the whole URL in acutes ( these little guys to the left of your '1' key) WHILE using this ${your-variable} around your JavaScript?

edited Feb 27 '19 at 19:50

double-beep

5,031
17
33
41

answered Feb 27 '19 at 17:49

ThirdGhostHand

377
5
19

score 0 · Answer 4 · answered Jun 22 '18 at 08:06

0

fetch('/api/staffattendance/'+makedate+'')

Simply concatenation works for me like this

answered Jun 22 '18 at 08:06

ubakara samy

159
2
3
8

This is not a solution. – Prathamesh More Apr 01 '20 at 08:39

How to pass a variable with url on javascript fetch() method?

4 Answers4

Linked