www.webdeveloper.com
Results 1 to 2 of 2

Thread: Calculation of form field entries

  1. #1
    Join Date
    Jun 2011
    Posts
    1

    Calculation of form field entries

    I am a novice user of Expressions Web4 and am attempting to build a form that makes calculations of field entries and displays the results in designated fields. Specifically, multiplying the entry in the pmt_amt field by .03 and placing the result in the srv_fee field, then adding the entry in the pmt_amt field to the result in the srv_fee field to show the resulting sum in the total_pmt_amt field. I have created functions in JavaScript for both calculations and tied them to onClick relative to a button btn_srv_fee.

    I used this method by searching online for an appropriate method and tweaked results for my application. Below is the code for what I am attempting to do. Upon making an entry in the pmt_amt field and then clicking the button, there are no results in neither the srv_fee field or total_amt_field. Below is the code for the functions and the associated section that identifies the fields. Any help to identify my errors or advice on better methods will be greatly appreciated.

    <script type="text/javascript">
    function multiplyNumbers(pmt_amt, .03, ResultField1)
    {
    var PmtAmt = document.getElementById(pmt_amt);
    var ResultField1 = document.getElementById(srv_fee);
    var Result1;
    //Perform Multiplication
    Result1 = parseFloat(PmtAmt.value) * .03;
    //Fix Numbers
    Result1 = Math.round(Result1 * 100) / 100;
    //Show Result1 in ResultField1
    ResultField1.value = Result1
    }
    function addNumbers(pmt_amt, srv_fee, ResultField2)
    {
    var PmtAmt = document.getElementById(pmt_amt);
    var SrvFee = document.getElementById(srv_fee);
    var ResultField2 = document.getElementById(total_pmt_amt);
    var Result2;
    //1. Perform Addition
    Result2 = parseFloat(PmtAmt.value) + parseFloat(SrvFee.value)
    //2. Fix Numbers
    Result2 = Math.round(Result2 * 100) / 100;
    //3. Show Results in ResultField2
    ResultField2.value = Result2
    }
    </script>




    <form method="post" action="">
    <table style="width: 400px">
    <tr>
    <td style="width: 150px">Account Number</td>
    <td>&nbsp;<input name="acct_no" size="14" tabindex="1" type="text" value="000-0-0000-00" /></td>
    </tr>
    <tr>
    <td>Service Address</td>
    <td>
    <input name="srv_addr" size="24" tabindex="2" type="text" /></td>
    </tr>
    <tr>
    <td style="height: 26px">Payment Amount</td>
    <td style="height: 26px">
    <input name="pmt_amt" size="10" tabindex="3" type="text" /></td>
    </tr>
    <tr>
    <td style="height: 34px">Click to calculate</td>
    <td style="height: 34px">
    <input name="btn_srv_fee" type="button" value="Service Fee" tabindex="4"
    onclick="multiplyNumbers(pmt_amt, .03, ResultField1;
    addNumbers(pmt_amt, srv_fee, ResultField2);"
    />&nbsp;</td>



    </tr>
    <tr>
    <td>Service Fee</td>
    <td>
    <input name="srv_fee" size="5" type="text" />&nbsp;</td>
    </tr>
    <tr>
    <td>Total Payment Amount</td>
    <td>
    <input name="total_pmt_amt" size="10" tabindex="5" type="text" />&nbsp;</td>
    </tr>

  2. #2
    Join Date
    Dec 2005
    Location
    TX
    Posts
    7,943

    Lightbulb

    Try this variation on your theme...
    Code:
    <html>
    <head>
    <title> Service Calculations </title>
    
    <script type="text/javascript">
    function ActOnNumbers(fld1,action,fld2,rslt) {          // rt('fld1: '+fld1+'\naction: '+action+'\nfld2: '+fld2+'\nrslt: '+rslt);
      var fld1Value = document.getElementById(fld1).value;  // rt(fld1Value+'\n'+fld1+'\n'+fld2);
      var fld2Value = document.getElementById(fld2).value;  // rt(fld2Value+'\n'+fld2+'\n'+rslt);
      var tmp = 0;
      
      if (action == '*') {
    	tmp = parseFloat(fld1Value) * parseFloat(fld2Value);	// Perform Multiplication
      } else {													// alert(fld1Value+'\n'+fld2Value);
        tmp = parseFloat(fld1Value) + parseFloat(fld2Value);	// Perform Addition
      }
      tmp = tmp.toFixed(2);							// Fix Numbers
      document.getElementById(rslt).value = tmp;	// Show Result in ResultField1
    }
    </script>
    
    <body>
    
    <form name="myForm" method="post" action="" onsubmit="return false">
    <table style="width: 400px">
    <tr>
    <td style="width: 150px">Account Number</td>
    <td>&nbsp;<input name="acct_no" size="14" tabindex="1" type="text" value="000-0-0000-00" /></td>
    </tr>
    <tr>
    <td>Service Address</td>
    <td>
    <input name="srv_addr" size="24" tabindex="2" type="text" /></td>
    </tr>
    <tr>
    <td style="height: 26px">Payment Amount</td>
    <td style="height: 26px">
    <input id="pmt_amt" name="pmt_amt" size="10" tabindex="3" type="text" value="100" /></td>
    </tr>
    <tr>
    <td style="height: 34px">Click to calculate</td>
    <td style="height: 34px">
    <input id="rate" name="rate" type="hidden" value="0.03">
    <input name="btn_srv_fee" type="button" value="Service Fee" tabindex="4"
     onclick="ActOnNumbers('pmt_amt','*','rate','srv_fee');ActOnNumbers('pmt_amt','+','srv_fee','total_pmt_amt');"
    />&nbsp;</td>
    
    </tr>
    <tr>
    <td>Service Fee</td>
    <td>
    <input id="srv_fee" name="srv_fee" size="5" type="text" value="" />&nbsp;</td>
    </tr>
    <tr>
    <td>Total Payment Amount</td>
    <td>
    <input id="total_pmt_amt" name="total_pmt_amt" size="10" tabindex="5" type="text" value="" />&nbsp;</td>
    </tr> 
    
    </body>
    </html>
    You were trying to use getElementById on elements that had no Id values.

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
  •  
HTML5 Development Center

"

"

X vBulletin 4.2.2 Debug Information

  • Page Generation 0.14117 seconds
  • Memory Usage 2,857KB
  • Queries Executed 15 (?)
More Information
Template Usage (33):
  • (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
  • (1)bbcode_code
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)headinclude_bottom
  • (2)memberaction_dropdown
  • (1)navbar
  • (4)navbar_link
  • (1)navbar_moderation
  • (1)navbar_noticebit
  • (1)navbar_tabs
  • (2)option
  • (2)postbit
  • (2)postbit_onlinestatus
  • (2)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