Autor Zpráva
pajadvorak
Profil
Prosím o radu, kdo se vyzná v ajax jquery. Vyčítám z tabulky databáze cca 70 řádků dat. V každém řádku je pak níže uvedený formulář. Problém nastal, že se zpomalilo načítání stránky. Potřebuji, aby se tento formulář načítal až když se klikne na select nebo může tam být jiné tlačítko na které se klikne a pak se načte formulář k danému řádku.

Bohužel nevím jak to mám udělat. Každý řádek má své id z tabulky, aby se dal identifikovat.

Děkuji za každou pomoc.


<td width="70" onMouseDown="return zvyrazni_radek_check(this)">
                <form action="index.php" method="GET">
                  <style>
                    select {width: 70px}
                  </style> 
                  <select name="site">
                    <option value=""></option>
                    <option title="Pošle email." onclick="if(confirm('Opravdu odeslat mail?<?php echo $jmeno." a čislo.: ".$cislo ?>?')) location.href='?site=zmenaamp;id=<? echo $id;?>'; return(false);" value="zmena1&amp;id=<? echo $id;?>">změna 1</option>
                    <option title="Pošle email." onclick="if(confirm('Opravdu odeslat mail?<?php echo $jmeno." a čislo.: ".$cislo ?>?')) location.href='?site=zmenaamp;id=<? echo $id;?>'; return(false);" value="zmena2&amp;id=<? echo $id;?>">změna 2</option>
                    <option title="Pošle email." onclick="if(confirm('Opravdu odeslat mail?<?php echo $jmeno." a čislo.: ".$cislo ?>?')) location.href='?site=zmenaamp;id=<? echo $id;?>'; return(false);" value="zmena3&amp;id=<? echo $id;?>">změna 3</option>
                    
                  </select>
                  
                </form> 
              </td>



Tak jsem to nově upravil takto:
<form action="index.php" method="GET">
    <select name="site" onclick="novy_form_mail('id<?php echo $id; ?>'); return false;">
        <div id="selecty222">
        </div>
    </select>
</form>


a teď se pokouším správně vymyslet jak to tady upravit, aby mi to zobrazilo <option> (víceméně potřebuji, aby mi správně zobrazil option se správným id požadovaného řádku):
(skládám to ze starého obdobného kódu, který funguje a dělá něco obdobného, avšak ho programoval někdo jiný)
<script type="text/javascript" language="javascript">


function novy_form_mail(tlacitko)
{
 
    $("#"+tlacitko).find("#selecty222").append("<option value=\"\"></option>
   <option title=\"Pošle zákazníkovi do mailu informaci, že má chybně zvolený čas doručení a návrh řešení.\" onclick=\"if(confirm('Opravdu odeslat mail?<?php echo $jmeno.\" a číslo: \".$cislo?>?')) location.href='?site=zmena&amp;id=<? echo $id;?>'; return(false);\" value=\"zmena&amp;id=<? echo $id;?>\">změna 1</option>");

}
</script>
quatzael
Profil
pajadvorak:
Úplně moc nerozumím Tvýmu dotazu.. Neumíš sestavit AJAX request nebo máš problém s tím, že se Ti to pomalu načítá?
Popiš svůj problém konkrétněji. To, že máš někde v databázi 70 řádků dat snad nehraje úplně roli. Navíc nevím co si mám představit pod tím, že je v každém řádku databáze uvedený formulář.. To opravdu myslíš celej ten HTML kód co jsi tady uvedl v prvním příspěvku?!
pajadvorak
Profil
quatzael:


už jsem pokročil :-)

teď potřebuji vyřešit, aby se mi aktivoval pouze jeden formulář -> když kliknu na odkaz na 54. řádku, tak aby se aktivoval pouze formulář 54. řádku... bude to nějak s this... ale nevím jak ho tam zakomponovat... děkuji

<td width="70" onMouseDown="return zvyrazni_radek_check(this)">  // sloupec tabulky s formulářem
  <div class="mail4">  // zde si načtu formulář až ho budu volat
  </div>

  <a href=# class="tlacitko4a">poslat mail</a>  // odkaz přes který spouštím funkci a který následně schovám
</td>

$(function() {
  $(".tlacitko4a").click(function(){
  //  alert('aaa');
    $('.tlacitko4a').hide();
    $.ajax({url: "objednavky_form.php", success: function(result){
        $(".mail4").html(result);
    }});
  });       
});



