Jump to content

radio buttons


jimfog

Recommended Posts

I have a form with some radio buttons.These radio buttons appear on clicking an edit icon and are hidden when either the user chooses to save or cancel form submission And suppose there is a default selection and the user goes to change that(as part of updating his profile)...nothing weird so far. But...after he makes a selection...he decides to cancel form submission...meaning the old check box selected should stays as it is. The problem is that it does not.After clicking the edit icon again to make the radio buttons show the selected shown is NOT the original as it should be(since the user hit the cancel button) but the changed one. I hope you understood what I am talking about.

Link to comment
Share on other sites

It sounds like you need to add some code into the part that shows the buttons to also set their values. There are several ways you could do that. You could have an array that lists all of the values for every element and look them up there, or you could put a custom attribute on the elements with their original value and access that. There are other ways I'm sure you can imagine to do that, like send an ajax request for the database values and do it that way.

Link to comment
Share on other sites

Ι am going to start another way...what is the js action that can alter the selection of a radio button in a form. For example...having a button that upon clicked by the user a selection is made of a specific radio button.Let us start with this.

Link to comment
Share on other sites

Link to comment
Share on other sites

<!DOCTYPE html><html lang="en"><head><title>Radio</title><style>#result{width: 40px;}</style> <script>window.onload = function(){document.getElementById('btnclr').onclick = fnclear;var r = document.getElementsByName('rad1');for (var i=0 ; i<r.length ; i++){if (r[i].type=='radio'){r[i].onclick = fndisplay;}}}function fnclear(){var r = document.getElementsByName("rad1");for (var i=0 ; i<r.length ; i++){if(r[i].checked == true){alert('clearing ' + r[i].value);r[i].checked = false;}}document.getElementById("result").value = '';}function fndisplay(e){//e is eventdocument.getElementById("result").value = this.value;}</script></head><body><p>Select a number:</p><form><input type="radio" name="rad1" value="1" checked="checked"/>1<br/><input type="radio" name="rad1" value="2"/>2<br/><input type="radio" name="rad1" value="3"/>3<br/><input type="radio" name="rad1" value="4"/>4<br/><input type="radio" name="rad1" value="5"/>5<br/><br/>Selection is: <input type="text" id="result"/><br/><input type="button" id="btnclr" value="Clear"/><input type="reset" value="Reset"/></form></body></html>

Edited by davej
Link to comment
Share on other sites

I am trying to combine the 2 codes above(yours and w3scool's) so as to achieve what I want since both come close but do not give me what exactly what I want. Your code displays the values...I want it though to display the ids. What alteration must be done here?

Link to comment
Share on other sites

Could you not use the clicking of cancel button to reset form inputs to there default values using defaultValue(), OR when edit button clicked store values in hidden fields (maybe generated by jquery), if cancel clicked reset values to those in hidden fields.

Link to comment
Share on other sites

if it is not much trouble can you post some code? Further more, the checked radio button may change from time to time...it will not be the same all the time. P.S Still struggling to get a grip with js syntax...that is why I am insisting on posting code

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...