close ad
Databridge V2 with MySQLi support IS Now Available!
open ad
View Menu

Technical Support Forums

Free, outstanding support from WebAssist and your colleagues

rating

Onclick / Onsubmit Radio Buttons

Thread began 6/20/2011 7:15 pm by ryndog427452 | Last modified 7/12/2011 1:04 pm by Jason Byrnes | 10571 views | 11 replies |

ryndog427452

Re-Opened: Onclick / Onsubmit Radio Buttons | Disable Submit Button On Click

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 (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.

Attached Files
confirm.php.zip
Sign in to reply to this post

Jason ByrnesWebAssist

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.

php:
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.

php:
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"]:"")  ."";
}
Sign in to reply to this post

ryndog427452

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!

Sign in to reply to this post

ryndog427452

miniio answered

onclick="document.getElementById('Update_shipping').submit();"



This is working for both Firefox & IE.

Sign in to reply to this post

ryndog427452

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').submit();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.

Attached Files
confirm.php.zip
Sign in to reply to this post

Jason ByrnesWebAssist

use this for the onClick event:

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

Sign in to reply to this post

ryndog427452

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.

Sign in to reply to this post

Jason ByrnesWebAssist

glad to her it is working.

Sign in to reply to this post

ryndog427452

Additional Issue With Second 'Modify Button'

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?

Sign in to reply to this post

Jason ByrnesWebAssist

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='plugins/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';" />

Sign in to reply to this post
loading

Build websites with a little help from your friends

Your friends over here at WebAssist! These Dreamweaver extensions will assist you in building unlimited, custom websites.

Build websites from already-built web applications

These out-of-the-box solutions provide you proven, tested applications that can be up and running now.  Build a store, a gallery, or a web-based email solution.

Want your website pre-built and hosted?

Close Windowclose

Rate your experience or provide feedback on this page

Account or customer service questions?
Please user our contact form.

Need technical support?
Please visit support to ask a question

Content

rating

Layout

rating

Ease of use

rating

security code refresh image

We do not respond to comments submitted from this page directly, but we do read and analyze any feedback and will use it to help make your experience better in the future.

Close Windowclose

We were unable to retrieve the attached file

Close Windowclose

Attach and remove files

add attachmentAdd attachment
Close Windowclose

Enter the URL you would like to link to in your post

Close Windowclose

This is how you use right click RTF editing

Enable right click RTF editing option allows you to add html markup into your tutorial such as images, bulleted lists, files and more...

-- click to close --

Uploading file...