PDA

View Full Version : Onclick / Onsubmit Radio Buttons


ryndog427452
06-20-2011, 04:15 PM
Hey there,
I am new here to this community. I am hoping I am in the right section for posting this question, if I am not I apologize in advance. I recently took over a project and have a question/issue with a form. I have posted on another website (http://www.codingforums.com/showthread.php?p=1103551#post1103551), but I thought maybe it could be answered here too as if my understanding is correct alot of this coding was made with WebAssist.

Acheivment: When a user clicks on a radio button on our confirm.php page, the form will automaticaly submit and refresh itself without the user have to actually press 'submit' button (which I will hide later). The reason for this is because users are making a radio selection but NOT pressing 'submit' and we are receiving the default or previous selection.

What I have tried: I have tried these coding options, all with the same result. The result is that the page DOES refresh, but the information DOES NOT change or save. The form isn't acutally submitting?

<input <?php if (!(strcmp($_SESSION['shippingmethod'],"1"))) {echo "checked=\"checked\"";} ?> name="grpshipping" type="radio" id="grpshipping_0" value="1" checked="checked" onclick="document.getElementById('Update_shipping').submit( )" />

<input <?php if (!(strcmp($_SESSION['shippingmethod'],"2"))) {echo "checked=\"checked\"";} ?> type="radio" name="grpshipping" value="2" id="grpshipping_1" on onChange="this.form.submit();" />

<input <?php if (!(strcmp($_SESSION['shippingmethod'],"3"))) {echo "checked=\"checked\"";} ?> type="radio" name="grpshipping" value="3" id="grpshipping_2" onClick="this.form.action='confirm.php';this.form.submit()" />

Form header:
<form action="" method="post" name="Update_shipping" id="Update_shipping">

Form footer:
<input type="image" name="Update_shipping" id="Update_shipping" value="Update_shipping" alt="Update_shipping" src="WA_eCart/Images/Nautica/Btn4_EN_update.gif" class="eC_ImageButton" />

I think I am on the right track, but I am thinking that something with WebAssist may not prevent things to happen correctly. Maybe not. I have attached the entire php file just in case there is something else incorrect. You can also try the form live by clicking on the link in the begining of the post. There are instructions and information on getting to the live test site and see how its acting.

I appreciate your help, and if can provide anymore information please let me know.

Jason Byrnes
06-21-2011, 06:54 AM
using onChange="this.form.submit();" for the radio buttons is the correct way to post the form when a radio button is changed, your problem is the trigger for setting the shippingmethod session variable.


if (isset($_POST["Update_shipping"]) || isset($_POST["Update_shipping_x"])) { //if the shipping form has been posted, set the shipping method based on the form value, otherwise do nothing, this is necessary, as on form post, the confirmation email uses the session values for shipping and charges
$_SESSION["shippingmethod"] = "".((isset($_POST["grpshipping"]))?$_POST["grpshipping"]:"") ."";
}


this code uses the Update_shipping button as the trigger. when you post the form using the onchange event, it does not post the Update_shipping button so does not trigger the session. you need to use the grpshipping element as the trigger for setting that session variable instead of the Update_shipping button.


if (isset($_POST["grpshipping"])) { //if the shipping form has been posted, set the shipping method based on the form value, otherwise do nothing, this is necessary, as on form post, the confirmation email uses the session values for shipping and charges
$_SESSION["shippingmethod"] = "".((isset($_POST["grpshipping"]))?$_POST["grpshipping"]:"") ."";
}

ryndog427452
06-21-2011, 10:14 AM
That was the cuplrit... thanks so much! I knew (thought I was) on the right track.

There is still 1 issue....

It works in Firefox great! However in IE it does not update when clicking on the radio button. However if you click on a SECOND radio button it will refresh but choose the first radio button you clicked on. Make sense? Its like using the first radio button as the choice, and then the second button as 'update'.

I am using this code for the buttons:
onChange="this.form.submit();"

I may experiment more to find a solution, but if you have a suggestion before I finger it out I would be very appreciative! Thanks again!

ryndog427452
06-21-2011, 10:23 AM
onclick="document.getElementById('Update_shipping').submit( );"

This is working for both Firefox & IE.

ryndog427452
06-21-2011, 04:26 PM
So I was thinking about this more, and a few months ago I was trying to disable a 'submit' button after users pressed it once. We were having problems with people multiply clicking on submit order and the form was send multiple orders and charging their cards double and even triple. I never got that to work, but now that you've shown me this I am wondering if its the same type issue with out custom coding... here is the code I am trying:

<input type="image" name="Submit_order" id="Submit_order" value="Checkout" alt="Submit order" src="WA_eCart/Images/Nautica/Btn4_EN_submitorder.gif" class="eC_ImageButton" onclick="document.getElementById('ecart_checkout_form').sub mit();this.disabled = true;" />

I have attached a new copy of the page with this code in it for reference.

The current result is a page refresh.... no submission to the final page.

Jason Byrnes
06-22-2011, 07:29 AM
use this for the onClick event:

onClick="this.style.visibility = 'hidden';"

ryndog427452
06-22-2011, 08:27 AM
That worked just fine. No more double clickers/orders. Works on both Firefox and IE.

Thank you so much for the help :) Really appreciate you taking time out for me.

