Skip to main content
November 18, 2008
Answered

Need simple answer for my Javascript, please?

  • November 18, 2008
  • 5 replies
  • 826 views
In my CF application, I need to add a javascript for text fields validation.
I already have the script, the bad news is there has been another javascript for that same text fields where its
functionality is for number calculation. This existing script uses OnKeyUp for those text fields where I'm supposed to also use OnKeyUp for validation check

I'm no javascript expert and have tried to put 2 OnKeyUp within the same text fields and my attempt causes the validation script not functioning.
How can I use my validation script for the same text field where calculation script has used OnKeyUp event handler? Please help!

Here is what I can't figure out:

//My script to prevent user from entering special characters when submitting data

<script language="JavaScript">

var mikExp = /[$\\@\\\#%\^\&\*\(\)\[\]\+\_\{\}\`\~\=\|-]/;
function checkeachfield(val) {
var strPass = val.value;
var strLength = strPass.length;
var lchar = val.value.charAt((strLength) - 1);
if(lchar.search(mikExp) != -1) {
var tst = val.value.substring(0, (strLength) - 1);
val.value = tst;
}
}
//
</script>

// Below is part of the existing script for number calculation. I'm not suppose to modify this script:
<script language="JavaScript">

function calctotal() {
document.cost.f2.value = document.cost.f1.value * 0.25;
document.cost.f5.value = document.cost.f4.value * 0.25;
document.cost.al2.value = document.cost.al1.value * 0.25;
document.cost.al5.value = document.cost.al4.value * 0.25;
document.cost.nf2.value = document.cost.nf1.value * 0.25;
document.cost.nf5.value = document.cost.nf4.value * 0.25;
document.cost.nal2.value = document.cost.nal1.value * 0.25;
document.cost.nal5.value = document.cost.nal4.value * 0.25;

var f1 = parseFloat(document.cost.f1.value);
var f2 = parseFloat(document.cost.f2.value);
var f4 = parseFloat(document.cost.f4.value);
var f5 = parseFloat(document.cost.f5.value);
var f8 = parseFloat(document.cost.f8.value);
var al1 = parseFloat(document.cost.al1.value);
...............etc
</script>

<!--- I don't know how to call these 2 functions from these text fields --->

<input name="f1" type="text" onKeyUp="calctotal();" value="0"
onKeyUp="javascript:checkeachfield(xyz.f1);"> ???

<input name="f2" type="text" onKeyUp="calctotal();" value="0"
onKeyUp="javascript:checkeachfield(xyz.f2);"> ???

<input name="f3" type="text" onKeyUp="calctotal();" value="0"
onKeyUp="javascript:checkeachfield(xyz.f3);"> ???

.
.
.
.
V
More text fields need to be check for special chars












This topic has been closed for replies.
Correct answer -__cfSearching__-
> The First function is still working but not the second function

If you are using Firefox, check Tools -> Error Console to view any javascript errors

5 replies

Inspiring
November 20, 2008
Interesting. But there should be no problem calling multiple functions. Assuming there are no errors in the javascript of course.

In any case, I am glad it is working now.
November 20, 2008
I used onkeydown for one and onkeyup on another and it does the trick. Thanks for the help!
-__cfSearching__-Correct answer
Inspiring
November 18, 2008
> The First function is still working but not the second function

If you are using Firefox, check Tools -> Error Console to view any javascript errors
Inspiring
November 18, 2008
Though not always the most elegant, you can call multiple functions:

<input ... onKeyup="firstFunction();secondFunction();" />
November 18, 2008
Thank you but I tried it and it is not working. The First function is still working but not the second function
Inspiring
November 18, 2008
Verify both functions work by themselves. Start simply.

1. Verify the first function <input onKeyUp="firstFunction(...);"...>
2. Then verify the second function <input onKeyUp="secondFunction(...);"...>
3. If both work separately, combine them into a _single_ onKeyUp call




Inspiring
November 18, 2008
You can't have two event handlers for the same event, but there is
nothing preventing the event handler from running two, or more, functions.

The fast, but bad way.

<input .... onKeyUp="calctotal();chekceachfield(zyx.f1);">

Better, with the following script block in the head.
<input ... onKeyUp="doStuff()">

<script..>
function doStuff() {
calctotal();
checkeachfield(zyx.f2);
}

Better yet, eliminate the onKeyUp from the <input...> tag and put it all
in the head script

document.forms[0].f1.onkeyup = function() {
calctotal();
checkeachfield(zyx.f2);
}

All syntax completely untried and untested. As well as, I made no
attempt to actually understand your functions and use them correctly. I
leave that up to you.