webForumDet fria alternativet
Logga in

byta ut en text snutt vid OnChange()

7 svar · 336 visningar · startad av tlee

tleeMedlem sedan mars 2001290 inlägg
#1

Tjena!

När jag gör en OnChange() så vill jag att en textrad på sidan skall ändras, alltså ingen <textara> eller <input> fält
utan bara vanlig text, texten som skall uppdateras är:

<div name=txt>detta är textraden som skall ändras</div>

Och den skall ersättas med:
<a href=# OnClick=javascript:OpenWindow('more_info.asp?ID=123');>Mer Info</A>

<html>
<head>
<SCRIPT LANGUAGE = JavaScript>
<!--

function OpenWindow(Url)
{
window.open(Url,'themanwiththeplan','toolbar=no,location=no,directories=no,status=no,menubar=no
,resizable=yes,copyhistory=no,scrollbars=1,width=560,height=400');
}
//-->
</SCRIPT>
</head>
</body>
<div name=txt>detta är textraden som skall ändras</div>
<br>
</body>
</html>

Är ni med på vad jag menar?

Hur kan ett sådant exempel se ut?

/t

------------------
the man with the golden bottle..

[Redigerat av tlee den 29 okt 2001]

JojoxxMedlem sedan juni 20004 308 inlägg
#2
<script language="JavaScript" type="text/javascript">
function writeit(Id,string){
	if (document.all){
		document.all[Id].innerHTML = string;
	} else if (document.getElementById){
		jxdocrange = document.createRange();
		jxdocrange.setStartBefore(document.getElementById(Id));
		while (document.getElementById(Id).hasChildNodes()){
			document.getElementById(Id).removeChild(document.getElementById(Id).lastChild);
		}
		document.getElementById(Id).appendChild(jxdocrange.createContextualFragment(string));
	}
}
</script>
<div id="txt">detta är textraden som skall ändras</div>

anropas ex. från onChange med onChange="writeit('txt','Ny text');"

------------------
/ J

tleeMedlem sedan mars 2001290 inlägg
#3

Tack för hjälpen Jojoxx, känns bra att du ställer upp! :)

Jag får följande felmeddelande:

'document.all[...]' är null eller inte ett objekt

jag anropar såhär..

<SELECT NAME=sel1 onChange="writeit('ändra denna texten','nu är det denna texten')";>
</SELECT>
ändra denna texten

allting ligger inom samma <form> tagg.

JojoxxMedlem sedan juni 20004 308 inlägg
#4

Du sag att jag andrat <div name=txt> till <div id="txt">?

------------------
/ J

tleeMedlem sedan mars 2001290 inlägg
#5

Hej alla glada!

Nu funkar det, men efter att jag har varit inne och grejat och lagt till lite grejer
så funkar det inte alls..

<OPTION VALUE='190:128P4:Dimm PC133 128Mb 3,3v168p'>Dimm PC133 128Mb 3,3v168p</OPTION>

Ur denna stringen skall jag plocka ut priset, artikelnr och artikelnamn, dom är separerade i den
ordningen med kolon, och sen sätta samman till en sträng som ser ut ungefär såhär:

<a href=more_info.asp?Artikelnr=128P4>Dimm PC133 128Mb 3,3v168p</a>

och när man väljer någon i rullmenyn skall strängen placeras inom div taggen:

<div id="txt"><a href=more_info.asp?Artikelnr=128P4>Dimm PC133 128Mb 3,3v168p</a></div>

och sen när man väljer en ny rullgardin så skrivs det gamla värdet över med en ny länk(värdet i string).

Nedan är koden, jag har ändrat i jojoxx writeit() funktion och laggt in den i
Calc() funktionen.. men nu funkar den inte..

Felet jag får just nu är:

'document.all[...]' är null eller inte ett objekt

Och sen hur jag plockar ut artikelnr och artikelnamn det vette fåglarna, kan någon hjälpa till med det?

/t

<HTML>
<HEAD>
<script lanugage=javascript>
<!--

function Calc(iMax, Id){

// Fixa inmatade ',' decimaltecken till '.'

var slask="";
apa = document.f_Conf.txtPercent.value;
for(var i=0;i<=apa.length;i++) {
    if (apa.charAt(i)==',') { slask=slask+'.';
    } else { slask=slask+apa.charAt(i); }
}

var iResult=0,iArt="",i,selValue,prize, intPercent;
for(i=1; i<=iMax; i++){
selValue=eval("document.f_Conf.sel"+i+".options[document.f_Conf.sel"+i+".selectedIndex].value")
iArt+=eval("document.f_Conf.sel"+i+".selectedIndex");
prize=parseFloat(selValue.split(":"));
if(isNaN(prize)){ prize=0; }
iResult+=prize

// byta ut texten ..
// hur får jag ut ArticleNr och ArtikelNamnet från strängen???????????????
strArticleNr = selValue.split(":"));
strArticleName = selValue.split(":"));

