Avatar of sabecs
sabecs
 asked on

JavaScript - when hiding divs php code is still there?

Hi,
I have some divs which are hidden for specific payment options.
My problem is the php code is still there and performs form validation when not required?
How can I update the page so that the PHP code for the hidden div is not executed?  

If hope that makes sense?

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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="ScriptLibrary/jquery-1.4.3.min.js"></script>

</head>


<body>


<script language="javascript" type="text/javascript">         
		window.onload = function() {
			show_payment_option();
		}

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';
		   document.getElementById('credit_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'; 
		   document.getElementById('credit_option_details').style.display = 'none'; 
		}else if (which_option == 'credit'){
		   document.getElementById('cheque_option_details').style.display = 'none'; 
		   document.getElementById('direct_option_details').style.display = 'none'; 
		   document.getElementById('credit_option_details').style.display = 'block'; 
		} else {
		   document.getElementById('cheque_option_details').style.display = 'none'; 
		   document.getElementById('direct_option_details').style.display = 'none'; 
		   document.getElementById('credit_option_details').style.display = 'none'; 
		}

} 

</script> 
<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>
</select>


<div id="direct_option_details">
<div class="inputname" style="height:140px"><strong>Our Direct Deposit Details</strong>
</div>
<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>
<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>
</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>
<div class="inputfield" style="height:140px">
<strong>business_name</br></strong>
postal_address1</br>
postal_address2</br>
postal_address3</br>
postal_address4</br>
</div>
<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>
</div><!-- end of cheque_option_details div  !-->

<div id="credit_option_details">  

<div class="inputname"><vllabel for="order_details[eway_CardHoldersName]" errtext="Name Required" validators="CardHoldersNameReq" errclass="vdcopyerr">Name On Card</vllabel></div><div class="inputfield">
<input name="order_details[eway_CardHoldersName]" type="text" id="eway_CardHoldersName" value="<?php echo $_SESSION['eway_CardHoldersName']; ?>" size="35"/>
<vlvalidator name="CardHoldersNameReq" type="required" control="order_details[eway_CardHoldersName]"  errmsg="Please Enter Name on Credit Card">
</div>

</div>


</body>
</html>

Open in new window

JavaScriptPHP

Avatar of undefined
Last Comment
sabecs

8/22/2022 - Mon
OmniUnlimited

Why don't you have PHP check for the value of $_SESSION['payment_option'] and process accordingly?
ASKER CERTIFIED SOLUTION
leakim971

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
or
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
Kiran Sonawane

Try thios
<?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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script language="javascript" type="text/javascript">         
   $(document).ready(function(){
     var which_option = "<?php echo $_SESSION['payment_option'] ?>";
     show_payment_option(which_option);
     $('#payment_option').change(function(){
       show_payment_option($(this).val());
     });
     
     $('#btn').click(function(){
       if($('#eway_CardHoldersName').val() =="")
       alert('Name should not blank');
     });
   });
   

function show_payment_option(which_option){ 
    $('#cheque_option_details').hide();
    $('#direct_option_details').hide();
    $('#credit_option_details').hide();
   
     
     if (which_option == 'cheque'){
       $('#cheque_option_details').show();
    }else if (which_option == 'direct'){
       $('#direct_option_details').show();
    }else if (which_option == 'credit'){
       $('#credit_option_details').show();
    } 

} 

</script> 
</head>
<body>
<select name="order_details[payment_option]" class="dropdownmenu" style="width:280px" id="payment_option">
<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>
<option value="credit">Credit</option>
</select>
<div id="direct_option_details">
<div class="inputname" style="height:140px"><strong>Our Direct Deposit Details</strong>
</div>
<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>
<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>
</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>
<div class="inputfield" style="height:140px">
<strong>business_name</br></strong>
postal_address1</br>
postal_address2</br>
postal_address3</br>
postal_address4</br>
</div>
<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>
</div><!-- end of cheque_option_details div  !-->

<div id="credit_option_details">  

<div class="inputname"><vllabel for="order_details[eway_CardHoldersName]" errtext="Name Required" validators="CardHoldersNameReq" errclass="vdcopyerr">Name On Card</vllabel></div><div class="inputfield">
<input name="order_details[eway_CardHoldersName]" type="text" id="eway_CardHoldersName" value="<?php echo $_SESSION['eway_CardHoldersName']; ?>" size="35"/>

</div>

</div>
<vlvalidator name="CardHoldersNameReq" type="required"  control="order_details[eway_CardHoldersName]"  errmsg="Please Enter Name on Credit Card">
</body>
</html>

Open in new window

sabecs

ASKER
Thanks OmniUnlimited for your comments,
$_SESSION['payment_option'] is currently set from the next page, it’s just there in case a user goes back.
If I can set it from my function show_payment_option(which_option) then that would probably work but how would I do that, can it be achieved with jquery or Ajax without refreshing the whole page?

Thanks leakim971, I will try your suggestion also.
All of life is about relationships, and EE has made a viirtual community a real community. It lifts everyone's boat
William Peck
SOLUTION
Log in to continue reading
Log In
Sign up - Free for 7 days
Get an unlimited membership to EE for less than $4 a week.
Unlimited question asking, solutions, articles and more.
OmniUnlimited

You know, to be honest, I've never set a session variable through AJAX.

You may need process.php to look like this:
<?php
   session_start();
   $_SESSION['payment_option'] = $_POST['opt'];
?>

Open in new window

Sandeep Kothari

you cannot stop php by hiding the element ..... server side processing cannot be stopped by client side conditons ... clear....
so the only thing to stop processing of php is by using php condition .. if the concept is clear I m sure you will comeout with the proper condition in php to make the code work as you need it !...
sabecs

ASKER
Thank you to everyone for your help, I think I will have to update $_SESSION['payment_option'] via jQuery Ajax but I don't know how to get it to work.

I tried OmniUnlimited suggestion but could not get it to work.
      $.ajax({
            cache: false,
            url: 'http://mysite.com/process.php',
            type: "POST",
            data: ({ opt : which_option })
         });

<?php //process.php
   session_start();
   $_SESSION['payment_option'] = $_POST['opt'];
?>

How can I test it?


Get an unlimited membership to EE for less than $4 a week.
Unlimited question asking, solutions, articles and more.
SOLUTION
Log in to continue reading
Log In
Sign up - Free for 7 days
Get an unlimited membership to EE for less than $4 a week.
Unlimited question asking, solutions, articles and more.
SOLUTION
Log in to continue reading
Log In
Sign up - Free for 7 days
Get an unlimited membership to EE for less than $4 a week.
Unlimited question asking, solutions, articles and more.
sabecs

ASKER
Thanks for your help, I still could not get it working, I am now looking at either using a jquery form validation or seeing if I can remove some of the vdaemon tags with jquery, I will raise another question.

Thanks again...