Smarty AJAX függvények
Smarty sablonrendszer fegyverzetét (Funkcióit) igyekszik kiegészíteni, néhány alap AJAX metódussal, amivel a megjelenést, kényelmet vagy a funkcionalitást növelhetjük. A Smarty Ajax függvényeknek Prototype.js (Prototype JavaScript framework, version 1.6.0) és ScriptaCulous.js (script.aculo.us scriptaculous.js v1.8.1) igénye van (újabb lehet).
Miért jó ez?
Ha utálsz gépelni, akkor tudod :-).
Milyen műveletet tudunk elvégezni velük:
Betöltés kezelés:
Kezdő JavaScript felhasználók ezen gyakran elvéreznek és utána hiába az elszántáság :-).
- ajax_prototypejs – Prototype.js fájlt hív be, ha nem találja hibaüzit (die) küld.
- ajax_effectjs - ScriptaCulous.js fájlt tölti be, ha nem találja hibaüzit (die) küld.
Egyéb elemek:
- Ajax.Updater – A hívott php fájl kimenetét XHTML; Text; JSON formában megjeleníthetjük vele
- Ajax.PeriodicalUpdater – periodikus frissítésre
- Autocompleter.Local – Az éppen gépelt szöveghez hasonlót keres a egy adott tömbben
- Ajax.Autocompleter - Az éppen gépelt szöveghez hasonlót kereshetünk fájlhívással
- Ajax.InPlaceEditor – Mentést és szerkesztés végezhetünk vele
- Ajax.Sortable.Create – rendezhető lista, melyet tömb formában feldolgozhatunk PHP-ben.
- Ajax.Tabmenu – Tabokkal lapozható, tartalmat pakolhatunk ki vele.
Felhasználhatóság:
A fent említett sablon és szkript könyvtárak engedélyei alapján, valamit saját felelőségre, mivel ez egy ingyenesen letölthető kiegészítés. A függvények megfelelő forrásból letöltve nem fognak gondot okozni. Az opendir.hu oldalról ingyenes letöltésekre semmilyen garanciát nem vállalunk, ennek a tudatában használjátok.
Mi kell ahhoz, hogy ezt használni tudd:
Főleg ismeretek, nem kevés :-). Prototype, ScriptaCulous, Smarty, PHP, esetleg egy pici CSS és XHTML. Persze ha a fenti 4 már megvan, a többit a funkciók kiegészítik, alapértelmezett beállításokra.
Telepítés:
Nem igényel telepítés, másoljuk bele a smarty/plugins/ mappába a function.ajax_....php kiterjesztésű fájlokat (a letöltések között a smarty_ajax.zip fájlban lesznek). Bár nem szerettem volna semmi Hactivityt elköveteni, azért nem árt átnézni a fájlokat, az Internyetú nem a bizalom háza. Tippek: amit lehet pakoljunk a publikus zónán (public_html-en) kívülre, ha nem a megjelenés része.
CSS, megjelenés szabályozása:
Vannak teszt beállítások amik smarty_ajax_teszt.zip letöltben smarty_ajax_style.css, fájlban találhatók. Ezek nem kötelezőek, van amelyik illusztráció (tab_menu), de van olyan is ami alapértelmezett beállítás. Ha nem tudod hogy adhatsz stílust egy adott elemnek, készítsd belőle többet és nézd meg a növekményes ID azonosítókat.
Letöltés:
smarty_ajax_teszt.zip csomag:
A leíráshoz csatoltam az általam is használt teszt fájlokat. Ha a leírás gyengus volna, kicsomagolás után beszédesebb lesz a templates/index.tpl fájl, szövegszerkesztővel történő nézegetése. Linuxra történő telepítéskor a template_c mappára adjunk rwx jogosultságot.
smarty_ajax.zip
Csak a telepítésnél említett fájlokat tartalmazza. Ezeket kell bemásolni a Smarty plugin mappába.
Prototype.js betöltés kezelés:
{ajax_prototypejs path="./js/" name="1.6.0_prototype.js"}
- paraméterek alapértelmezett értékekkel:
- path=”./”
- name=”prototype.js”
- A függvény betölti a path útvonalon található name nevű fájt. A head és /head részben helyezzük el. Alapjáraton a ./prototype.js keres, vagyis ha a fájl nevét nem változtattuk meg, elég az útvonalat megadni. {ajax_prototypejs path="/var/www/" name="prototype.js"}
scriptaculos.js betöltés kezelés:
{ajax_effectjs path="./js/scriptaculous-js-1.8.1/src/" load=""}
- paraméterek alapértelmezett értékekkel:
- path=”./”
- name=”scriptaculous.js”
- load=””
Hasonló mint a Prototype.js betöltésénél, csak itt megadhatunk egy load=”” paramétert amiben felsorolhatjuk a használni kívánt műveleteket. load="effects, dragdrop..". Érdemes csak a használathoz fontos modulokat betölteni, ezzel az oldal letöltést gyorsíthatjuk, viszont vannak eljárások amik modul függő (pl.: dragdrop kell a rendezéshez..). Az üres load paraméter minden betölt. {ajax_effectjs path="/var/www/" name="scriptaculous.js" load="effects,.."}
A többit hiába írnám le, talán még nagyobb zavart okoznék, az index.tpl-ben láthatók. A lényeg van néhány kötelező paraméter, ha ezek nincsenek meg hibaüzit (die) kapunk.
Speciális jelek:
- >< ezt az ütközés miatt a függvény cseréli {} karakterektre.
- indicator: 'loader#'" itt a #jel egy növekvő számra cserélődik, de csak adott fg.-ben
- lista_style="overflow:auto;background:#ff6c00;color:#fff;" megadhatunk stílust vagy class nevet
- {paraméter=”value”} formában adjuk meg az értékeket „”-re figyelve.
- method=”'post'” vagy method=”'get'” sajnos ilyen hülye formában kell megadni 'post'
Alap paraméterekkel:
{ajax_periodical_updater url="./url amit hívunk"
pars="nev: 'lorem1', alma: 'ipsum1'" outputid="kimenet ide kerül"}
{ajax_updater
function_name="ezen a néven jön létre az új js függvényünk"
pars="nev: $F('nev'),email_cim: $F('email_cim')"
url="./url amit hívunk"
outputid="kimenet id kerül"
}
Kiegészítés egy regisztrált tömbből
{ajax_autocompleter_local lista_id="ahová a listát legyártjuk" input_id="a text input id-je"
data_array=$indexphp_ben_regelet_tomb}
<?php
$tab_data=array("lorem", "ipsum", "dolor",);
$smarty->assign("tab_data1", $tab_data);
?>
{ajax_tabmenu
input_id="tab_1"
tab_id="tt"
tab_data=$tab_data1
}
Ha a textarea értéke be van kapcsolva akkor a szöveget bedobja egy olyan elembe. Viszont ha ez az érték globálban van megadva vagyis deklarációkor akkor egy küldhető formot eredményez, ehhez kell az url.
<?php
$tab_menu = array (
0 => array (
"title" => "Lorem",
"content" => "Lorem Ipsum Dolor Amet id velit.",
),
1 => array (
"title" => "Amet szója narráció előkelőség laptop alhálóza",
"content" => "Lorem Ipsum Dolor Amet.",
"textarea" => true,
),
);
$smarty->assign("tab_data1", $tab_menu);
?>
{ajax_sortable
url="./test_ajax_sortable.php"
input_id="sortable2"
data=$sortable_data
}
<?php
//$id=>$nev; id küdés után $key=sorrend; $value=id
$sortable_array = array (
10 => "Lorem",
11 => "Ipsum",
20 => "Dolor",
30 => "Amet",
40 => "Lorem",
50 => "pulvinar",
68 => "semper",
77 => "leo",
);
$smarty->assign("sortable_data", $sortable_array);
?>
{ajax_inplaceeditor
url="test_ajax_inplace_editor.php"
input_id="inptestlongtext"
text=$long_text
}
<?php
$long_text="lorem ipsum dolor ament";
$smarty->assign("long_text", $long_text);
?>
Kiegészítés fájl hívásból, a ParamName után megadott változót _POST tömbben fogjuk találni, a beírt értékkel.
{ajax_autocompleter
lista_id="auc_lista1"
input_id="auc_inp1"
url="./test_ajax_autocompleter.php"
options="paramName: 'akeresett_szo'"
}
Figyelem a függvények még elég alfa állapotban vannak, nem ítélem stabilnak, de tesztelni már lehet vele.
További paraméterek a index.tpl fájlban :-) sorry.
A tartalomhoz kapcsolódó linkek:
Cikkhez tartozó letöltés(ek):
smarty_ajax_test.zip- Ajax.Updater;Ajax.PeriodicalUpdater;Autocompleter.Local;
Ajax.Autocompleter;Ajax.InPlaceEditor;Ajax.Sortable.Create;
Ajax.Tabmenu
347598 Byte
application/zip - smarty_ajax.zip
- Függvényeket a smarty/plugin mappában kell másolni.
Ajax.Updater;Ajax.PeriodicalUpdater;Autocompleter.Local;
Ajax.Autocompleter;Ajax.InPlaceEditor;Ajax.Sortable.Create;
Ajax.Tabmenu
11084 Byte
application/zip
Bejegyzés küldése
További kapcsolódó oldalak
- jQuery Loader V2
- Mysql Ajax Table Editor
- Grafikon készítése egyszerűen
- NetBeans IDE használata FTP,SFTP-n keresztül
- Adminer alternatív PHPMyAdmin
- Web-design csere fájldalommentesen
- KFM webes fájlmenedzser
- Php Framework CodeIgniter alapok
- Videó letöltés és átalakítás PHP-vel
- Memcache használata
- NetBeans IDE gyorsbillentyűk
- Smarty Editor NetBeans Plugin
- PHP MYSQL Smarty Online CRUD generátor
- Webfejlesztési eszközök Linuxon
- NetBeans IDE 6.5 telepítése Ubuntura
- Aptana Stúdió telepítése Linuxra
- Html to PDF álom
- PHP forrás formázás
- JavaScript programozás PHP utasításokkal
- Ügyfélnyilvántartó demó
- Zend Framework és Doctrine
- Fájlok tárolása MySQL adatbázisban, PHP segítségével
- SQL Insert teszt
- Regexp Vagy Like, melyiket szeressem
- Webes kódtöredék kezelés Ubuntura WCS
- Website uptime monitoring
- PHP,Zenity,ImageMagick képmanipuláció Ubuntu Linuxon
- Zenity GTK+ GUI PHP-vel
- Parancssoros képmanipuláció Linuxon
- PHP array, String CheatSheet
- Alapvető műveletek PHP és MySQL adatbázis kapcsolatához
- $Smarty puska 1.
- Virtuálhost létrehozása localhoston
- Dokumentumok konvertálása
- kód optimalizálás tömböknél
- Curl funkciók telepítése XAMPP webszerverre
- Barátságos URL átirányítás
- PHP MySQL cheatSheet
- Forrás összehasonlítás, eltérés felderítés
- PHP, SQLite CheatSheet
Blogmarkok
Collapsing Site Navigation with jQuery
jQuery alapú navigáció, beúszó kép és leírás elemekkel.
Simple Chat
Egyszerû szöveges fájl alapú PHP chat progi.
Showcase of Interesting Navigation Designs
Érdekes menü, navigáció megvalósítások.
Több mint 306 magyar Linkgyûjtemény
Érdekes gyûjtemény magyar katalógusokról, linkgyûjteményekrõl, cikk katalógusokról. PR érték és alkalmazás szerinti megjegyzéssel. Igényes munka és használható forrás, weblap népszerûsítéshez. Az egyik legjobb hazai publikus SEO lista.
AdMax SEO Toolbar
Firefox kiterjesztés SEO eszközként.
Identica PHP
Identi.ca mikroblog szolgáltatáshoz PHP class, egyszerû használattal.
Twitter OAuth PHP
PHP Oauth részletes leírás, avagy hogyan használhatod távolról a Twittert.
Blogmark felhő
- Új, jquery, php, plugin, css, gfx, seo, tools, javascript, online, menu, tipp, ui, mysql, google, class, framework, lib, html, flash, gallery, firefox, pdf, js, ajax, web-design, speedup, form, codeigniter, template, oop, joomla, table, maps, linux, upload, security, book, color, cheatsheet, mvc, web, font, api, fejlesztes, gimp, zend framework, editor, php5, input, generator, slider, ubuntu, design, wordpress, lightbox, css3, effekt, free, sql, netbeans, test, snippet, leiras, zf, drupal, tanulas, twitter, python, tooltip, html5, newsletter, db, graph, open source, grafikon, wysiwyg, tarhely, jqueryui, cms, memcache, ide, smarty, photos, gyujtes, theme, browser, json, file, firebug, link, canvas, gyujtemeny, pattern, xhtml, scroll, xml, gui, tutorial, foto, rss, icons, player, image, code, grid, url, orm, gd, php oop, chrome, apache, ftp, regexp, extension, programozas, docs, website, video, kereso, basic
Top5 webes fájlmenedzser
A gyűjtésben szereplő elemek weben keresztül valósítanak meg fájlkezelést. A kiválasztásnál kiemelt szempont volt az egyszerű deszktop jellegű szoftverektől megszokott kényelem, a biztonság és a többfelhasználós beállítási lehetőség, egyszerű integrálhatóság és a felhasználhatósági (licenc) szempontok.
2009-5 kedvenc jQuery pluginje
2009-ben is vannak kedvenc jQuery plugin-jeim. Ezt szeretném veletek megosztani.
Úgy érzem kicsit változtam, a plugin választás a funkcionalitáson túl egy picit a parasztvakítás is bejátszik.
(Parasztvakítás (PW): olyan effektek aminek a gyakorlatban szinte semmi haszna nincs, de szemet gyönyörködtető)
Nem..
10 hasznos FireBug kiterjesztés
Hasznos FireBug képességeit kiterjesztő pluginek. Bár a FireBug önmagába is egy rendkívül jól használható Firefox kiterjesztés. De elérhető hozzá néhány nagyon profi kütyü, ami sokszor önálló funkciót valósít meg, de az esetek nagyobb részében a FirBug képességeit combosítják ki.
Ha még nem ismernéd a
50 Hasznos Firefox kiterjesztés Linuxra
Kedvenc Linuxon is működö Firefox kiterjesztések, mindennapos felhasználásra és webfejlesztőknek.
A addon-ok működnek Windows-os rendszereken is, de a cikk kifejezetten a Linuxra elérhető és hasznos Firefox kiterjesztésekből szemezget.
A Firefox 3.0 megjelenésekor már volt egy
350 hasznos Gimp effekt, Plugin, Script-Fu
Hasznos pluginek, Script-fu-k, effektekkel, technikai megoldások gyűjteménye Gimp 2.6.X verziójához.
A cikknek célja az, hogy egyszerű megoldást adjon Gimp-hez, pluginek beszerzésére.
Szerencsére vannak olyan önzetlen projektek ahol összegyűjtik számunkra ezeket a nélkülözhetetlen eszközöket. Így sikerült összehozni 5 bejegyzésben..
Szoftverek
ArtH2O Blog tartalmából:
PHP Twitter Codeigniter OAuth
2010 Augusztus végétől már csak OAuth-on keresztül lehet bejegyzéseket küldeni a Twitterre illetve a hitelesítés ezen keresztül megy. Sok megoldás létezik a dologra, de mindegyik eléggé nyakatekert és nem igazán akarnak működni.Érdemes elolvasnod a cikket, ha néhány óra kísérletezés meg szeretnél úszni!
10 hasznos új Codeigniter lib
- Több okból is szeretem a Codeigniter keretrendszert. Az egyik oka, hogy ezt választottam keretrendszerül az nem más mint az egyszerűség. A másik az, hogy nem kell feltalálni a kereket, mert szinte minden tud, amire nekem egy alap alkalmazásnál szükségem lehet. Biztonságos, gyors és egyszerűen tanulható, jól dokumentált, szerethető rendszer. De a bejegyzés nem erről szól, hanem néhány 2010-es hasznos Codeigniter Lib-ről.
Stílusos űrlap elemek
Nem egy
szerű minden űrlap elemnek stílust adni. Gyakorlatilag checkbox, select, radio, file elemeknek nagyon nem is lehet, vagy csak részben. Erre találtak ki egy érdekes technikát, ami a működés közben az eredeti HTML elemet elfedi és azt egy grafikai elemmel helyettesíti. pl.: Egy checkbox, vagy radio esetében 2 állapota van bekapcsolt és kikapcsolt. Ha lehet kerüljük ezeket a technikákat, mert nagyon böngészőfüggő a működésük. Ha lehet maradjunk az eredeti űrlap elemeknél és azt csinosítsuk.
Térképes cég-és weblapkatalógus
Már régóta szerettem volna egy olyan oldalt, ami weblapkatalógusként működik, de kicsit másképpen közelíti meg a dolgokat, mint a jelenleg piacion lévő katalógusok. Egy ilyen újszerű kezdeményezésem volt a szintén Codeigniter alapú Twitt.hu, ami egyben linkrövidítő szolgáltatás is. De a sok jó tulajdonsága mellet, még mindig hiányoltam benne valamit. Ezt a plusz dolgot sikerült beleplántálnom a RegionalisBank.info cég-és weblapkatalógusba.
Kép átméretezés és cache
Van néhány hasznos Smarty plugin, ilyen a Thumb nevű bővítmény is. Nagyon sokáig nem fejlesztették, már azt gondoltam kihalt alóla a fejlesztés, de 2010-ben egy újabb változat jelent meg belőle. Smarty 2.6.X és PHP 5.X.Y verzióhoz.A bővítménnyel a sablonon tudunk képméreteket legyártani és gyorsítótárazni.
Archívum:
Letöltések:
Hasznos holmik: