Just nu i M3-nätverket
Gå till innehåll
Inkan

Text- och kryss-ruta med funktion

Rekommendera Poster

Inkan

Ciao,

Jag letar efter en funktion där man i ett formulär ska välja mellan att skriva sin e-mailadress i en textruta eller markera i en kryssruta att man inte har någon e-mailadress. En alert-ruta ska popa upp om något av alternativen inte är ifyllda. Kan någon hjälpa mig med det?

 

Tackar

/Imman

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
Anjuna Moon

Hej, här får du ett script som fixar det du vill ha, med följande extra finesser:

- Textrutan gråas ut och görs disabled om kryssrutan är ifylld.

- E-postadressen kontrolleras för giltighet.

 

[log]

<html><head>
<style type="text/css">
	.Blurred {
		border:1px solid #cccccc;
		background-color:#eeeeee;
		color:#aaaaaa;
	}
	.Focused {
		border:1px solid #000000;
		background-color:#cccccc;
		color:#000000;
	}
</style>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function SetFocus(obj,blFocus) {
	obj.className=(blFocus)?'Focused':'Blurred';
	obj.disabled=!blFocus;
}
function CheckFields(oFrm) {
	sMail=oFrm.email.value;
	blChk=oFrm.noemail.checked;
	if (sMail=='' && !blChk) {
		alert("Du har inte gjort något val!");
		return false;
	} else if(!blChk && !isEmail(sMail)) {
		alert("E-postadressen är ej giltig!");
		return false;
	}
	return true;
}
function isEmail(str) {
  var supported = 0;
  if (window.RegExp) {
    var tempStr = "a";
    var tempReg = new RegExp(tempStr);
    if (tempReg.test(tempStr)) supported = 1;
  }
  if (!supported) 
    return (str.indexOf(".") > 2) && (str.indexOf("@") > 0);
  var r1 = new RegExp("(@.*@)|(\\.\\.)|(@\\.)|(^\\.)");
  var r2 = new RegExp("^.+\\@(\\[?)[a-zA-Z0-9\\-\\.]+\\.([a-zA-Z]{2,3}|[0-9]{1,3})(\\]?)$");
  return (!r1.test(str) && r2.test(str));
}	//-->
</SCRIPT>
</head><body>
<form onsubmit="return(CheckFields(this));" action="nysida.html" method="post">
E-post: <input class="Focused" id="email" name="email" type="text" onfocus="DoFocus(this);" onblur="DoBlur(this);"><br>
<input onclick="SetFocus(this.form.email,!this.checked);" type="checkbox" value="1" name="noemail"> E-post saknas<br>
<input type="submit" class="Focused" value="Skicka">
</form>
</body></html>

[/log]

 

AnjunaMoon

____________________________________________________________

/* There is nothing more permanent than a temporary solution... */

Stoppa mjukvarupatenten nu! http://www.ffii.se/

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
Inkan

Hej!

Tack för tipset men det funkar inte riktigt som jag tänkte, även om koden är mycket användbar i flera sammanhang. Dels så får jag felmeddelandet även när jag skriver mailadressen i textrutan, dels så står mailadressen kvar även när jag kryssar i rutan. Meningen är att texten ska försvinna när man kryssar i rutan och tvärtom.

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
Anjuna Moon

Jag förstår inte att du får felmeddelandet när en e-postadress är inskriven, det får inte jag.

 

Jag har ändrat lite så att textrutan rensas när man kryssar i kryssrutan, det som stod i rutan hålls i minnet och läggs tillbaka om man kryssar ur.

 

Jag har ändrat i SetFocus samt tagit bort två eventhanterar i textrutan som inte hade där att göra. Här är koden i sin helhet igen.

 

[log]

<html><head>
<style type="text/css">
.Blurred {
border:1px solid #cccccc;
background-color:#eeeeee;
color:#aaaaaa;
}
.Focused {
border:1px solid #000000;
background-color:#cccccc;
color:#000000;
}
</style>

<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
var sMailCache;
function SetFocus(obj,blFocus) {
obj.className=(blFocus)?'Focused':'Blurred';
obj.disabled=!blFocus;
sMailCache=(blFocus)?sMailCache:obj.value;
obj.value=(blFocus)?sMailCache:'';
}
function CheckFields(oFrm) {
sMail=oFrm.email.value;
blChk=oFrm.noemail.checked;
if (sMail=='' && !blChk) {
	alert("Du har inte gjort något val!");
	return false;
} else if(!blChk && !isEmail(sMail)) {
	alert("E-postadressen är ej giltig!");
	return false;
}
return true;
}
function isEmail(str) {
  var supported = 0;
  if (window.RegExp) {
    var tempStr = "a";
    var tempReg = new RegExp(tempStr);
    if (tempReg.test(tempStr)) supported = 1;
  }
  if (!supported) 
    return (str.indexOf(".") > 2) && (str.indexOf("@") > 0);
  var r1 = new RegExp("(@.*@)|(\\.\\.)|(@\\.)|(^\\.)");
  var r2 = new RegExp("^.+\\@(\\[?)[a-zA-Z0-9\\-\\.]+\\.([a-zA-Z]{2,3}|[0-9]{1,3})(\\]?)$");
  return (!r1.test(str) && r2.test(str));
}	
//-->
</SCRIPT>
</head><body>
<form onsubmit="return(CheckFields(this));" action="nysida.html" method="post">
E-post: <input class="Focused" id="email" name="email" type="text"><br>
<input onclick="SetFocus(this.form.email,!this.checked);" type="checkbox" value="1" name="noemail"> E-post saknas<br>
<input type="submit" class="Focused" value="Skicka">
</form>
</body></html>

[/log]

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
Inkan

Mycket bättre med texten som försvinner när man kryssar i rutan. Tyvärr står problemet kvar med att felmeddelandet dyker upp trots rätt inskriven mailadress. Konstigt att det fungerar hos dig men inte hos mig?

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
-OZn-

När du klipper och klistrar in ifrån eforum så följer inte snabel-a med i texten eftersom de är bilder. Se till att du satt in @ på de ställen de ska vara. För övrigt fick även jag koden att fungera...

 

/OZn

_______________________________________________________

Microchips - De små potatisflingorna du äter allra sist i chipspåsen

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
Inkan

Att jag inte såg det! Nu fungerar det! Stort tack båda två!!

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
Anjuna Moon
När du klipper och klistrar in ifrån eforum så följer inte snabel-a med i texten eftersom de är bilder. Se till att du satt in på de ställen de ska vara

 

Jag glömmer alltid bort att påpeka det, bra att du är alert OZn. Vore det inte dags att ta bort @-imagen från eforum när man skriver inom KOD-taggar, det sabbar en hel del och leder till onödig huvudvärk, som i detta fallet.

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
-OZn-
Vore det inte dags att ta bort -imagen från eforum när man skriver inom KOD-taggar, det sabbar en hel del och leder till onödig huvudvärk, som i detta fallet.

Håller helt med om det.

 

/OZn

_______________________________________________________

Microchips - De små potatisflingorna du äter allra sist i chipspåsen

 

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

Skapa ett konto eller logga in för att kommentera

Du måste vara medlem för att kunna kommentera

Skapa ett konto

Skapa ett nytt konto på vårt forum. Det är lätt!

Registrera ett nytt konto

Logga in

Redan medlem? Logga in här.

Logga in nu



×
×
  • Skapa nytt...