string = "<a href=more_info.asp?ID="+strArticleNr+">"+strArticleName+"</a>"

if (document.all){
document.all[Id].innerHTML = string;
} else if (document.getElementById){
jxdocrange = document.createRange();
jxdocrange.setStartBefore(document.getElementById(Id));
while (document.getElementById(Id).hasChildNodes()){
document.getElementById(Id).removeChild(document.getElementById(Id).lastChild);
}
document.getElementById(Id).appendChild(jxdocrange.createContextualFragment(string));
}

}
document.f_Conf.txtResult.value = iResult;
document.f_Conf.txtArticleNr.value = iArt;

intPercent = parseFloat(slask);

if (isNaN(intPercent)) {
intPercent=100;
} else {
intPercent += 100;
}
document.f_Conf.txtResultPercent.value = (intPercent * parseFloat(document.f_Conf.txtResult.value))/100;

}
-->
</script>

</HEAD>

<BODY background=/Images/background-2000x050.gif onload=javascript:Calc('15');>
<form method=post action=show_conf.asp name=f_Conf>
<table border=0 cellpadding=2 cellspacing=2 width=600>
<tr vAlign=top>
<TD><TABLE border=1 cellpadding=5 cellspacing=0><TR>
<TD>Grundsystem</TD>
</TR>
<TR><TD>
<SELECT NAME=sel1 onChange=javascript:Calc('5','txt');>
<OPTION SELECTED VALUE='770:CP900:Cpu Celeron 900MHz 128K'>Cpu Celeron 900MHz 128K</OPTION>
<OPTION VALUE='880:CP950:Cpu Celeron 950MHz 128K'>Cpu Celeron 950MHz 128K</OPTION>
<OPTION VALUE='1050:CP10G:Cpu Celeron 1000MHz 128K'>Cpu Celeron 1000MHz 128K</OPTION>
<OPTION VALUE='1710:P3866:Cpu Pentium III 866MHz'>Cpu Pentium III 866MHz</OPTION>
<OPTION VALUE='2310:P310G:Cpu Pentium III 1000MHz'>Cpu Pentium III 1000MHz</OPTION>
</SELECT>
</TD></TR>
<TR><TD>
<SELECT NAME=sel2 onChange=javascript:Calc('5','txt');>
<OPTION VALUE='190:128R8:Rambus minne PC800 128MB'>Rambus minne PC800 128MB</OPTION>
<OPTION VALUE='190:128P4:Dimm PC133 128Mb 3,3v168p'>Dimm PC133 128Mb 3,3v168p</OPTION>
<OPTION VALUE='190:2563E:Dimm PC133 256Mb ECC 168p'>Dimm PC133 256Mb ECC 168p</OPTION>
<OPTION VALUE='190:256P4:Dimm PC133 256Mb 3,3v168p'>Dimm PC133 256Mb 3,3v168p</OPTION>
<OPTION SELECTED VALUE='140:64MP4:Dimm PC133  64Mb 3,3v168p'>Dimm PC133  64Mb 3,3v168p</OPTION>
</SELECT>
</TD></TR>
<TR><TD>
<SELECT NAME=sel3 onChange=javascript:Calc('5','txt');>
<OPTION VALUE='190:HG307:Hårddisk IDE 30Gb 7200rpm'>Hårddisk IDE 30Gb 7200rpm</OPTION>
<OPTION VALUE='190:HG400:Hårddisk IDE 40Gb 7200rpm'>Hårddisk IDE 40Gb 7200rpm</OPTION>
<OPTION VALUE='190:HG600:Hårddisk IDE 60Gb 7200rpm'>Hårddisk IDE 60Gb 7200rpm</OPTION>
<OPTION SELECTED VALUE=>Utan Hårddisk</OPTION>
</SELECT>
</TD></TR>
<TR><TD>
<SELECT NAME=sel4 onChange=javascript:Calc('5','txt');>
<OPTION VALUE='190:ETHNP:Ethernetkort PCI Combo'>Ethernetkort PCI Combo</OPTION>
<OPTION VALUE='0:ETHTP:Ethern.kort PCI 10/100 TP'>Ethern.kort PCI 10/100 TP</OPTION>
<OPTION SELECTED VALUE=>Inget Nätverk</OPTION>
</SELECT>
</TD></TR>
<TR><TD>
<SELECT NAME=sel5 onChange=javascript:Calc('5','txt');>
<OPTION SELECTED VALUE='190190:CE600:Miditower chassi ATX'>Miditower chassi ATX</OPTION>
<OPTION VALUE='190:FK320:Semitower chassi ATX'>Semitower chassi ATX</OPTION>
</SELECT>
</TD></TR>
</TABLE></TD>
</tr>
</table>
<br>
<table border=0 cellpadding=0 cellspacing=0 width=600>
<tr>
<td width=300>Nettopris för ovanstående konfiguration är:</td><td> <input type=text name=txtResult readonly> <i> (exkl moms)</i> </td>
</tr>
<tr>
<td width=300>Med <input type=text name=txtPercent size=2 OnChange=javascript:Calc('5','txt');> % i påslag blir det:</td><td><input type=text name=txtResultPercent readonly><i> (exkl moms)</i> </td>
</tr>
<TR>
<td width=300> </td><td> <input type=hidden name=txtArticleNr> </td>
</tr>
</table>
<input type=hidden name=txtMax value=15>
<br><br>Förhandsgranska din beställning. <input type=image value=submit src=/images/button_ok.gif>  <a href=javascript:history.go(-1);><img src="/Images/button_back.gif" border=0></A>
<input type=hidden name=txtConfigName value='Arlec dator system'>
<div id="txt"></div>
</form>

