Föreslå användarnamn baserat på förnamn och efternamn

Låt besökaren slippa fylla i användarnamn - föreslå automatiskt ett namn baserat på förnamn och efternamn! Låt jQuery fixa det:

Lägg inom HEAD-taggen:

<script type="text/javascript" src="includes/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){

$("#username").focus(function() {
var firstname = $("#firstname").val();
var lastname = $("#lastname").val();
if(firstname && lastname && !this.value) {
this.value = firstname + "." + lastname;
});
});
</script>

I formuläret:

Förnamn:
<input type="text" name="firstname" id="firstname" />
Efternamn:
<input type="text" name="lastname" id="lastname" />
Användarnamn:
<input type="text" name="username" id="username" />

Använd jQuery för att kolla om användarnam är ledigt

Visst blir formuläret snyggare och enklare att fylla i om besökaren direkt ser om användarnamnet redan är upptaget. Fixa det enkelt med jQuery!

Lägg inom HEAD-taggen:

<script type="text/javascript" src="includes/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#username").change(function() {
var usr = $("#username").val();
if(usr.length >= 3) {
$("#validateUsername").html('<img src="images/loader.gif" height="16" width="16" /> kontrollerar tillgänglighet...');
$.ajax({
type: "POST",
url: "includes/availability.php",
data: "username="+ usr,
success: function(msg){
$("#validateUsername").ajaxComplete
(function(event, request, settings){
$("#validateUsername").html
(msg);
});
}
});
}
});
});
</script>

I formuläret:

<input type="text" name="username" id="username" /> <span id="validateUsername"></span>

I filen check.php kontrollerar du om användarnamnet ($_POST['username']) är tillgängligt och skriver ut (echo) resultatet som då hamnar inom span-taggen med id validateUsername.

Laddningssymbolen kan du spara härifrån:

Validera formulär med jQuery

jQuery går alldeles utmärkt att använda till att validera olika fält i formulär.

Lägg inom HEAD-taggen:

<script type="text/javascript" src="includes/jquery.js"></script>
<script type="text/javascript" src="includes/jquery.validate.min.js"></script>

Obligatoriska fält
Ange klassen required för de fält i ditt formulär som ska vara obligatoriska att fylla i.

Ex:
<input type="text" name="username" class="required" />

Validera epost
Ange klassen email för att kontrollera om ifylld epost-adress är giltiga.

Ex:
<input type="text" name="email" class="email" />

Kräva ett visst antal tecken
Vill man begränsa antalet tecken som matas in till minsta antal och högsta antal anger man klassen rangelength.

Ex:
<input type="password" name="password" class="rangelength" maxlength="10" minlength="5" />

Stämmer lösenorden överrens?
Ska besökaren skriva in sitt lösenord två gånger? Då kan jQuery matcha lösenorden så att de stämmer överrens.

Ex:
Lösenord: <input type="password" name="password1" id="password1" />

Bekräfta lösenord: <input type="password" name="password2" id="password2" equalto="#password1" />

Godkänn villkoren
Har du en checkruta som måste kryssas i för att besökaren ska kunna skicka formuläret, t ex "Acceptera våra villkor annars..."? Gör en specialare!

Lägg inom HEAD-taggen:

<script type="text/javascript">
$(document).ready(function(){
$("#form").validate({ //#form är formulärets id
rules: {
agree: "required"
},
messages: {
agree: "Du måste godkänna villkoren!"
}
}); });
</script>

I formuläret:
Jag godkänner villkoren <input type="checkbox" id="agree" name="agree" />

Läs mer och ladda ner plugin

Spara bandbredd när man visar Flash videos på hemsidan

Det är enkelt att lägga in videos på en hemsida. Man väljer Arkiv -> Importera -> Importera video och sedan blir man guidad av Flash steg för steg. Videon konverteras automatiskt från olika filtyper till formatet FLV som Flash Player har stöd för. Flash har inbyggda sk skins med videoliknande kontroller som paus, play, volymreglage etc.

Även om man kan välja att ändra autoPlay-parametern till False så filmen inte börjar spela upp sig direkt så kommer filmen ändå att laddas och - stjäla bandbredd. Men varför ska man ta bandbredd om besökaren kanske ändå väljer att inte starta filmen?
För att förhindra detta kan man lägga en osynlig knapp i Frame 1 som, när man klickar på den, anger vilken video som ska spelas. Videon laddas alltså inte in i playern förrän besökaren klickar på knappen.

För ActionScript 2.0

- Låt spelaren gå över två frames.

- Namnge knappen til exempelvis btnStart.

- Skapa ett nytt lager och lägg in följande ActionScript (frame 1):

stop();

btnStart.onRelease = function():Void {

nextFrame();

spelare.contentPath = “videon.flv”;

spelare.play();

this.enabled = false;

this._visible = false;

}

Vill du visa "filmen" direkt så ta en skärmdump på den och spara som en jpg. Döp till t ex video.jpg. I Flash så välj Windows -> Components, och dra in Loader på scenen. Ställ in placering och storlek så den matchar ditt foto.

Skriv istället följande ActionScript:

stop();

startfoto.contentPath = "video.jpg";

btnStart.onRelease = function():Void {

nextFrame();

spelare.contentPath = “videon.flv”;

spelare.play();

this.enabled = false;

this._visible = false;

}

Kolla hemsidans laddningstider

En sidas laddningstid kan avgöra om en besökare stannar kvar eller surfar vidare direkt.

Med Firefox addon Firebug får man information om laddningstiderna för sidor, bilder, stilmallar, skript osv. Det följer med ett antal utvecklingsverktyg, t ex kan du editera, felsöka och övervaka CSS, HTML och JavaScript på webbsidor.

Ett användbart tillägg för webbutvecklare, webbdesigners och bloggare.

Ladda ner: https://addons.mozilla.org/en-US/firefox/addon/1843

Firebug 1.4 kräver Firefox 3.0 eller högre

Generera slumptal

Generera slumptal med MySQL

SQL för att generera slumptal mellan 0 och 99:

SELECT floor(rand() * 100);

Funktionen rand() genererar ett decimaltal som är större än eller lika med 0 men mindre än 1. Sätt ett tak för slumptalet, här i exemplet 100. Använd funktionen floor() som avrundar nedåt för att få heltal.

För att generera slumptal mellan 10 och 20:

SELECT FLOOR(RAND()*20)+10;

Vill du ha ett slumptal med exakt 4 siffor skriv:

SELECT FLOOR(RAND()*1000)+9999;

Läs mer om funktionen rand() på den officiella hemsidan för MySQL

Generera slumptal med PHP

Genererar en integer:
echo rand();

Genererar ett slumptal mellan 5 och 15:
echo rand(5, 15);

Läs mer om PHP-funktionen rand() på PHP:s officiella webbplats