mixing css with c# mvc in razor

Question

How can I simplify this code using razor engine (c# mvc)..Is there any way to mix c# and css inside razor engine?

Actually i am not getting correct answer while trying this

 @model FoodViewModel

@foreach (FoodView item in Model.Foodviews)
{         
 @if (item.vote == 1)
       {
        <input type="radio" name="example" class="rating" value="1"  checked="checked" />
        <input type="radio" name="example" class="rating" value="2" />
        <input type="radio" name="example" class="rating" value="3" />
        <input type="radio" name="example" class="rating" value="4" />
        <input type="radio" name="example" class="rating" value="5" />
       } 
        else if(item.vote == 2)
       {
        <input type="radio" name="example" class="rating" value="1" />
        <input type="radio" name="example" class="rating" value="2"  checked="checked"  />
        <input type="radio" name="example" class="rating" value="3" />
        <input type="radio" name="example" class="rating" value="4" />
        <input type="radio" name="example" class="rating" value="5" />
       }
       else if (@item.vote == 3)
       {
        <input type="radio" name="example" class="rating" value="1" />
        <input type="radio" name="example" class="rating" value="2" />
        <input type="radio" name="example" class="rating" value="3" checked="checked" />
        <input type="radio" name="example" class="rating" value="4" />
        <input type="radio" name="example" class="rating" value="5" />
       } 

       else
       {
        <input type="radio" name="example" class="rating" value="1" />
        <input type="radio" name="example" class="rating" value="2" />
        <input type="radio" name="example" class="rating" value="3" />
        <input type="radio" name="example" class="rating" value="4" />
        <input type="radio" name="example" class="rating" value="5"  />
       } 
}

xec · Accepted Answer · 2014-02-12 08:16:05Z

1

You could try a simple loop?

@for (var i = 1; i < 6; i++) {
    if (i == item.vote) {
        <input type="radio" name="example" class="rating" value="@i" checked>
    } else {
        <input type="radio" name="example" class="rating" value="@i">
    }
}

Or, even better, with a html helper;

@for (var i = 1; i < 6; i++) {
     @Html.RadioButton("example", i, item.vote == i, new { @class = "rating" })
}

edited Feb 12, 2014 at 8:16

answered Feb 12, 2014 at 8:07

xec

18.1k3 gold badges50 silver badges58 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

user3300195 Over a year ago

where is conditioned checked?? in second answer?

xec Over a year ago

@user3300195 the third parameter is a boolean (isChecked) -- by passing item.vote == i to it, the voted item will be checked.

user3300195 Over a year ago

hi i have slight problem,if 5 radio buttons are there for each item,then while displaying all item ratings, only one of item's rating is checking.Others are not checking

user3300195 Over a year ago

Sir,only last element is checked?while looping whether page reloads?

xec Over a year ago

@user3300195 You need to have a unique value for the name property of each group -- in your post you only had "example", but if you have an id (or name or similar) property on your FoodView object, you can use that instead. Or even append it: @Html.RadioButton("radioButtonGroup" + vote.id, ...)

StuartLC · Accepted Answer · 2014-02-12 08:06:42Z

1

Why not DRY up your code by trying something like:

for (int i = 1; i <= 5; i++)
{
     <input type="radio" name="example" class="rating" value="@i" 
     @if(i == item.vote)
     {
       checked="checked"
     }
     />
}

Presumably you want some kind of label / value however?

answered Feb 12, 2014 at 8:06

StuartLC

108k18 gold badges224 silver badges293 bronze badges

2 Comments

xec Over a year ago

Haha, +1 for pretty much the exact same thing I was writing :) I am not sure how well razor does in the middle of HTML tags though, which is why I wrote two <input>s -- are you sure it will work this way too?

user3300195 Over a year ago

i am getting data from database and also i need to generate multiple group of radiobuttons for rating each items

Collectives™ on Stack Overflow

mixing css with c# mvc in razor

2 Answers 2

5 Comments

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

2 Comments

Related