• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Odświeżanie czasu w tabeli - jquery

VPS Starter Arubacloud
0 głosów
320 wizyt
pytanie zadane 19 sierpnia 2018 w JavaScript przez hiper007 Stary wyjadacz (11,270 p.)

Witam ;)

Mam pytanko;) Oto tabela

Zawiera kolumne czas, która mówi ile trwa załądunek samochodu ;) Czas od momentu rozpoczęcia do chwili obecnej.

I chciałbym, żeby ten czas się odświeżał co sekundę dla wszystkich wierszy. Nadałem tabeli id="czas" i zapomocą skryptu:

<script>

		setInterval("odswiez();",1000);

		function odswiez(){
		$('#czas').load('http://localhost/stat.php #czas');
		}
			
</script>	

Spowodowałem, że wszystko działa i czas odświeża się w każdym wierszu co sekundę. Ale muszę odświeżyć całą tabelę, a czy istnieje możliwość, żeby odświeżyć np. daną kolumnę tzn. dane pole wtedy wszystko będzie chodziło płynniej np. 

<td style='font-weight:bold; vertical-align: middle; display: table-cell; color:white;'><span id="czas">".$full_time2."</span></td>
<script>

		setInterval("odswiez();",1000);

		function odswiez(){
		$('#czas').load('http://localhost/stat.php #czas');
		}
			
</script>

To rezultat jest słaby: 

 

Odświeżają się,ale jak widać tylko w pierwszym wierszu  i to wszystkie, jak zrobie z klasą class="czas" to rezultat jest następujący;

Czy może ktoś  ma jakiś pomysł jak odświerzyć wszystkie czasy, nie odświeżając całej tabeli?

Z góry dzięki )

 

3 odpowiedzi

+1 głos
odpowiedź 20 sierpnia 2018 przez StOcK Mądrala (6,100 p.)
wybrane 21 sierpnia 2018 przez hiper007
 
Najlepsza
Ja bym kombinował w ten sposób, że np. <span class="czas" data-time="128">00 d. 00 g. 02 m. 08 s.</span>

Później w js element + interval + each
komentarz 20 sierpnia 2018 przez hiper007 Stary wyjadacz (11,270 p.)
<script>
 
        setInterval("odswiez();",1000);
 
        function odswiez(){
        $('.czas').load('http://localhost/stat.php .czas');
        }
             
</script>

Mógłbyś mi podpowiedzieć z tą pętlą each?? Jak połączyć to z interwałem??

Interwał już zrobiłem, ale nie bardzo wiem jak połączyć to z pętlą...

Z góry dzięki ;)

1
komentarz 20 sierpnia 2018 przez StOcK Mądrala (6,100 p.)
edycja 20 sierpnia 2018 przez StOcK

najpierw robisz each dla span.czas
a później interval, tak aby każdy element miał swój licznik

DEMO

komentarz 21 sierpnia 2018 przez hiper007 Stary wyjadacz (11,270 p.)
  $("span.czas").each(function(){
          
		  setInterval("odswiez();",1000);

		function odswiez(){
		$('.czas').load('http://172.27.189.12/opk/stat.php .czas');
		}
		  
			  
        });

Coś w tym style? ;)

