Range Validation

(ASP.NET MVC)


Hi,
In this article i discuss about the Range validation in asp.net mvc.

View:-

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

<script type="text/javascript" src="../../Scripts/jquery-1.7.1.js"></script>
<script type="text/javascript" src="../../Scripts/jquery-ui-1.8.20.js"></script>
<link href="../../Content/themes/base/jquery-ui.css" rel="stylesheet" />

<h2>Range Validation Example</h2>

@model HTMLTABLERANDDBYGIRI.Controllers.CustomersModel

<div id="div_customerDetails">

    @using (Ajax.BeginForm("rangeValidation", "ASPDOTNETMVCController", new AjaxOptions { InsertionMode = InsertionMode.Replace, HttpMethod = "POST", UpdateTargetId = "div_customerDetails" }, new { id = "form_customerdetails" }))
    {

    <table>
        <tr>
            <td style="vertical-align:top; width:40%">
                @Html.Label("AccountBalance")
            </td>
            <td style="width:40%; vertical-align:top;">
                @Html.TextBoxFor(t => t.AccountBalance)
                @Html.ValidationMessageFor(t=>t.AccountBalance)
            </td>
        </tr>

        <tr>
            <td style="vertical-align:top; width:40%"></td>
            <td style="width:40%; vertical-align:top;">
                <input type="button" id="btn_submit" value="Submit" />
            </td>
        </tr>
    </table>
    }


    <script type="text/javascript">

        $(function () {

            //to submit the customer form
            $('#btn_submit').click(function () {

                var form = $('#form_customerdetails');

                $.ajax({
                    url: form.attr('action'),
                    type: "POST",
                    data: form.serialize(),
                    success: function (data) {
                        //to remove the existing border
                        $('input[type="text"]').css('border', '');
                        var status = 0;
                        var errorMessages = '<ul style="color:red">';
                        $(data).find('.field-validation-error').each(function () {
                            var inputElem = '#' + $(this).attr('data-valmsg-for');
                            $(inputElem).css('border', '1px solid red');
                            errorMessages += '<li>' + $(this).text() + '</li>';
                            status = 1;
                        });
                        if (status == 1) {
                            errorMessages += '</ul>';
                            customDialog("Error Message", errorMessages);
                        }
                        else { //if the customer form saved successfully
                            customDialog("Information", "Customer data saved successfully");

                        }
                    },
                    error: function (jqXhr, textStatus, errorThrown) {
                        alert("Error '" + jqXhr.status + "' (textStatus: '" + textStatus + "', errorThrown: '" + errorThrown + "')");
                    }

                });
            });
        });


        //jquery custom dialog box to display  exception
        function customDialog(headerValue, message) {
            //remove the existing div
            var divs = $('body').find('div[id="div_customDialog"]');
            $.each(divs, function (index, divItem) {
                $(divItem).remove();
            });

            //add new div
            $('body').append('<div id="div_customDialog"></div>');

            $('#div_customDialog').html(message);

            $('#div_customDialog').dialog({
                draggable: true,
                modal: true,
                resizable: false,
                width: 'auto',
                title: headerValue,
                minHeight: 75,
                buttons: {
                    OK: function () {
                        $(this).dialog('close');
                        $(this).dialog('destroy');
                    }
                }
            });

            $('#div_customDialog').dialog('open');
        }
    </script>

Controller:-

 public ActionResult rangeValidation()
        {
            try
            {
                return View();
            }
            catch (Exception)
            {
            }

            return null;
        }

        [HttpPost]
        public ActionResult rangeValidation(CustomersModel obj)
        {
            try
            {
                if (ModelState.IsValid)
                {
                    //data is valid
                    //write your logic to persist the customer data
                }
                return View(obj);
            }
            catch (Exception)
            { }
            return null;
        }

     public class CustomersModel
    {
        [Required]
        [Range(1000,50000)]
        public double AccountBalance { get; set; }
    }


Image

Ratings


Average Rating: 0.00 by 0 users
Giri Prasad
8/17/2013
8/17/2013
Download PDF

Comments