I have an options panel for Wordpress. I have some radio buttons that work perfect. But when I click radio button 2 and save it then it goes back to 3?
The weird thing is that is echos 2 in my theme? Any suggestions?
<label for="Slider_Shadow_Type">Slider Shadow</label>
<br />
<input name="Slider_Shadow_Type" checked="checked" type="radio" value="None" >
<br />
<input name="Slider_Shadow_Type" checked="checked" type="radio" value="Shadow 1" >
<br />
<input name="Slider_Shadow_Type" checked="checked" type="radio" value="Shadow 2" >
<br />
<input name="Slider_Shadow_Type" checked="checked" type="radio" value="Shadow 3" >
<small>Select the shadow style.</small><div class="clearfix"></div>
They are all set to checked, so it will revert to the last one in the list, i.e. 'Shadow 3'. remove the 'checked="checked".
Related
I found a code to help change stars color as you hover over them. It works like a charm. However, when I click on a star to fix the rating, it sends me to the top of the page. The stars are a little at the bottom of the page so it is very annoying to click on a star and end up at the top and having to scroll back down again.
The page is not being refreshed. It just sends me to the top. Is there a way to prevent this and allow the user to click on the star and stay on the part of the page where the stars are?
HTML
<fieldset class="rating">
<legend>Please rate:</legend>
<input type="radio" id="star5" name="rating" value="5" /><label for="star5" title="Rocks!">5 stars</label>
<input type="radio" id="star4" name="rating" value="4" /><label for="star4" title="Pretty good">4 stars</label>
<input type="radio" id="star3" name="rating" value="3" /><label for="star3" title="Meh">3 stars</label>
<input type="radio" id="star2" name="rating" value="2" /><label for="star2" title="Kinda bad">2 stars</label>
<input type="radio" id="star1" name="rating" value="1" /><label for="star1" title="Sucks big time">1 star</label>
</fieldset>
Here is the full code:
jsfiddle
Thanks
DEMO
Hi User2961763
It seems that top:-9999px; on .rating:not(:checked) > input causing problem. if you comment or remove this style it will work fine though you also need to take care that it wont affect your other functionality. Hope it Helps
.rating:not(:checked) > input {
position:absolute;
/* top:-9999px; */
clip:rect(0,0,0,0);
}
I am working on an android App using jQuery mobile,phonegap in which i have form i need to make the radio elements to be as native ones not as button like this
[1]: http://i.stack.imgur.com/YKEGa.png
, i do that by adding data-role="none" , but the radio size " selected circle " is too small how can i enlarge the radio size ?
please help me,
Thanks in advance.
You can basically style the fields as you wish. For example, the below theme has the style as you expect.
http://driftyco.github.io/graphite/
<fieldset data-role="controlgroup" data-type="horizontal">
<legend>Choose a pet:</legend>
<input type="radio" name="radio-choice" id="radio-choice-1" value="choice-1" checked="checked" />
<label for="radio-choice-1">Cat</label>
<input type="radio" name="radio-choice" id="radio-choice-2" value="choice-2" />
<label for="radio-choice-2">Dog</label>
<input type="radio" name="radio-choice" id="radio-choice-3" value="choice-3" />
<label for="radio-choice-3">Hamster</label>
<input type="radio" name="radio-choice" id="radio-choice-4" value="choice-4" />
<label for="radio-choice-4">Lizard</label>
</fieldset>
I have the following Radio buttons in jQuery Mobile as in the picture, and I need to increase the radio size since it is too small, I have adjusted the width and height attributes but it did not work.
How can I do that since I don't want them appear as buttons, I need them in this look?
Here is the code:
<fieldset data-role="controlgroup" data-type="horizontal">
<legend>Layout view:</legend>
<input type="radio" name="radio-choice" id="List" value="List" checked="checked" data-role="none" />
<label for="List">List</label>
<input type="radio" name="radio-choice" id="Grid" value="Grid" data-role="none" />
<label for="Grid">Grid</label>
<input type="radio" name="radio-choice" id="Gallery" value="Gallery" data-role="none"/>
<label for="Gallery">Gallery</label>
</fieldset>
Can someone direct me to an example of asp code that will process a form which has only radio buttons? The functionality: When a radio button is checked and submit is clicked the user will be redirected to specific url. onclick="window.location='http://www.google.com';" Will not do the trick here. We have to wait until "submit" is clicked.
<form name="input" action="the_code_you_are_helping_me_with.asp" method="get">
<input type="radio" name="option1" value="1" />option1<br />
<input type="radio" name="option2" value="2" />option2<br />
<input type="radio" name="option3" value="3" />option3<br />
<input type="radio" name="option4" value="4" />option4<br />
<input type="radio" name="option5" value="5" />option5<br />
<input type="submit" value="Submit" />
Thanks in advance,
dp
See a working demo here: http://jsfiddle.net/89s6R/3/
<script>
function onRadioClick(radio) {
radio.form.action = radio.value;
}
function onFormSubmit(form) {
window.location = form.action;
return false;
}
</script>
<form name="input" action="#" method="get" onsubmit="return onFormSubmit(this)">
<label><input type="radio" name="destination" onclick="onRadioClick(this)" value="http://google.com" />Google</label><br />
<label><input type="radio" name="destination" onclick="onRadioClick(this)" value="http://nyt.com" />New York Times</label><br />
<label><input type="radio" name="destination" onclick="onRadioClick(this)" value="http://twitter.com" />Twitter</label><br />
<label><input type="radio" name="destination" onclick="onRadioClick(this)" value="http://microsoft.com" />Microsoft</label><br />
<label><input type="radio" name="destination" onclick="onRadioClick(this)" value="http://apple.com" />Apple</label><br />
<input type="submit" value="Submit" />
</form>
The above client-side answer will work. However, if you want "asp code" I assume you wanted something server side. So:
Turn your submit button into an asp:Button.
Turn your radio buttons into an asp:RadioButtonList.
In the button's onClick event, get the value of the selected button. Then user Response.Redirect to redirect to that url.
My radio buttons are like this, there are 2 and whichever the person selects I want to get when the form posts.
A <input type="radio" name="userType" id="a" />
B <input type="radio" name="userType" id="b" />
So I want to do:
Request["userType"]
and get 'a' or 'b'
But I am getting 'on' returned from Request["userType"]
Try giving each radio button a value
<input type="radio" name="userType" id="a" value="a" />
<input type="radio" name="userType" id="b" value="b" />