convert model property value with javascript in razor

Question

i have a foreach to iterate through items in razor syntax,

@foreach (var item in Model)
{
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.Name)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.ColorCode)
        </td>
        <td>


            <div style="background-color:*************">&nbsp;&nbsp;&nbsp;</div>


        </td>
        <td>
            @Html.ActionLink("Edit", "Edit", new { id = item.ID }) |
            @Html.ActionLink("Details", "Details", new { id = item.ID }) |
            @Html.ActionLink("Delete", "Delete", new { id = item.ID })
        </td>
    </tr>
}

ColorCode is an int value ,i define an external function named IntToColorHex to convert ColorCode to equivalent hex value,i want to replace ************** with an hex color value for each row according to ColorCode,i need some thing like bellow:

<div style="background-color:IntToColorHex(@item.ColorCode)">&nbsp;&nbsp;&nbsp;</div>

you can just do tostring in razor without js function, see msdn, so enough something like background-color:#@item.ColorCode.ToString("X6") — Grundy
– Grundy, Commented Aug 16, 2015 at 15:18
thanks,but i create IntToColorHex function in external .js file that linked to my view ,item.ColorCode must pass to this function to calculate new value and then set it to background-color — Kūrosh
– Kūrosh, Commented Aug 16, 2015 at 15:22
Why you want call js function, instead just render needed value on server? — Grundy
– Grundy, Commented Aug 16, 2015 at 15:25

Grundy · Accepted Answer · 2015-08-16 15:35:55Z

1

You can't call js function from style attribute, so this line

<div style="background-color:IntToColorHex(@item.ColorCode)">&nbsp;&nbsp;&nbsp;</div>

just render to something like

<div style="background-color:IntToColorHex(100000)">&nbsp;&nbsp;&nbsp;</div>

But you can use simple ToString with hexadecimal ("X") format specifier like

<div style="background-color:#@item.ColorCode.ToString("X6")">&nbsp;&nbsp;&nbsp;</div>

answered Aug 16, 2015 at 15:35

Grundy

13.4k3 gold badges39 silver badges57 bronze badges

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

Collectives™ on Stack Overflow

convert model property value with javascript in razor

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related