Náhrada iframe něčím jiným – HTML / XHTML – Fórum – Programujte.com

Ahoj všem. Mám databázi kontaktů. Jednoduchou stránku,kde se mě zobrazí seznam kontaktů. Informací o každém kontaktu je více, navíc zde mám další propojenou tabulku s poznámkami k danému kontaktu. Já by jsem chtěl udělat seznam(nějaký jednoduchý) úzká tabulka vedle které(vpravo), by bylo místo detail kontaktu a popřípadě s malou podtabulkou s poznámkami vztahující se k vybranému kontaktu. A teď je otázka jak nato. Primárně je na stránce 50 kontaktů. Vím jak to udělat pomocí ccs, ale to se mě zdá náročné. Jestliže bude mít každý z padesáti kontaktů deset a více poznámek, tak to bude docela hodně dat na načtení z db. Já chci, aby se detail a seznam poznámek načetl až ve chvíli, kdy kontakt vyberu v seznamu vlevo. Ale nechci, aby se reloadovala celá stránka, jenom to místo s tím detailem kontaktu. Napadlo mě použít iframe, ale kde co čtu, tak to nikde nedoporučují. Jak by jste to řešili? Předem se přiznám, že javascript neovládám, ale řešení javascriptem se nebráním. Jen budu potřebovat trochu více informací, pokud by bylo řešení javascriptem.

#2 null_while
Proměnou $_GET znám velice dobře, tak podobně to mám zpracované, ale tahle verze po kliknutí reloaduje stránky, což nechci.

#3 Peppy
No asi máš pravdu. Jenže já neovládám javascript. Teda sem tam nějakej jednoduchej script jsem použil, ale nic složitějšího. Mohl by si mě poradit trošku více? Celej del lítám po netu a sháním nějaké info, ale nějaký přehledný návod na AJAX jsem nenašel. Něco málo jsem našel o jQuery. Jen tak pro upřesnění, jaký je rozdíl mezi jQuery a AJAXEM?

jQuery je originálne knižnica na efekty ale už obsahuje aj funkcie pre prácu s AJAXom. AJAX je vlastne extra prepojenie cez HTTP protokol. Pomocou browsera posielaš HTTP (POST/GET) požiadavku na nejakú adresu. To znamená, že keď máš nejaké tlačidlo a na ňom nabindovaný onclick event, tak po kliknutí browser pošle požiadavok napr. HTTP GET  

http://nieco.sk/gdata.php?actionid=100

. Daný obsah, ktorý vygeneruje serverový skript sa pošle naspäť browseru, ten to predá JavaScriptu (väčšinou formát JSON/XML)  a ten už si pomocou efektov pekne prekreslí okno podľa dát zaslaných z tej adresy. Samozrejme, je nutné aby v tom browseri bežal JavaScript.

Udělej to jednoduše přes jQuery - tak jak radí Peppy. Každému odkazu dej nějakou třídu např. ajax. Pak dej tomu divu, do kterého chceš načítat ty poznámky nějaké id např. poznamky.

Pak si napíšeš jednoduchý skript, kde nabinduješ event onclick na ten odkaz - ten povede normálně tam, jak to máš teď - s refreshem. Ty ale pomocí js zakážeš defaultní funkci toho odkazu. A do divu "poznamky" načteš znovu php soubor, ve kterém se ti načítají a zobrazují ty poznámky.

Skript na ten handle kliknutí na odkaz by mohl vypadat takto:

<script type="text/javascript">
$(document).ready(function(){
	$(".ajax").live("click", function(event) {
		event.PreventDefault(); //zakáže defaultní funkci kliknutí na odkaz
		$("#poznamky").load($(this).attr("href")); //načte do toho divu soubor php s parametry v odkaze
	});
});
</script>

Tímto kódem zajistíš funkčnost i bez zapnutého JS (sice to dneska už má málokdo vypnuté - ale jistota je jistota). Kdyžtak můžeš přidat i nějaký efekt - třeba, že zmizne obsah toho divu, objeví se nějaký animovaný gif (na pozadí se načítají data), a jak budou data načteny - zmizne gif a odjeví se obsah. Projdi si doc na www.jquery.com. Snad jsem to napsal srozumitelně :)

PS: samozřejmně musíš našíst to jQuery ještě před tím kódem :)

#2 null_while
všechny klíče v poli $_GET jsou typu STRING, takže tvůj if s is_int by neměl nikdy projít ;)

Takže jsem si koupil tuhle knížku:

http://knihy.cpress.cz/ajax.html

No snad jsem koupil dobře. Teď už si ji jen přečíst a použít zmíněný ajax. Dík za rady, v rozhodování, kterou knížku vzít jste mě taky nakoply, měl jsem v ruce i tu jQuery. Tu si asi taky koupím, ale teď potřebuji ten ajax. Dík pánové.

No, ako chceš. Príde mi to zbytočné, kupovať na tak jednoduchú technológiu knihu...Ale je to len a le nna tebe :)

Já o tom nic nevím, ať jsem hledal co jsem hledal, tak moc návodů na netu není(v češtině) Jen pár ukázek, ale nic moc. Ta knížka stála pár korun, takže mě to zas tak nebolelo a snad pomůže.