use viewdata to perform inline styles - c#

Im populating viewdata with a bunch of css style properties.
<span style="font-size:50pt; font-family:"<%= ViewData["font"]%>";"><%= ViewData["UserCopy"]%> </span>
i want to be able to do something similar to the above. i.e use the style put into viewdata and use them on inline styles.
how can i do this?
thansk

You have too many double quotes. Try this:
<span style="font-size:50pt; font-family:<%= ViewData["font"]%>;">
<%= Html.Encode((string)ViewData["UserCopy"]) %>
</span>

Related

What is the shorthand for Response.Write in asp forms?

Currently if I have this:
<div>
some dynamic data
</div>
I am using
<div>
<% Response.Write(get.SomeString()); %>
</div>
Obviously this works fine, but there definitely seems like there should be a shorthand for this.
You're looking for <%: get.SomeString() %>
The basic syntax is documented on MSDN:
Code render blocks define inline code or inline expressions that execute when the page is rendered. There are two styles of code render blocks: inline code and inline expressions. Use inline code to define self-contained lines or blocks of code. Use inline expressions as a shortcut for calling the Write method.
<% inline code %>
<%=inline expression %>
In your case, that would look like:
<div>
<%= get.SomeString() %>
</div>
Alternatively, while not noted in the MSDN documentation (but mentioned in the comments), in newer versions of ASP.NET, you can also use <%: … %> syntax to automatically escape any HTML in before writing it to the output. As Scott Guthrie explains, this is an important step in guarding against certain forms of attacks. Which form you should choose will depend on your exact use case.

dynamically add html tag in asp.net

I need to add html tags dynamically in asp.net code behind , here is the scenario :
List<Product> products = ProductManager.GetProductList();//read data from database
Product is a class containing information I need to show in website such as product name, image,… .
For adding html code I tried this to show 5 products per page :
String finalHtmlCodeContainer="";
for(int i=0;i<=5;i++)
{
String myBox= "<div class=\"box\"> </div>";
finalHtmlCodeContainer+=mybox;
}
boxWrapper.InnerHtml=finalHtmlCodeContainer;
boxWrapper is a div that would contain our 5 product info.up to now everything is ok but problem appears when insted of "<div class=\"box\"> </div>",myBoxcontains long characters of html code , the original myBox should include this:
<div class="boxWrapper">
<div class="box">
<div class="rightHeader">rightHeader</div>
<div class="leftHeader">leftHeader</div>
<div class="article">
<img src="../Image/cinemaHeader.jpg" />
<p>
some text here <!--product.content-->
</p>
</div><!--end of article-->
<div class="rightFooter"><span>rightFooter</span>
<div class="info">
<ul>
<li>item1</li>
<li>item2</li>
<li>item3</li>
</ul>
</div>
</div><!--end of rightFooter-->
<div class="leftFooter"><span>leftFooter</span>
</div><!--end of leftFooter-->
</div><!--end of box-->
</div><!--end of boxWrapper-->
you see if i add producet.atrributes to code snippet above, it would be more messy,hard to debug , has less scalability and... . what is your solution?
It depends on the underlying product. If you are using web forms, I'd suggest using a data bound control that supports templating like the ListView or Repeater. It gives you full control over the UI, and also supports reloading the UI in ViewState. In your scenario, you'd have to build the UI on every postback. The ListView or Repeater track it in ViewState.
If you are using MVC, well using a helper method can make this easier as you can stick the item template within and then use a foreach and render out the helper.
If you are talking doing it in JavaScript, then there are templating components for doing the same thing.
I suggest you to Add repeater in your <p> tag ,
<p>
<asp:Repeater runat="server" ID="rpDetail">
<ItemTemplate>
<div class="box">
<%# Eval("YourDataField") %>
</div>
</ItemTemplate>
</asp:Repeater>
</p>
And make your products list as Repeater's datasourse in code behind .
rpDetail.DataSource = products ;
rpDetail.DataBind();

How can I convert these tags and attributes to aspx.net?

i would want convert the following html code in aspx with Response.Write and tags + attributes.
<p class="inline-medium-label button-height">
<span class="label">Large with stripes</span>
<span class="demo-progress large" data-progress-options='{"size":false,"style":"large","barClasses":["green-gradient","glossy"],"innerMarks":25,"stripes":true,"darkStripes":false}'>100%</span>
</p>
Ho can i convert it leaving intact the single quotes? Thanks!!
Thanks again!
Cris
You can certainly response.write it:
Response.Write("<p class=\"inline-medium-label button-height\">");
Response.Write(" <span class=\"label\">Large with stripes</span>");
Response.Write(" <span class=\"demo-progress large\" data-progress-options='{\"size\":false,\"style\":\"large\",\"barClasses\":[\"green-gradient\",\"glossy\"],\"innerMarks\":25,\"stripes\":true,\"darkStripes\":false}'>100%</span>");
Response.Write("</p>");
If you are using an HtmlTextWriter, you can use the AddAttribute/RenderBeginTag methods to render data, but then you have no control over the markup, and so I don't think that would work.
It really depends on the context of where this code is at to provide the best answer possible.

Templated Razor Delegates - Simpler HTML blocks

I am working on some template generation stuff with Razor, and I wish to accomplish the following syntax:
<div>
#(Html.Use<LinkItem>("Story1",
{
<span>Something cool</span>
#(item.Text)
}))
</div>
or, even better
<div>
#(Html.Use<LinkItem>("Story1",
<span>Something cool</span>
#(item.Text)
))
</div>
Using Templated Razor Delegates, I got this:
<div>
#(Html.Use<LinkItem>("Story1",
#<span>Something cool</span>
#<a href="#item.Href">
#item.Text
</a>
))
</div>
The problem is, I dont wanna have to add a # before each tag in the block, and a <text> tag doesent look too good either.
Is it possible to achieve what I am looking for? Or maybe there are other ways?
The closest you could get is with <text> nodes:
#(Html.Use<LinkItem>("Story1", #<text>
<span>Something cool</span>
#(item.Text)
</text>))
Personally I prefer using display templates:
#Html.DisplayFor(x => x.SomeCollectionProperty)
and then I define the corresponding display template which is automatically rendered for each element of the collection (~/Views/Shared/DisplayTemplates/SomeItem.cshtml)
#model SomeItem
<span>Something cool</span>
#Model.Text

How to remove the css class

I have a piece of code that is wrapped in a css class, the problem is that there is one particular line there that needs to be in the <span> but does not need the css class. How can I tell it to not take that css? for that line
<span id="myPrice" class="Price" runat="server">
<uc:CustomMessage ID="mPrice" MessageKey="myMsg" runat="server" /> //does not need css
<span ><asp:Literal ID="litPrice" runat="server" /></span>
</span>
So as you can see the second line, we dont want the css applied to it.. but it needs to be within that "myPrice" span.
Is there a way to achieve this?
Thank you
From a design standpoint it would be better to move the styling to the inner <span> instead, but if that's not possible you could probably exclude it like this:
.Price:not(input[type="button"]) { color:red; }
The above excludes buttons, but you can replace this with whatever element you need. Here's a more detailed reference:
http://kilianvalkhof.com/2008/css-xhtml/the-css3-not-selector/
Give your user control its own CSS class, and specify rules that undo the effect of Price.
<uc:CustomMessage CssClass="noStyles" ID="mPrice" MessageKey="myMsg" runat="server" />
Then, have a rule called noStyles that undoes any effects of Price.
Can you apply the css rule just to the first line ?
#myPrice #mPrice { your rule }

Categories

Resources