PDA

Click to See Complete Forum and Search --> : Combining scripts by Charles,Willy,Kor,javaNoobie - a little problem

GurusGuru
08-14-2004, 02:59 AM
I have combined the scripts by Charles, Willy, Kor and javaNoobie. I am able to get the values in A and B. However, the addition is not taking place in C. Is it because of the onchange or disabled features used. Or is it something else.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script language="JavaScript" type="text/JavaScript">
function changeV(v,f){
if(v.length>9){
f.elements['A'].value=250;
}
else if(v.length<9){
f.elements['A'].value=0;
}
}
</script>
<script language="javascript" type="text/javascript">
function changeValue(val,f){
if(val=="182"){
f.elements['B'].value="100";
}else if(val=="365"){
f.elements['B'].value="200";
}else if(val=="730"){
f.elements['B'].value="300";
}else{
f.elements['B'].value="0";
}
}
</script>
</head>

<body>

<form>
<input name="URL" size="35" maxlength="50" value="http://" onkeyup="changeV(this.value,this.form)">
<input name="A" size="3" maxlength="3" value="0" onchange="this.form.C.value = Number (this.value) + Number (this.form.B.value)" disabled>

<br>
<br>
<select class="field" name="ExpireDays" size="1" onchange="changeValue(this.value,this.form)">
<option>--- Select Ad Option ---
<option value="30">Test stage</option>
<option value="182">6 Months</option>
<option value="365">1 Year</option>
<option value="730">2 Years</option>

</select><input name="B" size="5" value="0" onchange="this.form.C.value = Number (this.value) + Number (this.form.A.value)" disabled>
<br>
<br>
Total <input name="C" size="5" value="0" disabled>
</form>
</body>

</html>
sciguyryan
08-14-2004, 05:20 AM
Yes it is the disabled feature.
Any element that is disabled can not recieve script focus or, can not be modified by scripting (Unless making it un-disabled)

I suggesy you undisable the element, then imediatly after the statement re-disable it :)

Note: You'll have to do it something like:


<script type="text/javascript">
<!--
var Elm = document.getElemtntById("Your Elements ID Here");
Elm.disabled = false;
// Statements here
Elm.disabled = true;
//-->
</script>


Hope that helps,


RyanJ
Willy Duitt
08-14-2004, 05:53 AM
Why are you disabling the field(s)?
Are you trying to prevent the user from editting the content?

If so, just use the READONLY attribute on those fields you do not want editted...

IE: <input name="C" size="5" value="0" readonly="readonly">

.....Willy
GurusGuru
08-14-2004, 07:02 AM
I tried by removing the disabled and readonly attributes also. Still the total is not being shown.

I tried sciguyryan's script also. Getting the following error :
Object doesn't support this property or method.
Willy Duitt
08-14-2004, 08:22 AM
You are using an onkeyup event handler on the one and an onchange event handler on the other field to update your calculations. Without being able to place focus on those fields there is no way to invoke the calculations....

Are you trying to do something like this?


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script type="text/javascript">
function upDate(input){
var form = document.forms[0];
if(input.name.match(/URL/gi)){
if(input.value.length > 9){
form.A.value = 250;
} else{ form.A.value = 0 };
}

if(input.name.match(/ExpireDays/gi)){
form.B.value = (input.selectedIndex*100)-100;
} form.C.value = (form.A.value*1)+(form.B.value*1);
}
</script>
</head>

<body>
<form>
<input name="URL" size="35" maxlength="50" value="http://" onchange="upDate(this)">
<input name="A" size="3" maxlength="3" value="0" readonly="readonly">
<p>
<select name="ExpireDays" class="field" size="1" onchange="upDate(this)">
<option>--- Select Ad Option ---
<option value="30">Test stage</option>
<option value="182">6 Months</option>
<option value="365">1 Year</option>
<option value="730">2 Years</option>
</select>
<p>
<input name="B" size="5" value="0" readonly="readonly">
<p>Total
<input name="C" size="5" value="0" readonly="readonly">
</form>
</body>
</html>


.....Willy
GurusGuru
08-14-2004, 08:45 AM
Thanks.

Actually the B values are not exact multiples of 100. I have to add more options eg 90, 150 etc. At present it is 0, 100, 200, 300. This will change to 0, 90, 150, 250 etc. In this case what configurations are required.
steelersfan88
08-14-2004, 09:01 AM
oh by the way ... Chares would neve rlet you live with that doctype ... :D
Willy Duitt
08-14-2004, 09:25 AM
Originally posted by GurusGuru
Thanks.

Actually the B values are not exact multiples of 100. I have to add more options eg 90, 150 etc. At present it is 0, 100, 200, 300. This will change to 0, 90, 150, 250 etc. In this case what configurations are required.

I don't know....
I suppose you could do a whole much of if/else conditionals or use a switch but iffin it was me, I would try to find some kind of formula that would work to set the values.... I actually figured you would be changing that so I did not spend much time on it... Also, I would assume that you would like the URL field to be a required field and thus I would recommend a regular expression to check for a valid URL...

Just do what you can and if you have any questions, post again. I'm sure someone will be able to answer any questions you may have...

.....Willy
GurusGuru
08-15-2004, 03:03 AM
Made the following changes. It works. But may have some mistake. Can you please check it.

<script type="text/javascript">
function upDate(input){
var form = document.forms[0];
if(input.name.match(/URL/gi)){
if(input.value.length > 9){
form.A.value = 250;
} else{ form.A.value = 0 };
}
if(input.name.match(/ExpireDays/gi)){
if(input.value == 30){
form.B.value = 90;
} else if(input.value == 182){
form.B.value = 178;
} else if(input.value == 365){
form.B.value = 256;
} else{
form.B.value = 0;
}
} form.C.value = (form.A.value*1)+(form.B.value*1);
}

</script>
Willy Duitt
08-15-2004, 03:25 AM
Instead of all the if/else conditionals how about making another array listing the values you wish to use in your calculations in the order they appear in your option menu and then still use the selectedIndex....


<script type="text/javascript">
function upDate(input){
var form = document.forms[0];
if(input.name.match(/URL/gi)){
if(input.value.length > 9){
form.A.value = 250;
} else{ form.A.value = 0 };
}

if(input.name.match(/ExpireDays/gi)){
var expireValues = [0,90,178,256];
form.B.value = expireValues[input.selectedIndex];
} form.C.value = (form.A.value*1)+(form.B.value*1);
}
</script>


.....Willy