Calculate Price Based On Quantity Range

[FunkHouse9]

I am trying to set up a page that calculates a total ad price based on a word count value. I have the word count displaying properly in op3, but just can't get the price even close to working right. If anybody has a clue, I'd appreciate the help. Here's what I have:

 
<script language="JavaScript" type="text/JavaScript"><!--
// Word Count Function 
function cnt(w,x){
var y=w.value;
var r = 0;
a=y.replace(/\s/g,' ');
a=a.split(' ');
for (z=0; z<a.length; z++) {if (a[z].length > 0) r++;}
x.value=r;
}
 
//--></script>
 
<form name="form" action="http://www.xyz.com/sc/cart.cgi" method="post">
 
Ad Content: <textarea onkeyup="cnt(this,document.form.op3)" name="op31"></textarea>
 
Word Count: <input value="0" name="op3" />
 
Ad Cost: <input value="0" name="op4" />
 
<input type="image" src="../../UploadedImages/ShoppingCartButtons/addtocart.gif" name="add" /></p>
</form>
 

I am hoping to take the value of op3 (which is generated from the cnt() function) and use it to determine cost and display that in op4. The cost basis is

If op3 = 1-150, $200
151-300, $350
301-450, $500
451-600, $650
>600 = invalid

Everything function I have tried either makes cnt() not show the word count in op3 or does nothing at all.

[iam_clint]

<script>
function word_count(val) {
val = val.split(" ");
document.form.op3.value = val.length
update_cost(val.length);
}
function update_cost(val) {
var price = "";
if (val>=1 && val<=150) { price = "$200"; }
if (val>=151 && val<=300) { price = "$350"; }
if (val>=301 && val<=450) { price = "$500"; }
if (val>=451 && val<=600) { price = "$650"; }
if (val>600) { price = "Invalid"; }
document.form.op4.value = price;
}
</script>
<form name="form" action="http://www.xyz.com/sc/cart.cgi" method="post">
Ad Content: <textarea onkeyup="word_count(this.innerHTML)" name="op31"></textarea>
Word Count: <input value="0" name="op3" />
Ad Cost: <input value="0" name="op4" />
<input type="image" src="../../UploadedImages/ShoppingCartButtons/addtocart.gif" name="add" /></p>
</form>
 

try that on for size (its a pretty skirt...) :P

[FunkHouse9]

The price calculation works great! The only thing I see is that if with the new word count function, it counts the spaces, so if you double space a sentence it will count the extra space as another word. I can try to figure that out though.

Thanks so much!!!!!!!! I spent a ton of time on that and got nowhere.

[FunkHouse9]

Already got it. I changed:

val = val.split(" ");
to
val = val.split(/\s+/g);

I'm sure you knew that though.

Thanks again!

[iam_clint]

yes but thanks for replying your result sorry I wasn't even thinking about double spaces.. duh! :) glad I could help

[pbmods]

*ahem*

val.match(/\b\w+\b/g).length;
 

[FunkHouse9]

*ahem*

val.match(/\b\w+\b/g).length;
 

Well, I can't say I know what that means, but I tried putting it in my function and it either made things stop working or started counting characters. What should that be doing differently and if it's better to have it, where should it go? Seems to be working fine without.

[pbmods]

Well, I can't say I know what that means, but I tried putting it in my function and it either made things stop working or started counting characters. What should that be doing differently and if it's better to have it, where should it go? Seems to be working fine without.

val.match(/\b\w+\b/g).length;
 

evaluates to the number of words in val.

Basically, it invokes val.match, which searches for a string within a string. The argument in match is a regular expression which searches for alpha-numeric characters separated by non-alpha-numeric characters. The '/g' part means to return ALL matches in the form of an array.

And then we get the length of the resulting array.

So if you set val to, say "This is a long string with a bunch of words in it.",

val.match(/\b\w+\b/g).length;
 

would evaluate to 12.

[iam_clint]

so let me put it in the code for you

<script>
function word_count(val) {
var words =  val.match(/\b\w+\b/g).length;
document.form.op3.value = words;
update_cost(words);
}
function update_cost(val) {
var price = "";
if (val>=1 && val<=150) { price = "$200"; }
if (val>=151 && val<=300) { price = "$350"; }
if (val>=301 && val<=450) { price = "$500"; }
if (val>=451 && val<=600) { price = "$650"; }
if (val>600) { price = "Invalid"; }
document.form.op4.value = price;
}
</script>
<form name="form" action="http://www.xyz.com/sc/cart.cgi" method="post">
Ad Content: <textarea onkeyup="word_count(this.innerHTML)" name="op31"></textarea>
Word Count: <input value="0" name="op3" />
Ad Cost: <input value="0" name="op4" />
<input type="image" src="../../UploadedImages/ShoppingCartButtons/addtocart.gif" name="add" /></p>
</form>
 

[pbmods]

Shoot. I forgot two things. First off, if you want to learn more about regular expressions, check out this site:

http://www.regular-expressions.info/

I also realized that the code I provided will generate an error if there are zero (and sometimes one) words.

So you have to modify things a little bit.

Using the code provided by iam_clint:

function word_count(val) {
var words =  val.match(/\b\w+\b/g);
 
words = ((words && (words.constructor == Array))
    ? words.length
    : 1 * Boolean(words)
);
 
document.form.op3.value = words;
update_cost(words);
}
 

If there are zero words, then val.match(/\b\w+\b/g) will evaluate to null (which if converted to a Boolean, resolves to false, which we can turn into 0). If you try to get words.length when words is null, though, you'll get an error on some browsers, and a non-numeric result on others.

If there is only one word, depending on the browser, val.match(/\b\w+\b/g) might evaluate to an array with one element, or it might be a string containing that word. If it is a string, words.length will be the number of characters in that string instead of the number of words. So if words is not an array, we return 1 (we use Boolean(words), which evaluates to true, * 1 to turn it into a number; alternately, you could use Number(Boolean(words)).

If there is more than one word, this code still works as intended.