@{
    ViewBag.Title = "SaveFromForm";
    Layout = "~/Views/Shared/_Layout.cshtml";
}



<h2>Save From Form</h2>

<div>

    <form method="POST" id="AddItemForm">


        <label for="Name">Name: </label>


        <input id="Name" type="text" name="Name" class="form-control"/>
        <br/>
        <label for="Price">Price: </label>
        <input id="Price" type="text" name="Price" class="form-control"/>
        <br/>

        <input id="Save" type="submit" name="Save" value="Save" class="btn btn-primary"/>
    </form>



</div>
<br/>
<div class="text-info">

    @ViewBag.Message

    @{

        string message = ViewBag.Message;

        if (message!=null)
        {

            if (message == "Already Exist")
            {
                    Response.Write("<script>alert('This food already exists');</script>");
            }

            else if (message=="Saved")
            {
                Response.Write("<script>alert('Successfully Saved');</script>");
            }
            else if (message == "Saving Failed")
            {
                Response.Write("<script>alert('Saving Failed');</script>");
            }

        }

    }

</div>

<script src="~/Scripts/jquery-3.2.1.js"></script>
<script src="~/Scripts/jquery.validate.js"></script>

<script>
    $(document).ready(function () {
        $("#AddItemForm").validate({
            rules: {
                Name: "required",
                Price: {
                    required: true,
                    number: true,
                    range: [0, 100]
                }

            },
            messages: {
                Name: "Please provide item name",
                Price: {
                    required: "Please provide item price",
                    number: "Please provide number only",
                    range: "You have to enter price between 0 to 100"
                }

            }
        });
    });
</script>