# Thread: [RESOLVED] Javascript Simple Mathematical Problem

1. Registered User
Join Date
May 2014
Posts
8

## [RESOLVED] Javascript Simple Mathematical Problem

I have a script which reads the contents of an attached file and prints the number of words. I then wanted to add another field which does a simple mathematical calculation based on word count and displays below. However the calculation does not work.

Code:
```<script type="text/javascript">
function loadDemo() {

WordCount.words("file_attach", function(words) {
//document.getElementById("words").value = words;
document.getElementById("words").innerText = words;
})};

var elt = document.getElementById("words");
var totalwords = elt.textContent;

totalwords = parseInt(totalwords,10);

var totalprice = totalwords * 12;

document.getElementById("tprice").innerText = totalprice;
</script>```
Code:
```<label for="name"><span>Name</span>
<input type="text" name="name" id="name" placeholder="Enter Your Name" />
</label>

<label for="email"><span>Email Address</span>
<input type="email" name="email" id="email" placeholder="Enter Your Email" />
</label>

<label for="file"><span>Attachment</span>
<input type="file" name="file_attach" id="file_attach" />
</label>

<label for="words"><span>No. of Words</span>
<span id="words"> </span>
<input readonly type="number" id="words"/>
</label> <br/>

<label for="tprice"><span>Price</span>
<span id="tprice"> </span>
<input readonly id="tprice"/>
</label> <br/>

<label for="message"><span>Message</span>
<textarea name="message" id="message" placeholder="Enter Your Name"></textarea>
</label>```
Above is the script and form where variables should be printed. Function is called using onLoad inside the body tag.
I also found the following error inside chrome debug

'Uncaught TypeError: Cannot read property 'textContent' of null'

Any help would be great as this is the final thing stopping me from completing this site!

Thanks!

2. Registered User
Join Date
Mar 2009
Posts
590
1. In your HTML you have both a SPAN element and an INPUT element with the same ID ("words"). Don't do that.
Code:
```<span id="words"> </span>
<input readonly type="number" id="words"/>```
2. Where is, and what is "WordCount.words" ?

3. Although you may have your "loadDemo()" function called upon window.onload, the remainder of your script will fire (assuming its in the HEAD) immediately, probably before the DOM is loaded, in which case it won't work.

4. Where you have
Code:
`var totalwords = elt.textContent;`
this yields a string. You can't count the words in it by subjecting it to the 'parseInt' function. Although not perfect, because you can't assume that all words are separated by a space, you could do something like:

Code:
```totalWords = totalWords.split(" "); //split into an array by spaces
totalWords = totalWords.length;  //hopefully the number of words```
--There may be other things wrong with your code, but these are issues you should address.

3. Registered User
Join Date
May 2014
Posts
8
Thanks for the reply!

I only had span and input because i was playing around with fixed etc! I have an external JS file which does the word count of attachment (WordCount). I took your snippet of code but it still gives me the

'Uncaught TypeError: Cannot read property 'textContent' of null ' pointing at this line in script

var totalwords = elt.textContent;

I just dont understand how its returning null when the value has just been set in a span?

4. Registered User
Join Date
May 2014
Posts
8
Managed to fix it!

Final script:

Code:
```function loadDemo() {

WordCount.words("file_attach", function(words) {
document.getElementById("words").innerText = words

document.getElementById("tprice").innerText = parseInt(document.getElementById("words").innerHTML,10)/500*12;

})};```

5. Registered User
Join Date
Mar 2009
Posts
590
Managed to fix it!
Good!!!
Last edited by Tcobb; 05-30-2014 at 12:57 AM. Reason: OP fixed it.

6. Banned
Join Date
May 2014
Posts
1,126
Two tips:
1) avoid making extra calls to document.get_xxxxx methods when you already have an elements value.
2) some formatting that makes sense would make it a LOT clearer what you are doing... particularly since your closes don't make any sense because of it, even in your 'fixed' post.

Code:
```function loadDemo() {
WordCount.words('file_attach', function(words) {
document.getElementById("words").innerText = words;
document.getElementById("tprice").innerText = parseInt(words, 10) / 500 * 12;
});
}```

