Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> Obiekt promise zwrócić do zmiennej w zapytaniu ajax, ajax javascirpt
silverwind
post 1.05.2018, 12:15:04
Post #1





Grupa: Zarejestrowani
Postów: 80
Pomógł: 0
Dołączył: 8.02.2013

Ostrzeżenie: (0%)
-----


Jak wstawić dane z promise obiektu. Zmienna zwraca obiekt promise var userGroups = getGroupsByIdUser(userId); Chce go wstawić do userOfGroupDtos. Próbowałem coś takiego
[JAVASCRIPT] pobierz, plaintext
  1. userGroups.then(function (result){
  2. userOfGroupDtos:result
  3. });
  4. }),
[JAVASCRIPT] pobierz, plaintext

ale jest error statment
[JAVASCRIPT] pobierz, plaintext
  1. $.ajax({
  2. url: requestUrl,
  3. method: "PUT",
  4. processData: false,
  5. contentType: "application/json; charset=utf-8",
  6. dataType: 'json',
  7. data: JSON.stringify({
  8. id:userId,
  9. firstName: userFirstName,
  10. lastName: userLastName,
  11. password: userPassword,
  12. birthDate: userBirthdate,
  13. userOfGroupDtos:
  14.  
[JAVASCRIPT] pobierz, plaintext


Go to the top of the page
+Quote Post
LowiczakPL
post 2.05.2018, 06:43:51
Post #2





Grupa: Zarejestrowani
Postów: 531
Pomógł: 55
Dołączył: 3.01.2016
Skąd: Łowicz

Ostrzeżenie: (0%)
-----


Proponuję 2 rozwiązania, przypisać do jakiejś metody.

  1.  
  2. userOfGroupDtos.metoda = result;


albo połączyć razem jeśli są to 2 takie same typy danych.

  1.  
  2. userOfGroupDtos.concat(result);


--------------------
Szukam zleceń Symfony, Laravel, Back-End, Front-End, PHP, MySQL ...
Go to the top of the page
+Quote Post
silverwind
post 2.05.2018, 08:44:24
Post #3





Grupa: Zarejestrowani
Postów: 80
Pomógł: 0
Dołączył: 8.02.2013

Ostrzeżenie: (0%)
-----


Co to znaczy do jakieś metody? . Nie idzie jakoś normalnie wartość tego obiektu zwrócić Dopiero zacząłem się uczyć Javascript. Czytałem o promise i callback ale nigdzie nie znalazłem jak użyć zwracaną wartość tego obiektu.
Go to the top of the page
+Quote Post
SmokAnalog
post 2.05.2018, 09:19:09
Post #4





Grupa: Zarejestrowani
Postów: 1 707
Pomógł: 266
Dołączył: 3.07.2012
Skąd: Poznań

Ostrzeżenie: (0%)
-----


Musisz skorzystać ze zmiennej, która jest dostępna w tym zasięgu, na przykład:

[JAVASCRIPT] pobierz, plaintext
  1. let userOfGroupDtos;
  2.  
  3. userGroups.then(result => {
  4. userOfGroupDtos = result;
  5. });
[JAVASCRIPT] pobierz, plaintext
Go to the top of the page
+Quote Post
silverwind
post 2.05.2018, 10:54:30
Post #5





Grupa: Zarejestrowani
Postów: 80
Pomógł: 0
Dołączył: 8.02.2013

Ostrzeżenie: (0%)
-----


Cytat(SmokAnalog @ 2.05.2018, 10:19:09 ) *
Musisz skorzystać ze zmiennej, która jest dostępna w tym zasięgu, na przykład:

[JAVASCRIPT] pobierz, plaintext
  1. let userOfGroupDtos;
  2.  
  3. userGroups.then(result => {
  4. userOfGroupDtos = result;
  5. });
[JAVASCRIPT] pobierz, plaintext


Próbowałem już tego rozwiązania ale chyba czegoś jeszcze nie wiem na temat javascript, ponieważ ta zmienna się nie zapisuje w takim układzie jak poniżej. Jest w console.log(userGroups) undefined
[JAVASCRIPT] pobierz, plaintext
  1. function handleUserUpdateRequest() {
  2.  
  3. var parentEl = $(this).parent().parent();
  4. var userId = parentEl.attr('data-user-id');
  5. var userFirstName = parentEl.find('[data-user-firstName-input]').val();
  6. var userLastName = parentEl.find('[data-user-lastName-input]').val();
  7. var userPassword = parentEl.find('[data-user-password-input]').val();
  8. var userBirthdate = parentEl.find('[data-user-birthDate-input]').val();
  9. let userGroups;
  10. getGroupsByIdUser(userId).then(result=>{userGroups=result});
  11. console.log(userGroups);
  12. var requestUrl = apiRoot + 'users';
  13.  
  14. $.ajax({
  15. url: requestUrl,
  16. method: "PUT",
  17. processData: false,
  18. contentType: "application/json; charset=utf-8",
  19. dataType: 'json',
  20. data: JSON.stringify({
  21. id: userId,
  22. firstName: userFirstName,
  23. lastName: userLastName,
  24. password: userPassword,
  25. birthDate: userBirthdate,
  26.  
  27.  
  28. success: function (data) {
  29. parentEl.attr('data-user-id', data.id).toggleClass('datatable__row--editing');
  30. parentEl.find('[data-user-firstName-paragraph]').text(userFirstName);
  31. parentEl.find('[data-user-lastName-paragraph]').text(userLastName);
  32. parentEl.find('[data-user-password-paragraph]').text(userPassword);
  33. parentEl.find('[data-user-birthDate-paragraph]').text(userBirthdate);
  34. }
  35. })
  36.  
  37. });
  38. }
[JAVASCRIPT] pobierz, plaintext

Go to the top of the page
+Quote Post
SmokAnalog
post 4.05.2018, 12:16:00
Post #6





Grupa: Zarejestrowani
Postów: 1 707
Pomógł: 266
Dołączył: 3.07.2012
Skąd: Poznań

Ostrzeżenie: (0%)
-----


Działałoby Ci, gdyby callback dla Promise nie wykonywał się asynchronicznie. Zamień sobie dla testu to:
[JAVASCRIPT] pobierz, plaintext
  1. console.log(userGroups);
[JAVASCRIPT] pobierz, plaintext


na to:
[JAVASCRIPT] pobierz, plaintext
  1. setTimeout(() => {console.log(userGroups);}, 3000);
[JAVASCRIPT] pobierz, plaintext


Zobaczysz, że tutaj już userGroups będzie miało tę wartość z callbacka dla Promise.
Go to the top of the page
+Quote Post
bael
post 4.05.2018, 21:02:17
Post #7





Grupa: Zarejestrowani
Postów: 3
Pomógł: 1
Dołączył: 8.08.2010

Ostrzeżenie: (0%)
-----


Wszystko co znajduje się w handleUserUpdateRequest poza tym fragmentem:
Kod
getGroupsByIdUser(userId).then(result=>{userGroups=result});

jest wykonywane synchronicznie. Czyli cały kod wykonuje się linijka za linijką jak leci. Wszystko co znajduje się po 'then' wykonywane jest asynchronicznie. Ten fragment kodu reprezentuje moment w czasie kiedy dane (result) są już dostępne. Promise jest po to żeby JS wiedział, że może sobie wykonać wszystko co ma zrobić w ramach handleUserUpdateRequest ale pewne dane reprezentowane jako obiekt Promise będą dostępne później. Później może być za sekundę, minutę itd. handleUserUpdateRequest nie może czekać, ponieważ wykonuje się synchronicznie. Gdyby handleUserUpdateRequest miał czekać na te dane, to skrypt musiałby się zatrzymać do momentu aż dane (result) będą dostępne. Oczywiście tego nie chcemy. Żeby 'udać się' do momentu w czasie w którym dane są już dostępne i zrobić cokolwiek z tymi danymi musisz zrobić to w tym miejscu:
Kod
getGroupsByIdUser(userId).then(result=>{
// do something special with asynchronous data here!
});


To co Ty robisz to przypisujesz result do zmiennej userGroups ale zauważ, że dzieje się to w momencie kiedy dane są dostępne, a nie wtedy kiedy wykonywana jest reszta kodu, który jest synchroniczny. Ta część, która jest synchroniczna już dawno się wykonała, więc poza tym przypisaniem nic się już więcej nie zadzieje.

Jak sobie z tym radzić?
1. Możesz użyć callback'u czyli wcześniej zdefiniować sobie sposób postępowania w momencie kiedy dane będą już dostępne:
Kod
getGroupsByIdUser(userId).then(result=>{
// doSomethingSpecialWithAsynchronousData(result);
});

W bardziej zaawansowanej wersji możesz obsłużyć to eventem, który będzie emitowany w momencie kiedy dane będą dostępne.
2. Jeżeli nie przepadasz za asynchroniczną składnią, możesz użyć specjalnej składni async/await, która powoduje to że kod wygląda jakby był pisany synchronicznie ale jest asynchroniczny.
Go to the top of the page
+Quote Post
SmokAnalog
post 5.05.2018, 22:07:43
Post #8





Grupa: Zarejestrowani
Postów: 1 707
Pomógł: 266
Dołączył: 3.07.2012
Skąd: Poznań

Ostrzeżenie: (0%)
-----


Napisanie pierwszego posta zajęło Ci 8 lat medieval.gif
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 28.03.2024 - 20:32