jQuery ajax – best practice

@kiwisJun 25.2020

I’ve been using jQuery ajax to load contents onto my website via events for a while.

Is this still the best approach or should I be using something like fetch to do this?

fetch appears to only use json and my content pages are html pages.

to post a comment

@SempervivumJun 25.2020 — #@kiwis80#1619892 fetch appears to only use json and my content pages are html pages.[/quote]No, JSON is widely used with fetch, but not necessaryly. You can load text as well:

 fetch('your-url').then(resp =&gt; {
 // return resp.json();
 return resp.text(); // Return text instead of decoding JSON
 }).then(responseText =&gt; {
 document.querySelector('selector-of-destination').innerHTML = responseText;
 });

If your jQuery ajax is working and you are using jQuery anyway I do not see any reason for changing the working procedure.

@kiwisauthorJun 25.2020 — #@Sempervivum#1619894

Thanks awesome, thanks.

Looking to use fetch over jQuery for a new project. Trying to move away from jQuery overtime.

Out of interest, how can I pass in a few variables to the fetch request, such as an ID number

@SempervivumJun 25.2020 — #how can I pass in a few variables to the fetch request, such as an ID number[/quote]That's a bit different when using the fetch API and there are several ways to do it:

1. Create a query string by yourself in order to add GET parameters:

 fetch(<span><code>yourscript.php?id=${theid}&amp;amp;var2=${anotherVar}</code></span>).then(resp =&gt; {
 return resp.text();
 }).then(responseText =&gt; {

2. Use FormData:

<i>
 </i>            formData = new FormData();
 formData.append('id, theid);
 formData.append('var2', anotherVar);            <br/>
 fetch('yourscript.php', {
 method: 'post',
 body: formData
 }).then(resp =&gt; {

3. Use JSON (appropriate when the structure of the parameters is more complex). Described here:

https://stackoverflow.com/questions/29775797/fetch-post-json-data

but I didn't use it myself yet.

Looking to use fetch over jQuery for a new project. Trying to move away from jQuery overtime.[/quote]Agree, I've done the same in the past.

@VITSUSAJun 26.2020 — #@kiwis80#1619892 I agree with Sempervivum, JSON is widely used with fetch, but not necessarily. You can load text as well.

@bwclovisJun 27.2020 — #I'd also recommend looking into Axios.

jQuery ajax – best practice

5 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

jQuery ajax – best practice

5 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

5 Comments(s) _↴

Also in #JavaScript _↴