1
komentarz 21 sierpnia 2018 przez StOcK Mądrala (6,100 p.)
W poprzednim komentarzu masz przykład.
+1 głos
odpowiedź 19 sierpnia 2018 przez pablop76 VIP (123,060 p.)
Nadać im taki sam styl i pobrać, a następnie odświeżyć. Można pobrać również jako n-ty element rodzica (<tr>)
komentarz 20 sierpnia 2018 przez hiper007 Stary wyjadacz (11,270 p.)
					if($result = mysql_query("SELECT * FROM rozladunek", $polaczenie))
					{	
						
							$ilu_userow=mysql_num_rows ($result);
							if($ilu_userow>0)
							{

echo<<<END

											<table id="tab1" class="table tablesorter tablesorter-default table-bordered table-striped table-hover" style="text-align:center;">	

											<thead style="color:black; background-color:grey; cursor:pointer;">	
											
												<tr  style="text-align:center;"><th style="font-weight:bold; vertical-align: middle; display: table-cell; text-align:center; width:100px;">Lp. </th><th style="font-weight:bold; vertical-align: middle; display: table-cell; text-align:center; width:400px;">Numer Naczepy </th><th style="font-weight:bold; vertical-align: middle; display: table-cell; text-align:center; width:300px;">Numer Boczny </th><th style="font-weight:bold; vertical-align: middle; display: table-cell; text-align:center;  width:300px;">Login </th><th style="font-weight:bold; vertical-align: middle; display: table-cell; text-align:center; width:300px;">Początek </th><th style="font-weight:bold; vertical-align: middle; display: table-cell; text-align:center; width:300px;">Koniec </th><th style="font-weight:bold; vertical-align: middle; display: table-cell; text-align:center; width:300px;">Czas </th></tr>
											
											</thead>	
END;
												
										
										$poz=1;
										
										while($wiersz=mysql_fetch_assoc($result))
										{		
															
															$color_stan=$wiersz['color_stan'];
															$nr_naczepy=$wiersz['nr_naczepy'];
															$nr_boczny=$wiersz['nr_boczny'];	
															$login=$wiersz['login'];
															$data_start=$wiersz['data_start'];
															$data_koniec=$wiersz['data_koniec'];
															$full_time=$wiersz['full_time'];
															$stan_rozlad=$wiersz['stan_rozlad'];
															$idr=$wiersz['idr'];
															$poz2=$poz++;

															
															$czas= new DateTime ($data_start);
															$czas->format('Y-m-d H:i:s');
															$czas2=new DateTime ();
															$czas2->format('Y-m-d H:i:s');
															$roz=$czas2->diff($czas);
															$roz->format('%y-%m-%d-%h-%i-%s');
															$godzina=explode("-", $roz->format('%Y-%M-%D-%H-%I-%S'));
															

															$full_time2= $godzina[2].' d. '.$godzina[3].' g. '.$godzina[4].' m. '.$godzina[5].' s. ';
															
										
	
echo<<<END

											<tbody id="myTable_1">	
								

												<tr class="wiersz" style="background-color:$color_stan; cursor:pointer;"><td style="font-weight:bold; vertical-align: middle; display: table-cell;">$poz2</td><td style="font-weight:bold; vertical-align: middle; display: table-cell; font-size:16px;">$nr_naczepy</td><td style="vertical-align: middle; display: table-cell; font-weight:bold; font-size:16px;">$nr_boczny</td><td style="vertical-align: middle; display: table-cell;">$login</td><td style="vertical-align: middle; display: table-cell;">$data_start</td><td style="vertical-align: middle; display: table-cell;"><span>b/d</span></td><td style='font-weight:bold; vertical-align: middle; display: table-cell; color:white;'>$full_time2</td></tr>
END;
				
	   					
											}		
											
																				

										}
		
							
						}else
						{
							
							echo "Błąd bazy danych, nie można wykonać zapytania do bazy\n";
							echo 'Błąd MySQL: ' . mysql_error();
							exit;

						}	

Chodzi oto, żeby zmienną $full_time2 odświeżać co sekundę w każdym wierszu...

komentarz 21 sierpnia 2018 przez pablop76 VIP (123,060 p.)

Rozumiem. Przykład w javascript

+1 głos
odpowiedź 19 sierpnia 2018 przez rafal.budzis Szeryf (85,260 p.)
Id mozesz uzyc tylko raz w całym htmlu dlatego też powinna być to klasa. Aby podmienić tekst jeden po drugim musisz zrobić pętle. Poczytaj o funkcji each w jQuery ;-)

Dobrym pomysłem jest tworzenie całego htmla w jquery a w PHP zwracać tylko dane np w formacie json

Podobne pytania

0 głosów
1 odpowiedź 258 wizyt
pytanie zadane 30 stycznia 2020 w JavaScript przez piwokarpackie Nowicjusz (180 p.)
+1 głos
1 odpowiedź 391 wizyt
pytanie zadane 6 kwietnia 2021 w HTML i CSS przez Nearr Obywatel (1,890 p.)
0 głosów
1 odpowiedź 365 wizyt
pytanie zadane 10 października 2020 w PHP przez KumberTwo Dyskutant (8,270 p.)

92,455 zapytań

141,263 odpowiedzi

319,099 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...