Dynamically change style attributes in ASP.NET MVC

Question

I'm reading percentages from a database, then use that number to create a bar showing visual progress. I need to do something like this on my aspx page:

       <%  
       if (ViewData["width"] != null){
        <div style="width: <%: ViewData["width"] %>px;"
       </div>
       }%>

Of course the above method doesn't work, but hopefully you can see what im trying to achieve. How do i change style attributes dynamically in ASP.NET MVC?

Matti Virkkunen · Accepted Answer · 2012-02-14 22:06:49Z

10

You just wrote HTML in the middle of a code block. You need to put your HTML outside the code block.

<% if (ViewData["width"] != null) { %>
    <div style="width: <%: ViewData["width"] %>px;"></div>
<% } %>

Alternatively, you could switch to the Razor language which does away with all the <% %>s and allows you to intersperse C# and HTML much easier. It looks like this:

@if (ViewBag.width != null) {
    <div style="width: @(ViewBag.width)px;"></div>
}

answered Feb 14, 2012 at 22:06

Matti Virkkunen

65.4k9 gold badges138 silver badges162 bronze badges

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

5 Comments

BoundForGlory Over a year ago

This is MVC2 so I cant use ViewBag. Also, this will be a result set with numerous results, so i need the HTML inside the code block as i'll be looping through a for statement. Unless i'm misunderstanding what you're saying

Matti Virkkunen Over a year ago

@userrandomnumbers: The HTML will still be inside the if statement (and any other control structures). Just outside the part that's interpreted as C#. Try it!

BoundForGlory Over a year ago

You know what, my method did work. I never tested it. My code didnt change color and it looked like a comment.

Matti Virkkunen Over a year ago

@userrandomnumbers: I'm finding that a bit hard to believe as it has a syntax error. You sure you didn't miscopypaste it to SO?

BoundForGlory Over a year ago

I only posted a snippet of my code. No reason to bog everyone down with a bunch of irrelevant code.

Brandon · Accepted Answer · 2012-02-14 22:07:17Z

1

Your method should work, you just need to put the div code outside of the server block.

<% if (ViewData["width"] != null){ %>
    <div style="width: <%: ViewData["width"] %>px;"
    </div>
<% } %>

answered Feb 14, 2012 at 22:07

Brandon

70.3k32 gold badges201 silver badges227 bronze badges

Collectives™ on Stack Overflow

Dynamically change style attributes in ASP.NET MVC

2 Answers 2

5 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related