------------------
the man with the golden bottle..

[Redigerat av tlee den 29 okt 2001]

tleeMedlem sedan mars 2001290 inlägg
#6

ingen som vet ?

------------------
the man with the golden bottle..

JojoxxMedlem sedan juni 20004 308 inlägg
#7

Felet ligger i onLoad-eventet i <body>-taggen.

* Det första argumentet skall 5 eftersom du inte har fler <select>-menyer.
* Det andra argumentet är helt utelämnat. Skall vara 'txt'.
* I event skall du inte använda fake-protokollet "JavaScript:".

Alltså; onLoad="Calc('5','txt')"

------------------
/ J

tleeMedlem sedan mars 2001290 inlägg
#8

sådärja!.. nu funkar det.. men inte överallt utan bara på <select> nr 5.

Detta har väl med for loopen antar jag eftersom den loopar igenom alla <select>s till den sista vilket är den femte. Kan man på något sätt få den att välja den sista <select> som man gjorde ett nytt val i ?

Jag bifogar fungerande den fungerande koden.

<HTML>
<HEAD>
<script lanugage=javascript>
<!--

function Calc(iMax, Id){

// Fixa inmatade ',' decimaltecken till '.'
var slask="";
apa = document.f_Conf.txtPercent.value;
for(var i=0;i<=apa.length;i++){
if (apa.charAt(i)==',') { slask=slask+'.'; }
else { slask=slask+apa.charAt(i); }
}

// deklarera variabler

var iResult=0,iArt="",i,selValue,prize, intPercent;

// loopa igenom alla <select>:s och hämta värdena.

for(i=1; i<=iMax; i++){
selValue=eval("document.f_Conf.sel"+i+".options[document.f_Conf.sel"+i+".selectedIndex].value")
iArt+=eval("document.f_Conf.sel"+i+".selectedIndex");

// stycka upp och smäll in i en array

var arr_Main = selValue.split(":");
prize=parseFloat(arr_Main[0]);
strArticleNr = arr_Main[1];
strArticleName = arr_Main[2];

// baka ihop till en länksträng

string = "<a href=# OnClick=OpenWindow('more_info.asp?ID="+strArticleNr+"');>"+strArticleName+"</a>";

if(isNaN(prize)){ prize=0; }
iResult+=prize

// byta ut texten inom <div> taggarna med värdet i string .

if (document.all){
document.all[Id].innerHTML = string;
} else if (document.getElementById){
jxdocrange = document.createRange();
jxdocrange.setStartBefore(document.getElementById(Id));
while (document.getElementById(Id).hasChildNodes()){
document.getElementById(Id).removeChild(document.getElementById(Id).lastChild);
}
document.getElementById(Id).appendChild(jxdocrange.createContextualFragment(string));
}

}

// skriv ut priset och artikelnumret

document.f_Conf.txtResult.value = iResult;
document.f_Conf.txtArticleNr.value = iArt;

// skall det vara påslag fixa det.

intPercent = parseFloat(slask);

if (isNaN(intPercent)) {
intPercent=100;
} else {
intPercent += 100;
}
document.f_Conf.txtResultPercent.value = (intPercent * parseFloat(document.f_Conf.txtResult.value))/100;

}

function OpenWindow(Url)
{
window.open(Url,'themanwiththeplan','toolbar=no,location=no,directories=no,status=no,menubar=no,resizable=yes,copyhistory=no,scrollbars=1,width=560,height=400');
}

-->
</script>

</HEAD>