#### Thread Information

##### Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

#### Posting Permissions

• You may not post new threads
• You may not post replies
• You may not post attachments
• You may not edit your posts
•

"

"

## X vBulletin 4.2.2 Debug Information

• Page Generation 0.17328 seconds
• Memory Usage 2,891KB
• Queries Executed 15 (?)
More Information
Template Usage (34):
• (1)SHOWTHREAD
• (1)ad_footer_end
• (1)ad_footer_start
• (1)ad_global_above_footer
• (1)ad_global_below_navbar
• (1)ad_global_header1
• (1)ad_global_header2
• (1)ad_navbar_below
• (1)ad_showthread_firstpost_sig
• (1)ad_showthread_firstpost_start
• (1)ad_thread_first_post_content
• (1)ad_thread_last_post_content
• (7)bbcode_code
• (1)bbcode_quote
• (1)footer
• (1)forumjump
• (1)forumrules
• (1)gobutton
• (1)header
• (1)headinclude
• (1)headinclude_bottom
• (6)memberaction_dropdown
• (1)navbar
• (4)navbar_link
• (1)navbar_moderation
• (1)navbar_noticebit
• (1)navbar_tabs
• (2)option
• (6)postbit
• (6)postbit_onlinestatus
• (6)postbit_wrapper
• (1)spacer_close
• (1)spacer_open
• (1)tagbit_wrapper

Phrase Groups Available (6):
• global
• inlinemod
• postbit
• posting
• reputationlevel
• showthread
Included Files (26):
• ./showthread.php
• ./global.php
• ./includes/class_bootstrap.php
• ./includes/init.php
• ./includes/class_core.php
• ./includes/config.php
• ./includes/functions.php
• ./includes/functions_navigation.php
• ./includes/class_friendly_url.php
• ./includes/class_hook.php
• ./includes/class_bootstrap_framework.php
• ./vb/vb.php
• ./vb/phrase.php
• ./includes/functions_facebook.php
• ./includes/functions_calendar.php
• ./includes/functions_bigthree.php
• ./includes/class_postbit.php
• ./includes/class_bbcode.php
• ./includes/functions_reputation.php
• ./includes/functions_notice.php
• ./packages/vbattach/attach.php
• ./vb/types.php
• ./vb/cache.php
• ./vb/cache/db.php
• ./vb/cache/observer/db.php
• ./vb/cache/observer.php

Hooks Called (70):
• init_startup
• friendlyurl_resolve_class
• init_startup_session_setup_start
• database_pre_fetch_array
• database_post_fetch_array
• init_startup_session_setup_complete
• global_bootstrap_init_start
• global_bootstrap_init_complete
• cache_permissions
• fetch_threadinfo_query
• fetch_threadinfo
• fetch_foruminfo
• load_show_variables
• load_forum_show_variables
• global_state_check
• global_bootstrap_complete
• global_start
• style_fetch
• global_setup_complete
• showthread_start
• showthread_getinfo
• strip_bbcode
• friendlyurl_clean_fragment
• friendlyurl_geturl
• forumjump
• cache_templates
• cache_templates_process
• template_register_var
• template_render_output
• fetch_template_start
• fetch_template_complete
• parse_templates
• fetch_musername
• notices_check_start
• notices_noticebit
• process_templates_complete
• friendlyurl_redirect_canonical
• showthread_post_start
• showthread_query_postids
• showthread_query
• bbcode_fetch_tags
• bbcode_create
• showthread_postbit_create
• postbit_factory
• postbit_display_start
• postbit_imicons
• bbcode_parse_start
• bbcode_parse_complete_precache
• bbcode_parse_complete
• postbit_display_complete
• memberaction_dropdown
• tag_fetchbit_complete
• forumrules
• navbits
• navbits_complete
• build_navigation_data
• build_navigation_array
• check_navigation_permission
• process_navigation_links_start
• process_navigation_links_complete
• set_navigation_menu_element
• build_navigation_menudata
• build_navigation_listdata
• build_navigation_list
• set_navigation_tab_main
• set_navigation_tab_fallback
• navigation_tab_complete
• fb_like_button
• showthread_complete
• page_templates