Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [JavaScript]Jquery dynamiczne pobranie wartości z bazy, jw
miras
post 24.03.2015, 15:25:32
Post #1





Grupa: Zarejestrowani
Postów: 1 004
Pomógł: 9
Dołączył: 18.01.2011
Skąd: Siedlce

Ostrzeżenie: (30%)
XX---


Witam, mam taki problem:

mam button <button data-id="tutaj są różne ID rekordów">Edycja</button>

Po kliknięciu tego button'a wyskakuje mi popup z polami input do edycji tego rekordu, natomiast muszę wstawić w te pola obecne wartości i moje pytanie brzmi jak za pomocą jquery(zapewne) pobrać bez przeładowyania strony te wartości..


--------------------
Go to the top of the page
+Quote Post
b4rt3kk
post 24.03.2015, 16:32:27
Post #2





Grupa: Zarejestrowani
Postów: 1 933
Pomógł: 460
Dołączył: 2.04.2010
Skąd: Lublin

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


Cytat(miras @ 24.03.2015, 15:25:32 ) *
Witam, mam taki problem:

mam button <button data-id="tutaj są różne ID rekordów">Edycja</button>

Po kliknięciu tego button'a wyskakuje mi popup z polami input do edycji tego rekordu, natomiast muszę wstawić w te pola obecne wartości i moje pytanie brzmi jak za pomocą jquery(zapewne) pobrać bez przeładowyania strony te wartości..


Za pomocą ajax-a. Wysyłasz GET/POST ajax-em do skryptu, który pobierze określony wiersz lub wiersze i zwróci do skryptu JS - najlepiej zwróć sobie obiekt JSON. Później pozostaje tylko wstawienie danych do odpowiednich pól.


--------------------
Jeśli pomogłem, kliknij proszę 'pomógł'. Dzięki.
Go to the top of the page
+Quote Post
miras
post 24.03.2015, 17:08:50
Post #3





Grupa: Zarejestrowani
Postów: 1 004
Pomógł: 9
Dołączył: 18.01.2011
Skąd: Siedlce

Ostrzeżenie: (30%)
XX---


jak pobrac te wartości ajaxem - wiem, ale jak je przesłac do pliku js i dalej to już nie bardzo, mógłbym prosić o jakiś przykład?


--------------------
Go to the top of the page
+Quote Post
Forti
post 24.03.2015, 19:18:08
Post #4





Grupa: Zarejestrowani
Postów: 655
Pomógł: 73
Dołączył: 2.05.2014

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


Skoro wiesz jak przesłać ajax to za pewne wiesz, że ajax zwraca ci obiekt response - czyli nic innego jak odpowiedź ajaxa -,- adres (ajax) zwróci Tobie np. json z polami i wstawiasz je w inputy ;]


--------------------
Overwatch24 - najbardziej zaawansowany Polski portal Overwatch od fanów dla fanów.

Fachowo.co

Behance.net/fachowo
Go to the top of the page
+Quote Post
miras
post 24.03.2015, 19:28:49
Post #5





Grupa: Zarejestrowani
Postów: 1 004
Pomógł: 9
Dołączył: 18.01.2011
Skąd: Siedlce

Ostrzeżenie: (30%)
XX---


Inaczej, mam plik np. dane.php, który po kliknięciu przycisku edytuj zwraca $dane['imie'] = "Jan"; $dane['nazwisko'] = "Kowalski"; itd. moje pytanie brzmi - jak wstawić dynamicznie w pola Input


--------------------
Go to the top of the page
+Quote Post
Forti
post 24.03.2015, 19:34:09
Post #6





Grupa: Zarejestrowani
Postów: 655
Pomógł: 73
Dołączył: 2.05.2014

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


Nie wiem?

Mówisz że klikasz coś i pojawia się okienko z formularzem. W momencie jak klikasz ten przycisk wysyłaj ajax pod plik jakiś_sobie_plik.php który zrobi zapytanie do bazy o odpowiednie "rzeczy" i zwróci ci json/array z pole1 => wartość1 itp. i to odpowiednie wstawiaj w input.

  1. $.ajax({
  2. url: jakis_sobie_plik.php,
  3. type: "POST"
  4. }).done(function(data) {
  5. $('input[name="nazwa_pola"]').val(data.pole1);
  6. })


Dziękuje.


--------------------
Overwatch24 - najbardziej zaawansowany Polski portal Overwatch od fanów dla fanów.

Fachowo.co

Behance.net/fachowo
Go to the top of the page
+Quote Post
miras
post 24.03.2015, 20:21:30
Post #7





Grupa: Zarejestrowani
Postów: 1 004
Pomógł: 9
Dołączył: 18.01.2011
Skąd: Siedlce

Ostrzeżenie: (30%)
XX---


