razor : creating pinterest string

Question

I'm trying to create a pinterest pin it button. Below is the code:

<a href="http://pinterest.com/pin/create/button/?url=http%3A%2F%2Fwww.domain.name%2Fproduct%[email protected]&media=http%3A%2F%2Fwww.domain.name%2Fproduct%[email protected]&[email protected]" class="pin-it-button" count-layout="horizontal"><img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It" /></a>
       <script type="text/javascript" src="//assets.pinterest.com/js/pinit.js"></script>

As you see there are three variables:

url : http%3A%2F%2Fwww.domain.name%2Fproduct%[email protected]

media: http%3A%2F%2Fwww.domain.name%2Fproduct%[email protected]

description: @Model.ProductDetails.ProductDescription

In all three variables some data is coming from ViewModel using @Model

But only @Model.ProductDetails.ProductDescription is working And the other two are not working maybe because they are part of a bigger string.

Answer 1

The razor parser thinks that the first two values are email addresses or similar and so leaves them as plain text. In order to inform the parser that they should be evaluated you need to use an Explicit Expression, eg @(Model.Property), so your variables would be:

url : http%3A%2F%2Fwww.domain.name%2Fproduct%2F@(Model.ProductDetails.URLName)
media: http%3A%2F%2Fwww.domain.name%2Fproduct%2F@(Model.ProductDetails.Image)
description: @(Model.ProductDetails.ProductDescription)

And your snippet would be:

<a href="http://pinterest.com/pin/create/button/?url=http%3A%2F%2Fwww.domain.name%2Fproduct%2F@(Model.ProductDetails.URLName)&media=http%3A%2F%2Fwww.domain.name%2Fproduct%2F@(Model.ProductDetails.Image)&description=@(Model.ProductDetails.ProductDescription)" class="pin-it-button" count-layout="horizontal"><img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It" /></a>
<script type="text/javascript" src="//assets.pinterest.com/js/pinit.js"></script>

I generally keep Phil Haack's Razor Quick Reference guide bookmarked!