Radio button value check in action is true or false - asp.net-mvc

I am new in MVC. I am working on a view where I add two radio buttons.
<label for="lDIV1">
<input id="lDIV1" type="radio" name='rbtab' value='DIV1' onclick="javascript:custom()" />Create
Email:</label>
<label for="lDIV2">
<input id="lDIV2" type="radio" name='rbtab' checked="checked" value='DIV2' onclick="javascript:defaul()" />Default
Email:</label>
<div id='Content' style="display: block">
Now I want to call a function in Action {Http} that is if first radio button is true then call radiobutton1() method or else call radiobutton2() method
Can you guys Help me out how to apply conditions..

im not sure what you want to do because your question is not that clear but here is how you can do something when a checkbox is checked with jquery
http://jsfiddle.net/HQXLm/1/
<input id="checkme" type="checkbox" /> click me to find out if im checked
$('#checkme').click(function(){
if ($(this).is(':checked')){
alert('I am checked, do something here');
}
});

Related

Submitting a collection of checkboxes in MVC when the first checkbox is unchecked produces null

Basically I have a collection of strings, and I want to render them as checkboxes on the page. To do this, I have written this code:
#for (var i=0; i< Model.AvailableCats.Length; i++)
{
<input type="checkbox" name="Cats[#i]" value="#Model.Cats[i]" #(Model.Cats.Contains(Model.AvailableCats[i]) ? "checked=checked" : "") /> #Model.AvailableCats[i]
}
This produces checkboxes like
<input type="checkbox" checked="checked" value="Bengal" name="Cats[0]">
<input type="checkbox" checked="checked" value="Moggy" name="Cats[1]">
When submitted this works ok if both are checked, or if the first is checked, but if only the 2nd item is checked, it's only submitting Cats[1] and MVC does not map this into an array.
I'm sure the answer is very simple but how can I submit my collection of checkbox values?
This is why Html.Checkbox actually adds a hidden input element in addition to the checkbox input. Checkboxes only submit a value if they are checked, so adding a hidden input with the same name, means that if it's not checked, something will be submitted, even if it's only an empty string.
<input type="checkbox" checked="checked" value="Bengal" name="Cats[0]">
<input type="hidden" name="Cats[0]" value="">
<input type="checkbox" checked="checked" value="Moggy" name="Cats[1]">
<input type="hidden" name="Cats[1]" value="">
Okay the answer was simple, just have the same name property on each one. It doesn't have to be unique and MVC binds it into a collection if more than one are submitted.
<input type="checkbox" checked="checked" value="Bengal" name="Cats">
<input type="checkbox" checked="checked" value="Moggy" name="Cats">
Surprised it took me that long.

Semanitc UI with ASP.NET MVC Checkbox

I'm trying to use the semantic UI checkbox in an MVC application, however, I've noticed that when using CheckBoxFor() it creates 2 inputs, one of which is hidden:
<div class="field">
<div class="ui checkbox">
<input data-val="true" id="OilStarvation" name="OilStarvation" type="checkbox" value="true">
<input name="OilStarvation" type="hidden" value="false">
<label for="OilStarvation">Oil Starvation</label>
</div>
</div>
Then I activate the checkbox like so:
$('.ui.checkbox').checkbox();
When I then click the checkbox, the "tick" animation doesnt show if the checkbox is ticked, although the value of true IS being set. Is there a way I can tell semantic UI checkbox method to target the non-hidden element?
You can set css to show the tick/checked effect.
.ui.checkbox input:checked ~ .box:after,
.ui.checkbox input:checked ~ label:after
{
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
opacity: 1;
}

multiline checkbox using jQueryMobile

I want to add some more text with a different style and in yellow.
Is there a way to do this inside checkbox?
for example:
<fieldset data-role="controlgroup" data-iconpos="right">
<input type="checkbox" name="checkbox-v-6b" id="checkbox-v-6b">
<label for="checkbox-v-6b">some text</label>
</fieldset>
I've tried to add another label but that didn't work...
Any suggestions?

How to use the events?

I'm just discovering jquery-mobile, but I find the documentation not really adapted to "beginners".
So, I have a fieldset with some radiobutton. When the user "check" a button, how to do to save the value in a php session with an ajax call ?
<fieldset data-role="controlgroup">
<legend>Choose a pet:</legend>
<input type="radio" name="radio-choice-1" id="radio-choice-1" value="choice-1" checked="checked" />
<label for="radio-choice-1">Cat</label>
<input type="radio" name="radio-choice-1" id="radio-choice-2" value="choice-2" />
<label for="radio-choice-2">Dog</label>
<input type="radio" name="radio-choice-1" id="radio-choice-3" value="choice-3" />
<label for="radio-choice-3">Hamster</label>
<input type="radio" name="radio-choice-1" id="radio-choice-4" value="choice-4" />
<label for="radio-choice-4">Lizard</label>
</fieldset>
U need to bind a change handler and fire an ajax call as follows
$('input[name="radio-choice-1"]').live('change', function(){
var selectedValue = $(this).val();
$.post("save.php", {optionSelected: selectedValue});
});
where save.php contents would be
<?php
session_start();
$_SESSION['radio-choice-1-option'] = $_POST['optionSelected'];
?>
Lets start simpler with a jQuery example, how familiar are you with jQuery?
You'll need to bind a handler to the change event on the radio button, then fire an AJAX call to PHP where you set the session variable.
To bind a handler see jQuery docs for the on or live function, something like in a $(document).ready...
$('input[name="radio-choice-1"]').live('change', function(){
var value = $(this).val();
$.ajax({
//see jQuery ajax functions
});
});
But on jQuery Mobile:
You should be using the pageinit event of jQM (jQuery Mobile) to run this code not document.ready, if you're using multiple single-page-templates and ajax transitions even more so - in which case then you should also be using the on function instead of live in order to listen to bubbled events for the current page only.
Then it'll be akin to
$('#yourPage').on('change', 'input[name="radio-choice-1"]', function(){

How to check a radio button in cucumber?

I'm using cucumber with RoR (with either webrat or capybara)
How can I write a step to check a radio button? I've tried "choose" or "select" but it can't find my radio button.
I'm not sure what to do, as I have in fact 2 inputs with the same name (the 2 radio buttons belonging to the same "group")
Thanks
Example of html
<form name="myform" action="http://www.mydomain.com/myformhandler.cgi" method="POST">
<input type="radio" name="group1" value="Milk"> Milk<br>
<input type="radio" name="group1" value="Butter" checked> Butter<br>
<input type="radio" name="group1" value="Cheese"> Cheese
</form>
The answer is to choose the id (generated by Rails) of the radio button.
<form name="myform" action="http://www.mydomain.com/myformhandler.cgi" method="POST">
<input type="radio" name="group1" value="Milk" id="group1_milk"> Milk<br>
<input type="radio" name="group1" value="Butter" checked id="group1_butter"> Butter<br>
<input type="radio" name="group1" value="Cheese" id="group1_cheese"> Cheese
</form>
and do
choose("group1_milk").
That will work even if more radio buttons have the same options.
In your step definition add line:
choose('A Radio Button')
Cucumber uses Capybara, you can read more about it here: https://github.com/jnicklas/capybara

Resources