<BODY background=/Images/background-2000x050.gif onload="Calc('5','txt');">
<form method=post action=show_conf.asp name=f_Conf>
<table border=0 cellpadding=2 cellspacing=2 width=600>
<tr vAlign=top>
<TD><TABLE border=1 cellpadding=5 cellspacing=0><TR>
<TD>Grundsystem</TD>
</TR>
<TR><TD>
<SELECT NAME=sel1 onChange="Calc('5','txt');">
<OPTION SELECTED VALUE='770:CP900:Cpu Celeron 900MHz 128K'>Cpu Celeron 900MHz 128K</OPTION>
<OPTION VALUE='880:CP950:Cpu Celeron 950MHz 128K'>Cpu Celeron 950MHz 128K</OPTION>
<OPTION VALUE='1050:CP10G:Cpu Celeron 1000MHz 128K'>Cpu Celeron 1000MHz 128K</OPTION>
<OPTION VALUE='1710:P3866:Cpu Pentium III 866MHz'>Cpu Pentium III 866MHz</OPTION>
<OPTION VALUE='2310:P310G:Cpu Pentium III 1000MHz'>Cpu Pentium III 1000MHz</OPTION>
</SELECT>
</TD></TR>
<TR><TD>
<SELECT NAME=sel2 onChange="Calc('5','txt');">
<OPTION VALUE='190:128R8:Rambus minne PC800 128MB'>Rambus minne PC800 128MB</OPTION>
<OPTION VALUE='190:128P4:Dimm PC133 128Mb 3,3v168p'>Dimm PC133 128Mb 3,3v168p</OPTION>
<OPTION VALUE='190:2563E:Dimm PC133 256Mb ECC 168p'>Dimm PC133 256Mb ECC 168p</OPTION>
<OPTION VALUE='190:256P4:Dimm PC133 256Mb 3,3v168p'>Dimm PC133 256Mb 3,3v168p</OPTION>
<OPTION SELECTED VALUE='140:64MP4:Dimm PC133  64Mb 3,3v168p'>Dimm PC133  64Mb 3,3v168p</OPTION>
</SELECT>
</TD></TR>
<TR><TD>
<SELECT NAME=sel3 onChange="Calc('5','txt');">
<OPTION VALUE='190:HG307:Hårddisk IDE 30Gb 7200rpm'>Hårddisk IDE 30Gb 7200rpm</OPTION>
<OPTION VALUE='190:HG400:Hårddisk IDE 40Gb 7200rpm'>Hårddisk IDE 40Gb 7200rpm</OPTION>
<OPTION VALUE='190:HG600:Hårddisk IDE 60Gb 7200rpm'>Hårddisk IDE 60Gb 7200rpm</OPTION>
<OPTION SELECTED VALUE=>Utan Hårddisk</OPTION>
</SELECT>
</TD></TR>
<TR><TD>
<SELECT NAME=sel4 onChange="Calc('5','txt');">
<OPTION VALUE='190:ETHNP:Ethernetkort PCI Combo'>Ethernetkort PCI Combo</OPTION>
<OPTION VALUE='0:ETHTP:Ethern.kort PCI 10/100 TP'>Ethern.kort PCI 10/100 TP</OPTION>
<OPTION SELECTED VALUE=>Inget Nätverk</OPTION>
</SELECT>
</TD></TR>
<TR><TD>
<SELECT NAME=sel5 onChange="Calc('5','txt');">
<OPTION SELECTED VALUE='190190:CE600:Miditower chassi ATX'>Miditower chassi ATX</OPTION>
<OPTION VALUE='190:FK320:Semitower chassi ATX'>Semitower chassi ATX</OPTION>
</SELECT>
</TD></TR>
</TABLE></TD>

</tr>
</table>

<br>
<table border=0 cellpadding=0 cellspacing=0 width=600>
<tr>
<td width=300>Nettopris för ovanstående konfiguration är:</td><td> <input type=text name=txtResult readonly> <i> (exkl moms)</i> </td>
</tr>
<tr>
<td width=300>Med <input type=text name=txtPercent size=2 OnChange="Calc('5','txt');"> % i påslag blir det:</td><td><input type=text name=txtResultPercent readonly><i> (exkl moms)</i> </td>
</tr>
<TR>
<td width=300> </td><td> <input type=hidden name=txtArticleNr> </td>
</tr>
</table>
<input type=hidden name=txtMax value=15>
<br><br>Förhandsgranska din beställning. <input type=image value=submit src=/images/button_ok.gif>  <a href=javascript:history.go(-1);><img src="/Images/button_back.gif" border=0></A>
<input type=hidden name=txtConfigName value='Arlec dator system'>
<div id="txt"></div>
</form>
<br><br>

/t

------------------
the man with the golden bottle..

[Redigerat av tlee den 29 okt 2001]

[Redigerat av tlee den 29 okt 2001]

[Redigerat av tlee den 29 okt 2001]

139 ms totalt · 3 externa anrop · v20260731065814-full.30151723
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
137 ms — hämta tråd, inlägg och bilagor (db)