The Zurich release has arrived! Interested in new features and functionalities? Click here for more

UI Page dynamically calculated fields

yundlu316
Kilo Guru

I've created a form using a UI Page and would like some of the fields to dynamically change depending on what is entered in other fields.   For example if a user fills out field A with $100,000 and field B with $25,000, is it possible for field C to dynamically change to $125,000 (A+B) without submitting or reloading the page?   Would that be a client or processing script?

Thanks!

1 ACCEPTED SOLUTION

You do not need onChange client script declaration. Remove everything from the client script section and just copy this


function sum(){


  $('H').value=parseFloat($('D').value)+parseFloat($('G').value);


}


View solution in original post

28 REPLIES 28

Abhinay Erra
Giga Sage

This should work.Can you show me what you are doing here. Did you add onchange event to the input element and define the function in the client script?


find_real_file.png



HTML:


<table>


  <tr class = "form">


      <td class = "letter"><b>A</b></td>


      <td class = "question">Enter "1" for yourself if no one else can claim you as a dependent</td>


      <td class = "form">


  <select onchange="sum()" id = "A" name="personal_allowance_a" >


    <option value="0">0</option>


    <option value="1">1</option>


  </select>


  </td>


  </tr>


  <tr class = "form">


      <td class = "letter"><b>B</b></td>


      <td class = "question">Enter "1" if:


  <ul>


  <li> You are single and have only one job; or </li>


  <li> You are married, have only one job, and your spouse does not work; or </li>


  <li> Your wages from a second job or your spouse's wages (or the total of both) are $1,500 or less.</li>


  </ul>


  </td>


      <td class = "form">


  <select onchange="sum()" id = "B" name="personal_allowance_b" >


    <option value="0">0</option>


    <option value="1">1</option>


  </select>


  </td>


  </tr>


  <tr class = "form">


      <td class = "letter"><b>C</b></td>


  <td class = "question">Enter "1" for your$[SP]<b>spouse</b>. But, you may choose to enter "-0-" if you are married and have either a working spouse or more than one job. (Entering "-0-" may help you avoid having too little tax withheld.)


      </td>


      <td class = "form">


  <select onchange="sum()" id = "C" name="personal_allowance_c" >


    <option value="0">0</option>


    <option value="1">1</option>


  </select>


  </td>


  </tr>


  <tr class = "form">


      <td class = "letter"><b>D</b></td>


  <td class = "question">Enter number of$[SP]<b>dependents</b>$[SP](other than your spouse or yourself) you will claim on your tax return


      </td>


      <td class = "form">


  <input type="text" id="D" name ="personal_allowance_d" maxlength="2" size="2" value="0"   onchange="sum()"></input>


  </td>


  </tr>


  <tr class = "form">


      <td class = "letter"><b>E</b></td>


  <td class = "question">Enter "1" if you will file as$[SP]<b>head of household</b>$[SP]on your tax return (see conditions under$[SP]<b>Head of household</b>$[SP]above)


      </td>


      <td class = "form">


  <select onchange="sum()" id = "E" name="personal_allowance_e" >


    <option value="0">0</option>


    <option value="1">1</option>


  </select>


  </td>


  </tr>


  <tr class = "form">


      <td class = "letter"><b>F</b></td>


  <td class = "question">Enter "1" if you have at least $2,000 of$[SP]<b>child or dependent care expenses</b>$[SP]for which you plan to claim a credit<p>(<b>Note:</b>$[SP]Do$[SP]<b>not</b>$[SP]include child support payments. See Pub. 503, Child and Dependent Care Expenses, for details.) </p>


      </td>


      <td class = "form">


  <select onchange="sum()" id = "F" name="personal_allowance_f" >


    <option value="0">0</option>


    <option value="1">1</option>


  </select>


  </td>


  </tr>


  <tr class = "form">


      <td class = "letter"><b>G</b></td>


    <td class = "question"><b>Child Tax Credit</b>$[SP](including additional child tax credit). See Pub. 972, Child Tax Credit, for more information.


    <ul>


  <li>If your total income will be$[SP]<b>less</b>$[SP]than $70,000 ($100,000 if married), enter "2" for each eligible child; then less "1" if you have two to four eligible children or$[SP]<b>less</b>$[SP]"2" if you have five or more eligible children.</li>


  <li>If your total income will be between $70,000 and $84,000 ($100,000 and $119,000 if married), enter "1" for each eligible child</li>


    </ul>


      </td>


      <td class = "form">


  <input type="text" id="G" name ="personal_allowance_g" maxlength="1" size="1" value="0"   onchange="sum()"/>


  </td>


  </tr>


  <tr class = "form">


      <td class = "letter"><b>H</b></td>


  <td class = "question">Add lines A through G and enter total here. (<b>Note:</b>$[SP]This may be different from the number of exemptions you claim on your tax return.)


      </td>


      <td class = "form">


  <input type="text" id="H" name ="personal_allowance_h" maxlength="2" size="2"/>


  </td>


  </tr>


</table>


You do not need onChange client script declaration. Remove everything from the client script section and just copy this


function sum(){


  $('H').value=parseFloat($('D').value)+parseFloat($('G').value);


}


Amazing, works great!   Thanks!


Glad you got your question answered.