[Solved] Confused with model validation on Batch Editing

[Henry]

I'm working with Q1 2011 release 05/17/2011

Run the official demo, click Grid -> RAZOR -> Editing -> Batch Editing -> Add new record
Then the "Product name" column shows a edit box, you must enter something to pass the required validation, everything seems working  fine. but... It is not real.

Change the "EditingBatch.cshtml" file in the "Razor" area. Make the "UnitPrice" column as the first column like below:

.Columns(columns =>
{
    columns.Bound(p => p.UnitPrice).Width(130).Format("{0:c}");
    columns.Bound(p => p.ProductName).Width(210);

re-Run the demo, click Grid -> RAZOR -> Editing -> Batch Editing -> Add new record
Then the "Unit price" column shows a edit box, you just do not enter anything, click the "Save changes" button on the tool bar of the grid, you will post back the new blank row to the server side, then the error prompt shows, you meet a validate error: the Product name is required. everything seems working  fine. but... It is not real.

If you click the column header of the "Unit price" column to sort all rows, you will see the blank row has been accepted and "saved" to the data store.

By tracking the error information sent from server, I found the model state error prompt was coming with, and at the end of the data records. 

Please advise if it is a bug, and how to apply server side validation and send back the error information to the client by JSON.

Also please forgive my poor english, :)

Thanks
Henry

[Henry]

I found there're no any server side validations in the "Batch Editing" demo actually, so if you bypass the client validation like I have done, you will get the validation error prompt at client side and the server will accept the invalid data.

[Henry]

My solution: 

EditingBatchController.cs:

using System;
using System.Linq;

......

        [AcceptVerbs(HttpVerbs.Post)]
        [CultureAwareAction]
        [GridAction]
        public ActionResult _SaveBatchEditing([Bind(Prefix = "inserted")]IEnumerable<EditableProduct> insertedProducts,
            [Bind(Prefix = "updated")]IEnumerable<EditableProduct> updatedProducts,
            [Bind(Prefix = "deleted")]IEnumerable<EditableProduct> deletedProducts)
        {
            if (ModelState.IsValid)
            {

                if (insertedProducts != null)
                {
                    foreach (var product in insertedProducts)
                    {
                        SessionProductRepository.Insert(product);
                    }
                }

                if (updatedProducts != null)
                {
                    foreach (var product in updatedProducts)
                    {
                        var target = SessionProductRepository.One(p => p.ProductID == product.ProductID);
                        if (target != null)
                        {
                            target.ProductName = product.ProductName;
                            target.UnitPrice = product.UnitPrice;
                            target.UnitsInStock = product.UnitsInStock;
                            target.LastSupply = product.LastSupply;
                            target.Discontinued = product.Discontinued;

                            SessionProductRepository.Update(target);
                        }
                    }
                }

                if (deletedProducts != null)
                {
                    foreach (var product in deletedProducts)
                    {
                        SessionProductRepository.Delete(product);
                    }
                }

                return View(new GridModel(SessionProductRepository.All()));
            }
            else
            {
                Response.StatusCode = 500;
                return Content(String.Join("\n",
                (from state in ModelState select state)
                    .SelectMany(s => s.Value.Errors)
                    .Select(e => e.ErrorMessage)
                    .ToArray()));

            }
        }

EditingBatch.cshtml:

function Grid_onError(e) {
    var message = "Errors:\n";
    message += e.XMLHttpRequest.responseText;
    e.preventDefault();
    alert(message);
}

[Timir]

Hello,

I am using Ajax binding and I am showing the alert message on validation error as your sample.

I want to show it to inline with the Cell where the error is.

Is there a way to do it?

Thanks.

[Alex]

Henry,

Your workaround worked very well for me.  Too bad the grid doesn't support server side validation in batch edit mode. Maybe in future versions ;)

To make the error message more pretty I used jquery ui dialog box.  Here's my code:

function Grid_onError(e) {
    var tag = $("<div></div>");
    var message = e.XMLHttpRequest.responseText;
    e.preventDefault();

    //use jquery dialog box
    message = message.replace(/\n/g, "<br>"); //replace newlines with breaks
    tag.html(message).dialog({
        modal: true,
        title: "Error",
        resizable: false,
        buttons: {
            Ok: function() {
                $(this).dialog("close");
            }
        }
    });
    //alert(message);
}