Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript][SQL][PHP]Automatycznie odświeżana lista z bazy
Forum PHP.pl > Forum > Przedszkole
roghatt
5.12.2012, 13:01:50
Witam
Wykorzystuję u siebie ten skrypt:
http://www.codemashups.com/dynamic-search-...jquery-and-php/
Po wpisaniu w pole wyszukiwania słowa pojawiają się odpowiednie dane z bazy danych.
Czy da radę to zrobić tak aby po wejściu na wyszukiwarkę lista wszystkich danych pojawiła się na liście i dopiero jak wpisuję w wyszukiwarkę dane to lista jest odpowiednio odświeżana?
W którym miejscu to można zmienić?
b4rt3kk
5.12.2012, 13:20:07
Na pewno jest taka możliwość. Ja bym zaczął od poszukiwania fragmentu kodu odpowiedzialnego za filtrowanie (zapewne będzie to keyup).
roghatt
5.12.2012, 13:22:38
wyniki właśnie pojawiają się dzięki temu, czyli jak się cokolwiek wpisze w wyszukiwarkę.
Próbowałem na sztywno ustawić aby było coś wpisane w wyszukiwarkę, ale jednak trzeba samemu wykonać jakąś akcje na tym polu wyszukiwania aby jakieś wyniki się zaczęły pojawiać.
b4rt3kk
5.12.2012, 13:32:55
Jak masz tą funkcję:

[HTML] pobierz, plaintext 
  1. $(document).ready(function(){
  2.     /*
  3.      Set the inner html of the table, tell the user to enter a search term to get started.
  4.      We could place this anywhere in the document. I chose to place it
  5.      in the table.
  6.     */
  7.     $('#results').html('<p style="padding:5px;">Enter a search term to start filtering.</p>');
  8.  
  9.     /* When the user enters a value such as "j" in the search box
  10.      * we want to run the .get() function. */
  11.     $('#searchData').keyup(function() {
  12.  
  13.         /* Get the value of the search input each time the keyup() method fires so we
  14.          * can pass the value to our .get() method to retrieve the data from the database */
  15.         var searchVal = $(this).val();
  16.  
  17.         /* If the searchVal var is NOT empty then check the database for possible results
  18.          * else display message to user */
  19.         if(searchVal !== '') {
  20.  
  21.             /* Fire the .get() method for and pass the searchVal data to the
  22.              * search-data.php file for retrieval */
  23.             $.get('data/search-data.php?searchData='+searchVal, function(returnData) {
  24.                 /* If the returnData is empty then display message to user
  25.                  * else our returned data results in the table.  */
  26.                 if (!returnData) {
  27.                     $('#results').html('<p style="padding:5px;">Search term entered does not return any data.</p>');
  28.                 } else {
  29.                     $('#results').html(returnData);
  30.                 }
  31.             });
  32.         } else {
  33.             $('#results').html('<p style="padding:5px;">Enter a search term to start filtering.</p>');
  34.         }
  35.  
  36.     });
  37.  
  38. });
[HTML] pobierz, plaintext


to daj na starcie:

[HTML] pobierz, plaintext 
  1. $.get('data/search-data.php?searchData=', function(returnData) {
  2. $('#results').html(returnData);
  3. }
[HTML] pobierz, plaintext


Czyli coś takiego:

[HTML] pobierz, plaintext 
  1. $(document).ready(function(){
  2.     /*
  3.      Set the inner html of the table, tell the user to enter a search term to get started.
  4.      We could place this anywhere in the document. I chose to place it
  5.      in the table.
  6.     */
  7.     $.get('data/search-data.php?searchData=', function(returnData) {
  8.       $('#results').html(returnData);
  9.     }
  10.  
  11.     /* When the user enters a value such as "j" in the search box
  12.      * we want to run the .get() function. */
  13.     $('#searchData').keyup(function() {
  14.  
  15.         /* Get the value of the search input each time the keyup() method fires so we
  16.          * can pass the value to our .get() method to retrieve the data from the database */
  17.         var searchVal = $(this).val();
  18.  
  19.         /* If the searchVal var is NOT empty then check the database for possible results
  20.          * else display message to user */
  21.         if(searchVal !== '') {
  22.  
  23.             /* Fire the .get() method for and pass the searchVal data to the
  24.              * search-data.php file for retrieval */
  25.             $.get('data/search-data.php?searchData='+searchVal, function(returnData) {
  26.                 /* If the returnData is empty then display message to user
  27.                  * else our returned data results in the table.  */
  28.                 if (!returnData) {
  29.                     $('#results').html('<p style="padding:5px;">Search term entered does not return any data.</p>');
  30.                 } else {
  31.                     $('#results').html(returnData);
  32.                 }
  33.             });
  34.         } else {
  35.          $.get('data/search-data.php?searchData=', function(returnData) {
  36.            $('#results').html(returnData);
  37.         }
  38.         }
  39.  
  40.     });
  41.  
  42. });
[HTML] pobierz, plaintext
roghatt
5.12.2012, 13:40:31
spowodowało to, że nic się nie wyświetla, ani po załadowaniu tej strony ani po wpisywaniu coś w wyszukiwarkę
b4rt3kk
5.12.2012, 14:18:00
Spróbuj tego:

[HTML] pobierz, plaintext 
  1.     $(document).ready(function(){
  2.         /*
  3.          Set the inner html of the table, tell the user to enter a search term to get started.
  4.          We could place this anywhere in the document. I chose to place it
  5.          in the table.
  6.         */
  7.  
  8. 		$.get('data/search-data.php?searchData=', function(returnData) {
  9.                     /* If the returnData is empty then display message to user
  10.                      * else our returned data results in the table.  */
  11.                     if (!returnData) {
  12.                         $('#results').html('<p style="padding:5px;">Search term entered does not return any data.</p>');
  13.                     } else {
  14.                         $('#results').html(returnData);
  15.                     }
  16.                 });
  17.  
  18.         /* When the user enters a value such as "j" in the search box
  19.          * we want to run the .get() function. */
  20.         $('#searchData').keyup(function() {
  21.  
  22.             /* Get the value of the search input each time the keyup() method fires so we
  23.              * can pass the value to our .get() method to retrieve the data from the database */
  24.             var searchVal = $(this).val();
  25.  
  26.             /* If the searchVal var is NOT empty then check the database for possible results
  27.              * else display message to user */
  28.  
  29.  
  30.                 /* Fire the .get() method for and pass the searchVal data to the
  31.                  * search-data.php file for retrieval */
  32.                 $.get('data/search-data.php?searchData='+searchVal, function(returnData) {
  33.                     /* If the returnData is empty then display message to user
  34.                      * else our returned data results in the table.  */
  35.                     if (!returnData) {
  36.                         $('#results').html('<p style="padding:5px;">Search term entered does not return any data.</p>');
  37.                     } else {
  38.                         $('#results').html(returnData);
  39.                     }
  40.                 });
  41.  
  42.  
  43.         });
  44.  
  45.     });
[HTML] pobierz, plaintext
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.