ok, rozumiem, natomiast mam problem:


  1.  
  2. <a href="#" class="big-link" data-reveal-id="popup2" data-animation="fade" data-id="'.$row1['id'].'"><div class="edycja" data-id="'.$row1['id'].'"><button>Edycja</button></div></a>
  3.  
  4. <div id="popup2" class="reveal-modal">
  5. <h1>Edycja</h1>
  6. <div id="kom1"></div>
  7. <table align="center">
  8. <tr><td>Nazwa:</td><td><input type="text" id="nazwa" name="nazwa"></td></tr>
  9. <tr><td>Kategoria:</td><td><input type="text" id="kategoria"></td></tr>
  10. <tr><td>Początek:</td><td><input type="text" id="poczatek"></td></tr>
  11. <tr><td>Koniec:</td><td><input type="text" id="koniec"></td></tr>
  12. </table> <br/><br/>
  13. <div class="wyslij_popup" id="kategoria"></div>
  14. <a class="close-reveal-modal">×</a>
  15. </div>
  16.  
  17.  
  18.  
  19. <script>
  20. $(document).ready(function() {
  21. $('.edycja').on('click', function () {
  22. var id = $(this).data('id');
  23. $.ajax({
  24. type : 'POST',
  25. url : 'include/ajax/edit.php',
  26. data: 'id='+id,
  27. success : function(data) {
  28. $('input[name="nazwa"]').val(data.nazwa);
  29.  
  30. }
  31. });
  32. });
  33. });
  34. </script>
  35.  
  36.  



i plik edit.php:

  1. <?php
  2. $row = $timetable->get_edit_info($_POST['id']);
  3. $d = array('nazwa' => $row['name'], 'kategoria' => $row['category_id'], 'start' => $row['start'], 'end' => $row['end']);
  4. echo $d;
  5. ?>
  6.  



--------------------
Go to the top of the page
+Quote Post
rad11
post 24.03.2015, 20:26:29
Post #8





Grupa: Zarejestrowani
Postów: 1 270
Pomógł: 184
Dołączył: 7.10.2012
Skąd: Warszawa

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


Przydalo by sie abys jak to kolega pisal zwrocil to w formacie JSON`a i dodal dataType JSON w zapytaniu AJAXA. I jak wysylasz postem wartosci to wystarczy zrobic tak:

  1.  
  2. data: {
  3.  
  4. id: id
  5.  
  6. }
  7.  


I pozniej w PHPie odbierasz jako $_POST['id'].

Ten post edytował rad11 24.03.2015, 20:28:25
Go to the top of the page
+Quote Post
PatrykN
post 26.03.2015, 10:12:38
Post #9





Grupa: Zarejestrowani
Postów: 1
Pomógł: 0
Dołączył: 24.03.2015

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


  1. <script type="text/javascript">
  2. $(function(){
  3. $('.edycja').on('click', function () {
  4. var id = $(this).attr('data-id');
  5. $.ajax({
  6. type : 'POST',
  7. url : 'include/ajax/edit.php',
  8. data: {
  9. id: id
  10. },
  11. success : function(data) {
  12. $('#nazwa').val(data.nazwa);
  13.  
  14. }
  15. });
  16. });
  17. });
  18.  
  19. <a href="#" class="big-link" data-reveal-id="popup2" data-animation="fade" data-id="'.$row1['id'].'"><div class="edycja" data-id="'.$row1['id'].'"><button>Edycja</button></div></a>
  20. <div id="popup2" class="reveal-modal">
  21. <h1>Edycja</h1>
  22. <div id="kom1"></div>
  23. <table align="center">
  24. <tr><td>Nazwa:</td><td><input type="text" id="nazwa" name="nazwa"></td></tr>
  25. <tr><td>Kategoria:</td><td><input type="text" id="kategoria"></td></tr>
  26. <tr><td>Początek:</td><td><input type="text" id="poczatek"></td></tr>
  27. <tr><td>Koniec:</td><td><input type="text" id="koniec"></td></tr>
  28. </table> <br/><br/>
  29. <div class="wyslij_popup" id="kategoria"></div>
  30. <a class="close-reveal-modal">×</a>
  31. </div>


  1. function json_callback() {
  2. if(empty($_POST)) return null;
  3. $sql = "SELECT * FROM my_table WHERE id = {$_POST['id]}";
  4. return json_encode(mysql_fetch_assoc($sql));
  5. }


Tak na szybko, jeśli w callbacku ajaxa będziesz miał tablicę zserializowaną do json'a, z poziomu js'a możesz obsługiwać ją obiekt (w tym przypadku data)

  1. function(data) {
  2. $('#nazwa').val(data.nazwa);
  3.  
  4. }


Nie rozumiem, dlaczego nie odwołasz się do obiektów za pomocą innego selektora. wink.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: 16.04.2024 - 19:22