Dynamická změna hladiny nádrže, pomocí ajaxu

Upozornění: Tohle vlákno je hodně staré a informace nemusí být platné pro současné Nette.
před 13 lety
Klainer
Člen | 42
+
0
-

Dobrý den,
snažím se v nette naprogramovat takovou malou aplikaci na správu nádrže, která je rozdělená do 3 komor,
v databázi mám hodnoty kolik litrů v každé komoře v nádrži ještě je.

Počet nádrží může být různý. Proto jsem si v config neon nastavil parametry, jaké každá komora má.

		nadrz:
			komora1:
				hodnota: HODNOTAL1
				objem: 150000
			komora2:
				hodnota: HODNOTAL2
				objem: 200000
			komora3:
				hodnota: HODNOTAL3
				objem: 150000

Jelikož jsem začátečník a v nette se moc nevyznám naprogramoval jsem vše v presenteru,
zkoušel jsem využít i komponenty, ale tam jsem se zasekl kdž jsem měl načítat data z config neonu a předat je komponentě.

Kod v prezenteru vypadá takhle:

		// Získám data z config neonu
		$params = $this->getContext()->getParameters();

		// Poèet nádrží
		$pocet = Count($params["nadrz"]);
		echo 'Počet komor: '. $pocet. "<br \>";


		//Funkce která získá z modelu aktuální data o nádržích
		$aktualne = KalibraceModel::getActual($honoty);

		//Předám do presenteru
		$this->template->nadrzePocet = $aktualne;

Ve view dělám pak tohle:
Ze všeho nejdříve si pomocí foreach vyranderuji všechny nadrže a uložím si zůstatek v nádrži do atributu hodnota, pak všechny elementu vezmu a pomocí jquery každému nastavím v css height což mě mění výšku vody v nádrži.


  <div id="tanks">


	{foreach $nadrzePocet as $nadrz}
				<div class="tank{$iterator->counter}" rel="">
					<div class="wrapper">
						<div class="watter" hodnota="{$nadrz}">
						</div>
					</div>
				</div>
	{/foreach}

 	<script type="text/javascript">
		$(document).ready(function(){

			$('.watter').each(function(i)
		{
			$cislo = $(this).attr("hodnota");
			$(this).css("height",$cislo*10)
			$(this).append("<center>" + $cislo + "<center>");
		})

		});

	</script>

  </div>

Určitě tohle není ideální řešení, chtěl bych se tedy zeptat na pár věcí.

  1. Mám používat komponentu ? A když ji použiji můžu dat komory jako další komponenty ? Zkoušel jsem to ale netušil jsem jak každé pod komponentě přidat parametr o aktuálním zůstatku v nádrži.
  2. Pokud to mé současné řešení není až tak špatné, potřeboval bych aby se hodnoty v nádržích aktualizovali co minutu. Udělat to pomocí ajax ? Případně jak by jste to řešili vy ? Snippet ?

Děkuji moc za Vaše rady a připomínky, kritiku s Nette se teprve učím takže budu rád aspon za nějaké postřehy.

Ještě jedna drobnost, jak pomocí ajax dotazu zavolám signál handler v presenteru ?
Ahci totiž aby se mě volal každých 60s.

Handler vypadá ted takhle:

	public function handleClick()
	{
		$params = $this->getContext()->getParameters();
		$pocet = Count($params["nadrz"]);

		$nadrze = $params["nadrz"];
		$honoty =  array();
		$objemy =  array();
		foreach ($nadrze as $nadrz) {
			array_push($honoty , $nadrz['hodnota']);
			array_push($objemy , $nadrz['objem']);
		}

		$aktualne = KalibraceModel::getActual($honoty);
		$pocet = $pocet + 1;

		$this->template->nadrzePocet = $aktualne;

		if($this->isAjax())
		{
			$this->invalidateControl('nadrz');
		}
	}

Našel jsem tuhle funkci javascriptu ale envím ajk ji upravit aby volala daný handler:

setInterval(function()
				{
					$.ajax({
					  type:"get",
					  url:"",
					  datatype:"html",
					  success:function(data)
					  {
						  //do something with response data
					  }
					});
				}, 10000);//time in milliseconds

Editoval Klainer (29. 6. 2012 17:58)

před 13 lety
xtbman
Člen | 24
+
0
-

ahoj, můžeš to řešit několika způsoby. Buď tak jak to řešíš ty (v presenteru) nebo pomocí komponent. Mohla by ti pomoci přednáška Jana Tvrdíka o komponentách.

Pomocí komponent to můžeš řešit dvěma způsoby. Buď ti komponenta bude zprácovávat všechny nádrže. Nebo budeš mít pro každou nádrž komponentu vlastní. U druhého případu by jsi použil

<?php
Nette\Application\UI\Multiplier
?>

a stím intervalem si dáš třeba na stránku odkaz s handlerem a snippet

<?php
<a n:href="click!" id="click" style="display:none">odkaz na handler</a>
{snippet nadrze}

{/snippet}
?>

a pak ten tvůj script
funkce setInterval se volá sama podle intervalu který nastavíš.

<script>
var signal = $('#click').attr('href')

setInterval(function()
                                {
                                        $.ajax({
                                          type:"get",
                                          url: signal,
                                          datatype:"json",
                                          success:function(data)
                                          {
                                                  $('#snippet--nadrze').html(data.snippets['snippet--nadrze'])
                                          }
                                        });
                                }, 10000);//time in milliseconds
</script>

a tím překreslíš celou část s nádržema a nebo si budeš vracet pouze data a a podle toho měnit css
tzn. v handleru

<?php
$this->sendResponse(new Nette\Application\Responses\JsonResponse($data);
?>

Editoval xtbman (30. 6. 2012 21:17)