Turn bank information into Link

3

I'm doing a website which has a string from the database but I want this string to be informed as follows, instead a button will appear that the user will click and this button will open the url that is the text that is ta in the string that is the Link to Download.

<dt>
                @Html.DisplayNameFor(model => model.Link)
            </dt>
            <dd>
                @Html.DisplayFor(modelItem => item.Link)
            </dd>

Here I bring the string item to appear on the screen, but I want it to be a button that opens the URL that is itself.

    
asked by anonymous 26.06.2018 / 14:02

2 answers

0

You can use the component named Html.ValueFor , it returns the value contained in the attribute called within href , and then stylize <a> (if you want you can use my css). That is, assuming your string is a same "www.google.com" link, just put it in your View by changing "Click here" by the text of your button.

<a class="button-style" href="@Html.ValueFor(m => m.Link)">Clique aqui</a>

CSS style for button:

.button-style {
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
}
    
26.06.2018 / 14:42
0

The easiest way to do this is to use tag <a> by passing your url in the model to the href . You can also use Bootstrap classes to style your button.

 <a href="http://@modelItem.Link" class="btn btn-primary">Site</a>

<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet"/>

<a href="http://www.google.com.br" class="btn btn-primary">Site</a>

If you want to use Razor you can create your own helper.

public static class LinkHelper
{
    public static string ExternalLink(this HtmlHelper helper, string url, string text)
    {
        return String.Format("<a href='http://{0}' target="_blank"  class="btn btn-primary">{1}</a>", url, text);
    }
}

Using Help.

@Html.ExternalLink("www.google.com", "Google")

Source: link

    
27.06.2018 / 15:45