Page 1 of 1
Custom javascript code on submit button press
Posted: Fri Sep 13, 2024 2:22 pm
by karmacomposer
I have a finished form and need to calculate custom fields and send the results to a results page.
How do I add an entire code chunk to a button? I see the javascript event but it has pre-defined brief code fragments. I have more of an entire script to run. How do I do this?
The user needs to fill out the form and then, once they submit the form, the variables need to be calculated and the results sent to another page. I have global session variables turned on and working.
How and where do I attach this script? I assume the onclick button event, but if I am wrong, please tell me where. Also, this is not a one liner but an entire javascript script.
Thank you.
Mike
Re: Custom javascript code on submit button press
Posted: Fri Sep 13, 2024 5:04 pm
by Pablo
I have more of an entire script to run. How do I do this?
- Add the function between the <head> tag.
- Make a reference to the function in the event.
Re: Custom javascript code on submit button press
Posted: Mon Sep 16, 2024 2:38 pm
by karmacomposer
Where do I add this to the <Head> - page or form dialog?
Do I add an event and where?
Thank you so much.
Mike
Re: Custom javascript code on submit button press
Posted: Mon Sep 16, 2024 3:19 pm
by Pablo
Re: Custom javascript code on submit button press
Posted: Mon Sep 16, 2024 3:24 pm
by karmacomposer
Perfect. I had found the page html in a google search and now that part is done.
I will try adding events and see how it goes.
Thank you.
Mike
Re: Custom javascript code on submit button press
Posted: Mon Sep 16, 2024 3:31 pm
by karmacomposer
On the SUBMIT button, I went to the EVENTS tab and added a event.
I chose javascript as the type and entered one of the function names of my script, validate()
Do I need to set a target?
The next function to call is calculate()
Do I simply add another event, choose javascript and then use the function call, calculate()
Do I need to do anything after that? I need to go to the results.php page after to show the calculated results.
Is there any other event I need to call? I do have the submit action in the form set to go to the results.php page and it already displays some global variables from the form fields.
I need to then display the calculation results from the javascript in the <HEAD></HEAD> section that I added.
Am I on the right track?
Mike
Re: Custom javascript code on submit button press
Posted: Mon Sep 16, 2024 3:38 pm
by Pablo
Do I need to set a target?
No
The event will call your function. if you need extra functionality then you will need to implement this in your code.
For example, by placing the result of the calculation in a (hidden) field of the form via JavaScript and then submit the form from your script.
Re: Custom javascript code on submit button press
Posted: Mon Sep 16, 2024 4:04 pm
by karmacomposer
Thank you.
Right now, I have named the fields of the form elements the same as my script so that the script should take the values and calculate them properly.
On the results page, I want to display the resulting calculations.
If I need further help with hidden fields, I may ask you a few more questions.
I did create a function to add all calculated variables to global variables:
Code: Select all
function myFegliFunction() {
$GLOBALS["name"] = name.value;
$GLOBALS["current_age"] = current_age.value;
$GLOBALS["retirement_age"] = retirement_age.value;
$GLOBALS["base_salary"] = base_salary.value;
$GLOBALS["emailid"] = emailid.value;
$GLOBALS["FEGLI_BASIC_LIFETIME_COST"] = "$"+total_FEGLI_BASIC_LIFETIME_COST;
$GLOBALS["fegli_opa_cost"] = "$"+total_fegli_opa_cost;
$GLOBALS["UB_PERMANENT_LIFETIME_COST"] = "$"+total_UB_PERMANENT_LIFETIME_COST;
$GLOBALS["fegli_opb_cost"] = "$"+total_fegli_opb_cost;
$GLOBALS["UB_TERM_COST"] = "$"+total_UB_TERM_COST;
$GLOBALS["Estimated_Total_FEGLI_Lifetime_Cost"] = "$"+total_Estimated_Total_FEGLI_Lifetime_Cost;
$GLOBALS["total_savings"] = "$"+total_savings_final;
$GLOBALS["regular_finalresult"] = "$"+regular_total_savings_final;
$GLOBALS["regular_fegli_basic_coverage"] = "$"+FEGLI_BASIC_COVERAGE_AMT_report_final;
$GLOBALS["regular_fegli_opa"] = "$"+FEGLI_OPA_AMT_report_final;
$GLOBALS["regular_fegli_opb"] = "$"+FEGLI_OPB_AMT_report_final;
}
Those are the variables I will want to display in the results.php page. I have a form on that page and all fields are named identically so that they SHOULD just show the results.
Mike
Re: Custom javascript code on submit button press
Posted: Mon Sep 16, 2024 5:00 pm
by Pablo
I'm sorry, I cannot help you with custom coding. For me, this may also take a lot of time to figure out.
I am not sure about this code though, it looks like a mix of PHP and JavaScript?
Re: Custom javascript code on submit button press
Posted: Mon Sep 16, 2024 9:00 pm
by karmacomposer
This particular function (MyFEGLIFunction one) may be php but the rest of the script is most certainly javascript.
Since I need these variables to be global, where do I place this php function?
Mike
Re: Custom javascript code on submit button press
Posted: Tue Sep 17, 2024 5:46 am
by Pablo
You cannot mix PHP and JavaScript.
PHP is executed on the server
JavaScript is executed on the client side within the browser.
If you want to execute PHP code and use the result in JavaScript then you will need to use AJAX.
Note this is not specific to WWB.
Re: Custom javascript code on submit button press
Posted: Tue Sep 17, 2024 9:29 am
by jerryco
JavaScript is executed on the on the server
This is wrong information. JavaScript is executed by the browser.
Right?
Re: Custom javascript code on submit button press
Posted: Tue Sep 17, 2024 9:50 am
by BaconFries
Pablo changed your reply to what jerryco has written..
Re: Custom javascript code on submit button press
Posted: Tue Sep 17, 2024 1:49 pm
by karmacomposer
Thank you for your help. Regardless of the language I have to use, how do I make the Javascript function results visible in WYSIWYG Web Builder on a separate page?
Mike
Re: Custom javascript code on submit button press
Posted: Tue Sep 17, 2024 2:44 pm
by karmacomposer
So I used the localstorage command. Here is the storeGlobals function within the <head></head> on the index.php page. I have events on the submit button that call the various functions (not shown). Does this look correct to you?
Code: Select all
<script type="text/javascript">
function storeGlobals() {
localstorage.setItem("name", name.value)
localstorage.setItem("current_age", current_age.value)
localstorage.setItem("retirement_age", retirement_age.value)
localstorage.setItem("base_salary", base_salary.value)
localstorage.setItem("emailid", emailid.value)
localstorage.setItem("FEGLI_BASIC_LIFETIME_COST", "$"+total_FEGLI_BASIC_LIFETIME_COST)
localstorage.setItem("fegli_opa_cost", "$"+total_fegli_opa_cost)
localstorage.setItem("UB_PERMANENT_LIFETIME_COST", "$"+total_UB_PERMANENT_LIFETIME_COST)
localstorage.setItem("fegli_opb_cost", "$"+total_fegli_opb_cost)
localstorage.setItem("UB_TERM_COST", "$"+total_UB_TERM_COST)
localstorage.setItem("Estimated_Total_FEGLI_Lifetime_Cost", "$"+total_Estimated_Total_FEGLI_Lifetime_Cost)
localstorage.setItem("total_savings", "$"+total_savings_final)
localstorage.setItem("regular_finalresult", "$"+regular_total_savings_final)
localstorage.setItem("regular_fegli_basic_coverage", "$"+FEGLI_BASIC_COVERAGE_AMT_report_final)
localstorage.setItem("regular_fegli_opa", "$"+FEGLI_OPA_AMT_report_final)
localstorage.setItem("regular_fegli_opb", "$"+"$"+FEGLI_OPB_AMT_report_final)
}
</script>
Then, on the results.php page, I have the readGlobals function and have put this in the <head></head> on the main page:
Code: Select all
<script type="text/javascript">
function readGlobals() {
localstorage.getItem("name")
localstorage.getItem("current_age")
localstorage.getItem("retirement_age")
localstorage.getItem("base_salary")
localstorage.getItem("emailid")
localstorage.getItem("FEGLI_BASIC_LIFETIME_COST")
localstorage.getItem("fegli_opa_cost")
localstorage.getItem("UB_PERMANENT_LIFETIME_COST")
localstorage.getItem("fegli_opb_cost")
localstorage.getItem("UB_TERM_COST")
localstorage.getItem("Estimated_Total_FEGLI_Lifetime_Cost")
localstorage.getItem("total_savings")
localstorage.getItem("regular_finalresult")
localstorage.getItem("regular_fegli_basic_coverage")
localstorage.getItem("regular_fegli_opa")
localstorage.getItem("regular_fegli_opb")
}
</script>
I use a onload event to call this function.
Does all this look about right?
Mike
Re: Custom javascript code on submit button press
Posted: Tue Sep 17, 2024 5:18 pm
by Pablo
If the code works in any other editor then it will also work in WWB.
The code will be inserted "AS IS".
Of source you will still have to process the data somehow, because there is no way for the internal script to know that you want to use these values in the forms results. You will need to implement this logic yourself.
But again, this is not specific to WWB. All programming logic related to HTML / PHP also applies to WWB pages.
Re: Custom javascript code on submit button press
Posted: Tue Sep 17, 2024 7:53 pm
by karmacomposer
The code works perfectly as a static html page but I need to split it up to use forms for input and then process the rest of the javascript and then load the results page to show the results.
It all works as one page currently.
Mike
Re: Custom javascript code on submit button press
Posted: Wed Sep 18, 2024 6:07 am
by Pablo
What information are you missing to be able to implement this ?
Re: Custom javascript code on submit button press
Posted: Wed Sep 18, 2024 12:25 pm
by karmacomposer
If I could send you the code or the project, would you be able to at least advise me on what I am doing wrong.
If I have to pay, so be it. I need to finish this.
Mike
Re: Custom javascript code on submit button press
Posted: Wed Sep 18, 2024 1:20 pm
by Pablo
I'm sorry, I cannot help you with programming related question.
Re: Custom javascript code on submit button press
Posted: Wed Sep 18, 2024 9:12 pm
by BaconFries
If I have to pay, so be it. I need to finish this
I know I am going to be seen as the Internet police here...but it reads like you
expect to be given the solution because you need it!
See the following
viewtopic.php?t=1901
8. In general, we do not provide support for custom code or custom scripts....
Re: Custom javascript code on submit button press
Posted: Thu Sep 19, 2024 3:59 am
by wwonderfull
well said @baconfries.
WWB Support does not provide services on custom codes.
@mike I think you might be working with a custom project for someone. In that case I do know that you get the liability of finishing it. If you think you need accompany on this, you may have to team up with other expert who may be able to work with you with paid services for their time value.
On
Professionals for hire section you can post and wait for others if they would be interested or would want to collaborate with you on helping you finish this project.
Professionals for hire Section:
viewforum.php?f=126