Jason Byrnes
06-22-2011, 08:31 AM
glad to her it is working.

ryndog427452
07-06-2011, 09:45 AM
Button still works great but I have an additional issue that is related. Been searching around the internet without avail, maybe you have some additional suggestions.

So a user clicks on 'submit order' and it disapears. Works good, no double orders. BUT... the user decides (after clicking on 'submit order') that he wants to change it, or edit his contact information. While the form is processing (before the next load page), he presses 'modify order'. This button is here for users to change there information if it is not correct. But when a user clicks on it AFTER the submit button it still proccesses the original order, and allows them to resend the order after they have made changes. Thus 2 orders go through for the customer, and we have to issue refunds.

So enlight of this, my question is, is there a way to additionally hide BOTH the 'submit order' button AND the 'modify information' button at the end of the form, no matter which one they pick?

Here is the code:


<input type="image" alt="Modify information" value="Modify information" src="WA_eCart/Images/Nautica/Btn4_EN_modifyinformation.gif" class="eC_ImageButton" onclick="document.location.href='checkout.php';return false;"/>
<?php if ($totalRows_rszipdestination == 0) { // Show if recordset is empty ?>
<input type="image" name="Submit_order" id="Submit_order" value="Checkout" alt="Submit order" src="WA_eCart/Images/Nautica/Btn4_EN_submitorder.gif" class="eC_ImageButton" onClick="this.style.visibility = 'hidden';" />
<?php } // Show if recordset not empty ?><br /><br />

Any thoughts?

Jason Byrnes
07-08-2011, 08:37 AM
give the modify button an id:
<input id="Modify" type="image" alt="Modify information" value="Modify information" src="WA_eCart/Images/Nautica/Btn4_EN_modifyinformation.gif" class="eC_ImageButton" onclick="document.location.href='checkout.php';return false;"/>



and add another statement to onclick event of the submit button to hide the modify button;

<input type="image" name="Submit_order" id="Submit_order" value="Checkout" alt="Submit order" src="WA_eCart/Images/Nautica/Btn4_EN_submitorder.gif" class="eC_ImageButton" onClick="this.style.visibility = 'hidden'; document.getElementById('Modify').style.visibility = 'hidden';" />

ryndog427452
07-12-2011, 09:35 AM
Sorry took me so long to get back to you. After a couple of days I was able to try it out.

After removing the space in ret urn false; it works great! Thanks again Jason. Now those sneaky bastards can't double submit thier orders. Or so I hope :)

Thanks again!

Jason Byrnes
07-12-2011, 10:04 AM
you're welcome.