Jump to content
jacky

problem with javascript to update fields in the Detail page

Recommended Posts

I am a new Caspio user. I have tried to work on Search and Report Wizard - Configure Details Page Fields. 

I need to do some edit and calculations on several fields on the details page.  I guess i must use javascript to achieve that. I have 3 fields lab_fee, c_discount, and credit_charge of Number  Data type in my table.

My requirement are as follows:

1. The user must be able to edit  lab_fee

2. When lab_fee is edited it should effect  TotalFee automatically. 

3. I put the javascript in the Footer like below.  Right now when I tested (preview) it, it did not do anything at all. I have been searching for similar problems on the community forums for weeks now and nearly give up. i found some similar issues  and i have tried to follow those  but so for not fortunate enough.  I look at the  Caspio Online help Center  topics "Why JavaScript is not working with multiple DataPages deployed on one page?" and I suspected that I might be in this situation. I currently deploy 3 Datapages on my website, and the one i am talking about is one of those three.  The other 2 Datapages are working ok.  Can anyone be kind enough to help me solve this issue.  :) . The JavaScript syntax such as document.getElementById(“caspioform”) and  document.forms[X]. drive me nut for a long while. 

4.  I have other calculations to perform as well, but for simplicity I only brought up this one.  

5. I try to avoid coding by focusing on using Wizards as many as i can. Search and Report Wizard is the one i used for this case. But it seemed that what i try to achieve has to be done by javascript only.   

Thank you very much guys. 

<SCRIPT LANGUAGE="JavaScript">
 
function calculate1()
{
var v1 = document.getElementById("EditRecordlab_fee").value;
var v2 = document.getElementById("EditRecordc_discount").value;
var v3 = document.getElementById("EditRecordcredit_charge").value;
var v4 =  v2 + v3 - v1;

document.getElementById("EditRecordTotalFee").value = Round(v4,2);
 }
 
document.getElementById("caspioform").onsubmit =calculate1;

</SCRIPT> 

Edited by jacky
i explained it wrongly about my data fields.

Share this post


Link to post
Share on other sites

Hi @jacky,

Please note that "onsubmit" Javascript event is not supported by Caspio after 13.0 Caspio Bridge release. 

Replace the onsubmit event with Caspio’s built-in event handler, as shown below:

<script type="text/javascript">
document.addEventListener('BeforeFormSubmit', function (event) {
// do something
});
</script>

You can check this article for more information:

https://howto.caspio.com/release-notes/caspio-bridge-13-0/13-0-impacted-areas/

Also, make sure that you place your code in Datapage Footer.

 

Regards,

vitalikssssss

Share this post


Link to post
Share on other sites

Hey vitalikssssss.

Sorry to bother you brother. Is this correct? 

 

<script type="text/javascript">

document.addEventListener('BeforeFormSubmit', function (event) {


var v1 = document.getElementById("EditRecordlab_fee").value;
var v2 = document.getElementById("EditRecordc_discount").value;
var v3 = document.getElementById("EditRecordcredit_charge").value;
var v4 =  v2 + v3 - v1;

document.getElementById("EditRecordTotalFee").value = Round(v4,2);

};
</script>

Share this post


Link to post
Share on other sites

Hi @jacky,

I have found a small syntax error in your code. One closing bracket was missing.

Please try this code:

<script type="text/javascript">

document.addEventListener('BeforeFormSubmit', function (event) {


var v1 = document.getElementById("EditRecordlab_fee").value;
var v2 = document.getElementById("EditRecordc_discount").value;
var v3 = document.getElementById("EditRecordcredit_charge").value;
var v4 =  v2 + v3 - v1;

document.getElementById("EditRecordTotalFee").value = Round(v4,2);

});
</script>

If it doesn`t help please inform me which form elements for each field you are using (lab_fee, c_discount, credit_charge).

Regards,

vitalikssssss

Share this post


Link to post
Share on other sites

Hi vitalikssssss, thanks very much for your time. 

in the Search and Report Wizard - Configure Details Page Fields... I use Text Field  as the form elements for lab_fee, c_disco unt, and credit_charge . 

Thanks, 

Share this post


Link to post
Share on other sites

The issue was in Round function which actually accepts only one parameter and rounds the number to the nearest integer.  

The correct script should look like following:

<script type="text/javascript">

document.addEventListener('BeforeFormSubmit', function (event) {


var v1 = document.getElementById("EditRecordlab_fee").value;
var v2 = document.getElementById("EditRecordc_discount").value;
var v3 = document.getElementById("EditRecordcredit_charge").value;
var v4 =  v2 + v3 - v1;

document.getElementById("EditRecordTotalFee").value = Math.round(v4 * 100) / 100;

});
</script>

 

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...