Avatar of sabecs
 asked on

Javascript - use jQuery to run function istead of body onload?

what do I need in order to use jQuery to execute my function "show_payment_option" instead of using body onload?

Thanks for you feedback.
<?php session_start(); 

$_SESSION['payment_option'] = "cheque";

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<script language="javascript"> 
function show_payment_option(which_option){ 
		if (typeof which_option == "undefined") {
    	var which_option = "<?php echo $_SESSION['payment_option'] ?>";
		 if (which_option == 'cheque'){
		   document.getElementById('cheque_option_details').style.display = 'block'; 
		   document.getElementById('direct_option_details').style.display = 'none'; 
		}else if (which_option == 'direct'){
		   document.getElementById('cheque_option_details').style.display = 'none'; 
		   document.getElementById('direct_option_details').style.display = 'block'; 
		} else {
		   document.getElementById('cheque_option_details').style.display = 'none'; 
		   document.getElementById('direct_option_details').style.display = 'none'; 


<body onLoad="show_payment_option();">

<select name="order_details[payment_option]" class="dropdownmenu" style="width:280px" id="payment_option" onChange="show_payment_option(payment_option.value)">
<option value = "">Select Payment Option</option>
<option value="cheque" <?php if (!(strcmp("cheque", $_SESSION['payment_option']))) echo "SELECTED"; ?>>Cheque - must clear before goods dispatched</option>
<option value="direct" <?php if (!(strcmp("direct", $_SESSION['payment_option']))) echo "SELECTED"; ?>>Direct Deposit into our Bank Account </option>

<div id="direct_option_details">
<div class="inputname" style="height:140px"><strong>Our Direct Deposit Details</strong>
<div class="inputfield" style="height:140px">
<strong>Bank: </strong>bank_name</br>
<strong>Account Name: </strong>account_name</br>
<strong>BSB: </strong>bsb</br>
<strong>Account Number: </strong>account_number</br>
<div class="inputfield_fullwidth" style="height:100px">
You have elected to pay via direct deposit into our account, our details are shown above.Please ensure you specify your <strong>Name</strong> and <strong>Order ID</strong> when making the transfer. Once we confirm your payment has been successful we will arrange for your order to be dispatched. 
</div><!-- end of deposit_option_details div  !-->

<div  id="cheque_option_details">
<div class="inputname" style="height:140px">
<strong>Details for Cheque Payments</strong>
<div class="inputfield" style="height:140px">
<div class="inputfield_fullwidth" style="height:100px">
You have elected to pay by cheque, please make cheque payable to business_name and mail to our postal address below.</br>
Once we confirm you payment has been successful we will arrange for your order to be dispatched. <br />
</div><!-- end of cheque_option_details div  !-->


Open in new window


Avatar of undefined
Last Comment

8/22/2022 - Mon

var $ = jQuery.noConflict();

$(document).ready(function() {

Log in or sign up to see answer
Become an EE member today7-DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform
Sign up - Free for 7 days
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.
Not exactly the question you had in mind?
Sign up for an EE membership and get your own personalized solution. With an EE membership, you can ask unlimited troubleshooting, research, or opinion questions.
ask a question

Thanks, it works great.

Wait, wasn't the question

"what do I need in order to use jQuery to execute my function "show_payment_option" instead of using body onload?"

Your accepted solution is not jquery.

Experts Exchange has (a) saved my job multiple times, (b) saved me hours, days, and even weeks of work, and often (c) makes me look like a superhero! This place is MAGIC!
Walt Forbes

Yes, sorry OmniUnlimited, your correct.
I did try your solution but could not get it to work...

From what I see in your code, it is probably because you do not have jquery loaded.  My solution will work, but only if you have jquery loaded.