Monday, 22 January 2018

Watermark Model TextBox using jQuery in ASP.Net MVC

Watermark Model TextBox using jQuery in ASP.Net MVC

Description:

In this example we explain that how to create watermark text to TextBox in Asp.Net MVC.or how to create Watermark Text to TextBox in MVC razor. Or how to impalement Watermark Text in TextBox same like as PDF in MVC.

So here we demonstrate that Watermark Model TextBox using jQuery in Asp.Net MVC.or how to implement Watermark text in TextBox using jQuery in MVC Razor View.
Model:

   public class EmployeeModel
    {
        [Display(Name = "EmployeeName:")]
        public string EmpName { get; set; }

        [Display(Name = "Designation:")]
        public string Designation { get; set; }
    }

Controller: 

public class EmployeeController : Controller
    {
        public ActionResult Index()
        {
            return View();
        }
    }

View: 

@model WaterMark_TextBox_MVC.Models.EmployeeModel

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <title> Watermark Model TextBox using jQuery in ASP.Net MVC</title>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script src="~/Scripts/WaterMark.min.js"></script>
    <script type="text/javascript">
        $(function () {
            //Default usage.
            $("#EmpName").WaterMark();

            //Change color of Watermark.
            $("#Designation").WaterMark(
            {
                WaterMarkTextColor: '#ff0000'
            });
        });
    </script>
</head>
<body>
    <table>
        <tr>
            <td>@Html.DisplayNameFor(m => m.EmpName)</td>
            <td>@Html.TextBoxFor(m => m.EmpName, new { title = "Enter Employee Name" })</td>
        </tr>
        <tr>
            <td>@Html.DisplayNameFor(m => m.Designation)</td>
            <td>@Html.TextBoxFor(m => m.Designation, new { title = "Enter Designation" })</td>
        </tr>
    </table>
</body>
</html>


0 comments:

Post a Comment