CODEWITHSUNDEEP
javascripthtmlasp.net-mvcrazor
Laila
Laila

Reputation: 649

How to display color picker in MVC razor view

I have a project created using MVC 5 , the views are created based on html razor a,Javascript and Jquery .

one of my views that is used to insert data , contains a textbox which i want it to display color picker if user click on it .

I tried to use this library jscolor.js , but it works in pure HTML page and i failed to make it work in Razor view , i don't know why .

<!DOCTYPE html>
<html>
<head>
    <title>jscolor Example</title>
</head>
<body style="text-align:center;">
    <script src="jscolor.js"></script>
    <h2>Example 1</h2>
    Color: <input class="jscolor" value="ab2567">
</body>
</html>

the link for Javascript library http://jscolor.com/

and here is the code in the MVC view

<script src="jscolor.js"></script>

<script>
    $(document).ready(function() {
        jscolor.installByClassName("jscolor");
    });
</script>

@using (Html.BeginForm("Create, "DateField", FormMethod.Post))
{
    <input class="jscolor" value="ab2567"/>
....etc

anybody have information about this ??

Upvotes: 2

Views: 5521

Answers (2)

Solaz
Solaz

Reputation: 1

You can add an using the following syntax too

@Html.TextBoxFor((m => m.PropertyList.color, new { type="color"})

Upvotes: 0

Nalin
Nalin

Reputation: 111

Try Below code. It worked for me.

@Html.TextBoxFor(m => m.PropertyList.color, new { @class = "jscolor"})

Upvotes: 3

Related Questions