Ajaxove volanie vo vanilla JS

MKI-Miro

Ahojte

Co robim zle pri volani:

function search(searchValue) {
  console.log(searchValue);
  if (searchValue.length > 2) {
    var searchLoading = document.getElementById('search-loading');
    searchLoading.style.display = 'block';

    var formData = new FormData();
    formData.append("search", searchValue);
    formData.append("do", "GetSearchProducts");

    fetch('/online/get-search-products', {
      method: 'POST', // *GET, POST, PUT, DELETE, etc.
      mode: 'same-origin', // no-cors, *cors, same-origin
      cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
      credentials: 'same-origin', // include, *same-origin, omit
      headers: {
        'Content-Type': 'application/x-www-form-urlencoded',
      },
      body: formData
    })
      .then(function (response) {
        console.log(response);
        searchLoading.style.display = 'none';
      })
  }
}

dostanem odpoved

?_tracy_bar=js&v=2.7…_SESSION_STOP=1:507 POST http://mania/online/get-search-products 404 (Not Found)
vanilla.js?v=5:116
Response {type: "basic", url: "http://mania/online/get-search-products", redirected: false, status: 404, ok: false, …}
body: (...)
bodyUsed: false
headers: Headers {}
ok: false
redirected: false
status: 404
statusText: "Not Found"
type: "basic"
url: "http://mania/online/get-search-products"
__proto__: Response

dakujem

dms

Ahoj

formData.append("do", "GetSearchProducts");

tohle se snaží spustit metodu handleGetSearchProducts()

fetch('/online/get-search-products',

tohle pak odkazuje na OnlinePresenter->actionGetSearchProducts() (za předpokladu výchozích nastavení rout).
Asi by se mělo použít jenom jedno řešení. Je jedno jestli přes akci nebo handle. Vynechej to formData.append(„do“, „GetSearchProducts“) a spustí se ti funkce actionGetSearchProducts()

MKI-Miro

mne by sa teda ovela viac pozdavalo keby sa vola handle funkcia cize

formData.append("do", "GetSearchProducts");

fetch('/online',

ale nefunguje :(

MKI-Miro

naozaj nikto sa doteraz nesnazil odtrhnut od jquery?

CZechBoY

Tak si srovnej jak vypadá request v jquery a jak ve vanilla js.

MKI-Miro

trochu som sa posunul

fetch('/online', {
      method: 'POST', // *GET, POST, PUT, DELETE, etc.
      mode: 'same-origin', // no-cors, *cors, same-origin
      cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
      credentials: 'same-origin', // include, *same-origin, omit
      headers: {
        'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
        'X-Requested-With': 'XMLHttpRequest'
      },
      body: "search=" + searchValue + "&do=GetSearchProducts"
    })
      .then(function (response) {
        console.log(response);
        searchLoading.style.display = 'none';
      })

toto funguje aj vidim odpoved ale console.log(response); mi vpodstate nic neda (pritom napr vo fiddleri vidim html noveho snippetu)

Response {type: "basic", url: "http://mania/online", redirected: false, status: 200, ok: true, …}
body: ReadableStream
locked: false
__proto__: ReadableStream
bodyUsed: false
headers: Headers
__proto__: Headers
ok: true
redirected: false
status: 200
statusText: "OK"
type: "basic"
url: "http://mania/online"
__proto__: Response

MKI-Miro

takze uz som asi prisiel aj nato

ak by niekto potreboval:

.then(function (response) {
        response.json().then(data => {
          for (var i in data.snippets) {
            console.log(data.snippets[i]);
          }