- og så har jeg tilladt mig at skrive den guide, du kunne have skrevet, og som det havde været muligt at bruge til alle tænkelige dropdowns:
---------------------------------------------------------
Ofte har vi brug for data til brugervalg i en dropdown - det være sig postnumre, sprogkoder, landekoder, bilmodeller, kommuner, m.m. Ikke sjældent er disse data tilgængelige i en tabel på WWW, og jeg vil i det efterfølgende vise, hvordan man med en smule søg/erstat kan formatere den slags kopierede data på en brugbar måde. Jeg har valgt bruge landekoder til brug ved telefonopringninger som eksempel.
Gå f.eks. til siden
landekode.dk og kopier søjlen ude til venstre under "
Sorteret alfabetisk efter landenavn". Sæt det ind i en tom fil i din editor, hvor det vil se ca. sådan ud:
00 93 Afghanistan
00 1 907 Alaska (USA)
00 355 Albanien
00 213 Algeriet
00 376 Andorra
00 244 Angola
00 1 264 Anguilla
00 1 268 Antigua og Barbuda
... ... ...
00 43 Østrig
Kald editorens
Søg/Erstat boks frem -
NB: den skal kunne håndtere regulære udtryk (Regular Expressions), og det skal være tilvalgt. Søg og erstat nu med (Husk at bruge 'Erstat alle'):
Søgestreng:
00 (d)
Erstatstreng:
$1
- hvilket fjernede nullerne og mellemrummet i begyndelsen af linjerne. Fortsæt søg/erstat med:
(d+)s?(d+)?s?
$1$2,
Nu ser dine data sådan ud:
93,Afghanistan
1907,Alaska (USA)
355,Albanien
213,Algeriet
376,Andorra
244,Angola
1264,Anguilla
1268,Antigua og Barbuda
- og du kan fortsætte med:
(d+),(.+?)r
$1, "$2[$1]",r
Husk lige at tjekke nederste linje. Hvis den ikke endte med et linjeskift, må du formatere den manuelt - og den må
ikke ende med et komma. Du skulle gerne ende med gåseøjne om tekststrengene og et komma efter - så det ligner 'indmaden' i et array.
Alt dette kan gøres langt hurtigere med én RegExp, men jeg har gjort det i flere hug for at vise, hvordan man stille og roligt kan formatere den slags manuelle screen-scrapes - ét overskueligt trin ad gangen.
Anvendt med PHPDu kan nu bruge dine formaterede data som elementer i et PHP-array:
<?php
$countryCodes = array(
93, "Afghanistan",
1907, "Alaska (USA)",
355, "Albanien",
213, "Algeriet",
376, "Andorra",
244, "Angola",
1264, "Anguilla",
1268, "Antigua og Barbuda",
... ... ...
43, "Østrig"
);
- og bruge det på denne måde:
<?php
include('country_codes.php');
function getCountryCodeOptions($arrCodes) {
$aHtml = array();
for ($i=0,$j=count($arrCodes); $i<$j; $i+=2) { // Bemærk: Der tælles op med to
$aHtml[] = '<option value="'.$arrCodes[$i].'">'.$arrCodes[$i+1].' ['.$arrCodes[$i].']</option>';
}
return implode('', $aHtml);
}
?>
- og nede i HTML'en:
<form action="">
<p><select name="ctr_code">
<option value="-1">Vælg ...</option>
<?php echo getCountryCodeOptions($countryCodes) ?>
</select></p>
</form>
Anvendt med JavaScriptMan kunne argumentere for, at der ikke er grund til at 'sløve' serveren med udskrivningsarbejdet - transportere en masse HTML over HTTP - eller 'forvirre' søgerobotter med 'ligegyldige' data. I stedet kunne man lade JavaScript hente og indsætte data. Begynd med at indsætte de søg/erstat formaterede data i et JS-array:
var aCountryCodes = [
93, "Afghanistan",
1907, "Alaska (USA)",
355, "Albanien",
213, "Algeriet",
376, "Andorra",
244, "Angola",
1264, "Anguilla",
1268, "Antigua og Barbuda",
... ... ...
43, "Østrig"
];
- og bruge det på denne måde:
<script type="text/javascript" src="country_codes.js"></script>
<script type="text/javascript">
function initCountryCodeSelect(sId) {
var elm, elmFrag = document.createDocumentFragment();
for (var i=0,j=aCountryCodes.length; i<j; i+=2) {
elm = document.createElement("option");
elm.setAttribute("value", aCountryCodes[ i]);
elm.appendChild( document.createTextNode(aCountryCodes[i+1]+" ["+aCountryCodes[ i]+"]") );
elmFrag.appendChild(elm);
}
document.getElementById(sId).appendChild(elmFrag);
}
window.onload = function() {
initCountryCodeSelect("ctrCode");
}
</script>
<form action="">
<p><select id="ctrCode" name="ctr_code">
<option value="-1">Vælg ...</option></p>
</form>
Tips og tricksDet er altid en god idé at kopiere data lige inden, man foretager en søg/erstat handling. Får man skrevet en forkert RegExp, er det bare
Ctrl+A og
Ctrl+V - og data er klar til et bedre forsøg.
Er du ikke sprød i RegExp, kan du med lidt fantasi komme rigtig langt med ganske alm. søg/erstat. Husk f.eks. at du kan gå helt ud i venstre side af en linje med cursoren - trykke
Shift+Backspace og derefter
Ctrl+C og sætte ind i søgefeltet. Så har du et linjeskift og kan altså definere noget, der skal skiftes i begyndelsen eller slutningen af hver linje.
Søg/erstat er et ualmindelig stærkt 'weapon of mass production'!Ofte er de data, vi er interesseret i at 'suge', stillet op i en tabel - og ikke sjældent sammen med en masse 'ligegyldige' data.
Hvis din editor har 'designview' (f.eks. DreamWeaver), kan du kopiere hele tabellen og sætte den ind i designview. Herefter sletter du de kollonner og rækker, du ikke skal bruge med editorens tabelværktøjer.
Til slut går du i codeview og kopierer alle tabelrækkerne over i et tomt dokument - hvor det er 'a piece of cake' at formatere data med søg/erstat. Tabelcellestrukturen er ofte en ren foræring til dette formål.
Vigtigt: Når din kode er færdig, bør du altid tjekke den op mod
mindst én anden troværdig kilde. I mit eksempel ville
tdc.dk være oplagt.