Sortering på tabeller
Hvis der er en ting jeg hader, så er det at lave trivielle tabeller med sortering. Jeg har dog efterhånden fundet den løsning jeg bedst kan li’.
Typisk vil man ha’ noget html som dette:
1 2 3 4 5 | <table> <tr> <th><a href="list.php?sort=name&type=asc">Navn</a></th> <th><a href="list.php?sort=age&type=asc">Alder</a></th> [...] |
Men det er pænt irriterende at generere linket, samt holde styr på om man sorterer stigende eller faldende, og der kommer sikkert også andre parametre med ind i URL’en. Så det har man ikke lyst til. Jeg ved godt at der findes Javascripts der kan sortere tabeller, men det virker kun hvis man ser hele tabellen, og ikke hvis der er flere sider.
Min løsning er at lave en form med nogle skjulte felter, og med manipulere den med jQuery når man klikker på th’erne.
Min tabel vil så se sådan ud:
1 2 3 4 5 | <table> <tr> <th x:name="name" class="sortable">Navn</th> <th x:name="age" class="sortable">Alder</th> [...] |
I mit stylesheet har jeg selvfølgelig en
1 2 3 | table th.sortable { cursor:pointer; } |
Og måske en text-decoration:underline så man kan se at man kan trykke på feltet.
Så laver jeg en form med to skjulte felter jeg bruger til at sortere med:
1 2 3 4 | <form action="list.php" method="get" id="form"> <input type="hidden" id="order_by" name="order_by" value="<{$smarty.get.order_by|escape|default:"name"}>"/> <input type="hidden" id="order_type" name="order_type" value="<{$smarty.get.order_type|escape|default:"asc"}>"/> </form> |
Derefter noget jQuery:
1 2 3 4 5 6 7 8 9 | <script type="text/javascript"> $(document).ready(function() { $("th.sortable").click(function() { $("#order_by").val($(this).attr("x:name")); $("#order_type").val($("#order_type").val() == "desc" ? "asc" : "desc"); $("#form").submit(); }); }); </script> |
Spore hvilke links brugeren trykker på
I nogen tilfælde vil jeg holde styr på hvilke links brugeren trykker på når vedkommende forlader min side. Normalt vil jeg løse dette ved at tilføje et proxy-script der sender videre. Fx:
<a href="redir.php?url=http://mbn.dk">mbn.dk</a>
Det gi’r dog nogle grimme adresser, og problemer hvis brugeren fx vil kopiere adressen og bruge den andre steder.
En løsning som jeg synes er pænere er at bruge noget Javascript der kigger på de events browseren fyrer af når man trykker på et link. Eks:
<script type="text/javascript"> $(document).ready(function() { $("a[target=_blank]").mousedown(function() { $.post("link_tracker.php", { url: $(this).attr("href") } ); }); }); </script>
Efterfølgende skal link_tracker.php samle $_POST['url'] op og behandle den …
Bemærk at jeg kun matcher de events hvor target-attributten er sat til “_blank”. Jeg kan måske ved fordel matche på alle links, og så checke om de starter med “http://”. Jeg matcher på mousedown og ikke click af den simple årsag at mousedown matcher mere. Fx midterklik. Dog matcher den ikke hvis man trykker på linket via tastatur, men koden kan nemt udvides til at tage højde for de senarier.
Ovenstående kræver jQuery som jeg loader via:
<script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript"> google.load("jquery", "1.3"); google.load("jqueryui", "1.7"); </script>
Videresende sin smartlog-blog
Hermed et lille tip til hvordan man viderestiller sin smartlog-blog til an anden. Man kan ikke gøre det på den “rigtige” måde, men jeg løste det ved at lave følgende i min template:
1 2 3 4 5 6 7 8 9 10 | <{if $single}> <{assign var="s" value=$posts.0->getHeadline()}> <{elseif $tag}> <{assign var="s" value=$tag->getTag()}> <{elseif $page}> <{assign var="s" value=$page->getHeadline()}> <{/if}> <meta http-equiv="Refresh" content="0; url=http://mbn.dk/?s=<{$s|escape}>"> |
Det er meget simpelt, og det virker de fleste gange. Eftersom smartlog.dk ikke kender den nye adresse videresender jeg til søgesiden i min blog.
Sende HTML-mails med billeder
At sende HTML-mails er nemt. Man skal bare sætte Content-Type til text/html. Skal man inkludere billeder i ens mail linker man bare til den på en server (<img src="http://www ..." alt=""/>). Alternativt kan man vedhæfte billederne.
Om man gør det ene eller det andet har nogle fordele og ulemper.
Når man linker til billeder
1) Man kan se om brugeren har åbnet ens mail ved at indsætte noget uniks i adressen til billederne.
2) Ens e-mails fylder mindre.
3) Man kan ændre billederne efter man har sendt e-mailen.
Når man vedhæfter billeder
1) Brugeren bliver typisk spurgt om mail-klienten skal vise billederne.
2) Ens e-mails fylder mere.
3) Brugeren har ikke fysisk modtaget hele mailen og visningen afhænger af mange ting. Er brugeren online, er serveren oppe, ligger billederne der stadig osv.
Jeg vil typisk være fortaler for at vedhæfte billederne. Det er dog lidt mere kompliceret. Fremgangsmåden er i grove træk følgende:
Fælgende headere skal sættes:
1 2 | Content-Type: multipart/mixed; boundary="-----boundary-123" |
Hvor man selv vælger hvad boundary skal være. Det skal bare være unikt.
Efterfølgende skal indholdet af ens mail splittes op i stykker der adskilles af det man har valgt som boundary. Bemærk at der tilføjes to ekstra -- til starten af ens boundary, og at der tilføjes endnu to til slutningen af den sidste.
Føste stump er HTML-dokumentet. Bemærk værdien i src.
1 2 3 4 | -------boundary-123 Content-Type: text/html <img src="cid:img123.png"> |
Sidste del af e-mailen er en base64-encodet version af billedet. For at kæde billedet sammen med img-tag’et skal Content-ID matche. Dog uden < og >.
5 6 7 8 9 10 11 12 | -------boundary-123 Content-Type: image/png Content-Transfer-Encoding: base64 Content-ID: <img123.png> [DATA] -------boundary-123-- |
Ovenstående er lidt simplificeret. Normalt ville jeg inkludere nogle flere ting. Charset m.m. Men det illustrerer godt den overordnede fremgangsmåde.
Om websmed.dk
Jeg hedder Morten, og jeg har udviklet webapplikationer siden slutningen af 90'erne.
Jeg vil her dele ud af min erfaring, og med jævne mellemrum poste nogle tips og tricks, samt løsningsforslag på generelle dagligdags problemstillinger.
Jeg har en forkærlighed for PHP og MySQL, hvorfor I nok vil se flest indlæg der vedrører den gren af webudvikling.
Jeg har en anden blog af mere personlig karakter på mbn.dk, hvor I kan finde kontaktmuligheder m.m.
Mine indlæg vil tit være baseret på problemstillinger i mit daglige virke, eller i mit eget firma MRLYTICS, hvor jeg sælger kundeundersøgelser samt kundedatabaser.
Denne side er hostet hos slicehost.