A taky koukám, že jsem ztratil proměnné z PHP.... id a jmeno... jak ho mám dostat do objednavky_form.php?
quatzael
Profil
pajadvorak:
Tak si snad tím ajaxem můžeš na server poslat, kterej konkrétní formulář potřebuješ získat zpět:

$.ajax({
url: "objednavky_form.php", 
type: "POST",        
data: {formular: tencochci},   
success: function(result){
 $(".mail4").html(result);
}});
    
pajadvorak
Profil
quatzael:
1)
Myslel jsem nějak přes this... ale nevím jak to přesně formulovat... (z minulosti vím, že this dokázal hodně věcí vyřešit.. :-))

ten formulář je jen jeden stejný (objednavky_form.php) a teď se mi po kliknutí na odkaz tlacitko4a spustí na všech řádcích (rozuměj, mám odkaz tlacitko4a na všech řádcích a když kliknu na konkrétní odkaz tlacitko4a na řádku 54, potřebuji, aby se mi otevřel ten formulář z objednavky_form.php na 54. řádku a na ostatních řádcích zůstal zavřený.

2)
a taky jak tam poslat nějaké proměnné $jmeno, co mám v PHP...? aby ten formulář měl nějaké hodnoty...?
quatzael
Profil
pajadvorak:
Napiš vždycky co konkrétně potřebuješ vyřešit, když Ti jde o nějakou obecnou věc, kterou nevíš jak řešit, tzn. např. "Jak vezmu hodnotu z elemntu A a odešlu jí ajaxem?"

Když vím o co jde tak rád tady někomu poradím, ale taky nemám úplně moc času studovat Tvoje kódy a zjišťovat jaký účel to má plnit.

  $(".nejaky-element").click(function(){
   var uzitecnaHodnota = $(this).closest(".element-nad-tim").find(".element-pod-tim").attr("data-atribut-s-nejakou-hodnotou");
  });

Toto $(this) nese přímo element, na který jsi klikl ve formě objektu..
pcmanik
Profil
quatzael:
Čo má podľa teba robiť tento zápis?
$(this).(".element-nad-tim")
quatzael
Profil
pcmanik:
Sorry, nějak se tam vytratilo closest.. Už jsem to opravil.. Díky za připomínku:o)
pajadvorak
Profil
quatzael:
Podívám se na ti, to by mohlo být ono, co potřebuji.. :-)

A pak ten formulář. (zatím jsem tam tu uzitecnou hodnotu napsal jen pro ilustraci...)
Jak má vypadat zápis, aby se mi v tabulce ve sloupci pro formuláře načetl pouze jeden formulář a ne na všech řádcích?

Sloupec html vypadá takto (v každém řádku to samé):
na jedno z těch tlačítek kliknu a v tom řádku potřebuji načíst formulář. Ostatní řádky zůstanou s tlačítkem...
Děkuji

<td>
    <div class="mail4">
    </div>

    <a href=# class="tlacitko4a">poslat mail</a>
</td>

JQUERY AJAX:
$(function() {  // ready handler -> spouštěč funkce
  $(".tlacitko4a").click(function(){  // funkce se spustí po kliknutí na class tlacitko4a

   var uzitecnaHodnota = $(this).closest(".element-nad-tim").find(".element-pod-tim").attr("data-atribut-s-nejakou-hodnotou");

    $('.tlacitko4a').hide();  // skryje odkaz tlacitko4a
    
    $.ajax({
    url: "objednavky_form.php", 
    type: "POST",        
    data: uzitecnaHodnota , 
    success: function(result){
     $(".mail4").html(result);
    }});
  });       
});
Tomášeek
Profil *
pajadvorak:
Zkusím tě jen komentářem navést, kde máš v kódu chyby. Zkus popřemýšlet, jak dva uvedené řádky níže upravit.

$('.tlacitko4a').hide();  // skryje odkaz tlacitko4a
Ne, skryje všechna tlačítka.

$(".mail4").html(result);
Vypíše do všech .mail4 elementů.
pajadvorak
Profil
Tomášeek:
Díky. Tohle vím :-)

A mám takové tušení, že by bylo vhodné tam nějak implementovat "this", čím se jquery vyznačuje... :-) ale nevím jak... Ale je samozřejmě možné, že jsme úplně vedle...
Tomášeek
Profil *
pajadvorak:
mám takové tušení, že by bylo vhodné tam nějak implementovat "this", čím se jquery vyznačuje
Ano, bylo.

thisem se nevyznačuje jQuery, ale (mimojiné) JavaScript. Zkus nebrat this jako nějakou magii, zkus pochopit, co znamená. Pak by ti mělo být jasné, co se v něm nachází, jak (a proč) vzniká a jak s ním naložit. Zapomeň taky na nějakou implementaci, je to obyčejná proměnná (objekt).
quatzael
Profil
pajadvorak:
Jak má vypadat zápis, aby se mi v tabulce ve sloupci pro formuláře načetl pouze jeden formulář a ne na všech řádcích?
Mluvíš o SQL tabulce nebo HTML tabulce?

Pokud je to to první, nepleteš si náhodou řádky se sloupcema?
Tomášeek
Profil *
quatzael:
Mluvíš o SQL tabulce nebo HTML tabulce?
Mluví o tabulce v HTML, sloupcem myslí vždy Xtou buňku v řádku tabulky. Je to zjevné z kódu v #3 a #9, jen ta terminologie je volena blbě.

Řešení má naznačené (resp. napovězené) v #10 a #12, tzn. místo práce se všemi elementy s danými třídami pracovat jen s tím jedním konkrétním, se kterým pracovat chce. To by mělo k řešení stačit, ovšem, s potřebnou dávkou samostudia.
quatzael
Profil
Tomášeek:
Mluví o tabulce v HTML, sloupcem myslí vždy Xtou buňku v řádku tabulky. Je to zjevné z kódu v #3 a #9, jen ta terminologie je volena blbě.
To bych si nebyl tak jistej podle toho co píše hned na začátku:

pajadvorak:
Vyčítám z tabulky databáze cca 70 řádků dat. V každém řádku je pak níže uvedený formulář.

Na co by potom potřeboval ten AJAX??
pajadvorak
Profil
quatzael:
Tomášeek:

Abych to uvedl na pravou míru a bylo vše jasné a hlavně jasné to, zda můj postup přinese očekávané ovoce.

Stáhnu si do tabulky data z MySQL. Například 70 řádků dat. V každém řádku na konci jsou v jednotlivých sloupcích formuláře (celkem 3 = ve 3 sloupcích každého řádku). Když jsem toto udělal klasicky v HTML, tak se mi načítání o hodně prodloužilo a tak znepříjemnilo práci s tabulkou. Protože po každém odeslání formuláře se tabulka znovu načte, znovu stahuje data z MySQL a znovu ukládá do paměti všechny formuláře. Doba načítání se tak prodlouží o cca 60-90 vteřin. Pro práci s tabulkou je to hodně. Protože když začnu pracovat s formuláři, práce se značně znepříjemní...

Takže jsem přišel na nápad, načítat tabulku bez formulářů a jednotlivý formulář si nechat zobrazit až po kliknutí na tlačítko "ukaž mi tento např. 1. formulář k tomuto řádku) a s ním pak pracovat. Vůbec nejlepší by bylo, kdyby se stránka nemusela ani reloadovat a po odeslání formuláře se pouze objevila hláška "formulář bla bla bla odeslán". A hotovo :-)

A teď si už ani nejsem jistý, zda to co jsem tu tvořil (viz výše) se dá použít a poslouží dané věci.

Bohužel na internetu nemohu najít nic hotového použitelného (asi je to dost individuální), ani nejsem v této složitosti učený...

Již jsem pochopil, že $(this).hide(); mi to tlačítko přes které zobrazím formulář skryje. Ale zatím jsem nepochopil, jak mám otevřít jeden jediný formulář...

Každopádně předpokládám, že AJAX v této věci bude nutností a jquery také.
Keeehi
Profil
pajadvorak:
Doba načítání se tak prodlouží o cca 60-90 vteřin.
Já bych se spíše zaměřil na toto. Je téměř nemožné, aby se při sedmdesáti formulářích prodloužila tak výrazně doba a ty to měl udělané správně. Pokud by jsi opravil ten výpis, nemusel by ses zabývat javascriptem který ti evidentně taky činí problémy.
pajadvorak
Profil
Keeehi:
Pardon, chyba... načítání je pomalejší o cca 1 - 1,5 vteřiny... ;-)

Vaše odpověď

Mohlo by se hodit

Neumíte-li správně určit příčinu chyby, vkládejte odkazy na živé ukázky.
Užíváte-li nějakou cizí knihovnu, ukažte odpovídajícím, kde jste ji vzali.

Užitečné odkazy:

Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: