views:

114

answers:

1

My AddressEditViewModel has a bunch of attributes marked [Required(ErrorMessage="My Error Message Here")] and/or [DisplayName("etc")]. The DisplayName attributes work:

<%: Html.LabelFor(model => model.Field) %>

, and I think the Required attributes are working too, but I don't know how to provide feedback on the form (jQuery UI Dialog). This form is submitted via $.ajax(), and in the action method:

[HttpPost]
    public ActionResult Edit(AddressEditViewModel address)
    {
        var addressToEdit = dc.Addresses.FirstOrDefault(x => x.AddressID == address.AddressIDEdit);

        if (ModelState.IsValid)
        {
            //make sure there is at least one active address
            if (!address.ActiveEdit && (addressToEdit != null && addressToEdit.Active))
            {
                if (dc.Addresses.Where(x => x.ProfileID == addressToEdit.ProfileID).Count(x => x.Active) == 1)
                {
                    address.ActiveEdit = true;
                }
            }

            try
            {
                //TryUpdateModel SUCKS!~
                //use valueinjecter
                addressToEdit.InjectFrom<VMToAddress>(address);

                dc.SubmitChanges();
            }
            catch (Exception)
            {
                return View(address);
            }
        }
        else
        {
            return View(address); //activate the red borders around textboxes
        }

        return Content("Ok");
    }

And the little class for ValueInjecter:

public class VMToAddress : LoopValueInjection
{
    protected override string TargetPropName(string sourcePropName)
    {
        if (sourcePropName.EndsWith("Edit"))
        {
            return sourcePropName.RemoveSuffix("Edit"); 
        }
        else if (sourcePropName.EndsWith("Create"))
        {
            return sourcePropName.RemoveSuffix("Create");
        }
        else
        {
            return sourcePropName;
        }
    }
}

ModelState.IsValid returns true even though address.RequiredField is null. SubmitChanges() throws a SqlException because it can't insert the NULL value. Am I not understanding how to use ModelState, or is there some other way to provide feedback on an invalid field? I'd like to set a red border around my textboxes like the model validation I've seen in a lot of the MVC tutorials, or maybe display my ErrorMessage value from the ViewModel.

Another Edit

Removed jQuery.validate and created a customer model binder to accommodate the commonly named elements. The custom model binder now even adds the validation messages (so I removed the Html.ValidationMessageFor(...) calls since I don't want them--just the borders).

However, at Omu's suggestion to use the jQuery.form plugin, my model seems to be lost after the first postback. closeEditForm just checks for a return of Content("Ok"), closes the Edit dialog and finally refreshes the List dialog. But, after an error, it correctly does not close the dialog, gives me red borders (hooray), but on subsequent posts there is no model (boo) passed to my binder--just null values.

$('#editform').submit(function () {
    $(this).ajaxSubmit({
        target: '#editform', //this will allow validation classes to be added, etc
        success: closeEditForm //this will close the edit form if the response text is "Ok"
    });
    return false;
});

I submit the form like this:

$("#dialog-address-edit").dialog({
            ...lots of dialog settings
            buttons: {
                'Save': function () {
                    $('#editform').submit();
+3  A: 

I would recommend you to use jquery.form plugin and in the action if the modelstate is good you return Content("ok") else you return View(yourViewModel), at the client you look if the response is OK you close the dialog else you fill it with the response (which is html)

You can look here: http://surveymaster.codeplex.com/ I did a lot of ajax with jquery.form in this project, although I didn't used the thing with returning html in ajax reponse cuz it wasn't necessary there

Omu
I think I have it working using jQuery.validate, but my problem is that ModelState.IsValid **always** seems to be true--regardless of the invalid input. I don't think ModelState is related to my model. Wait...I am rendering the Edit View with `AddressEditViewModel`, and the Update Action accepts `Address`--is this right?
David
ok, I think I now, you have `Update(Address address)` but you should have `Update(AddressViewModel address)` instead
Omu
When I use `AddressEditViewModel`, the post doesn't pick up a hidden field in the form by the id of `AddressID-Edit`. See my edit for the jQuery that posts to /Address/Update
David
when you use viewmodels every single input in the html should have a property in the viewmodel, and than it should work
Omu
Tried passing `AddressEditViewModel` as action argument--wouldn't bind. Tried creating a custom model binder for my scenario and it still won't bind. Other posts recommend a parameterless constructor in my view model. But, the `AddressEditViewModel` returned in the Edit action (not the post) won't bind to anything so the edit fields are all blank.
David
I fixed the posts with the custom model binder class, but the validation still isn't working. I can see the validation message `span`'s generated by `Html.ValidationMessageFor(...)` but they never appear nor does the red border.
David
@David it is a very simple thing, the one you are struggling with, I haven't used any custom model binders doing this, and I never use TryUpdateModel, about the ViewModels I always keep them clean without any defined constructors, methods (no logic at all), just properties, I think it would be better if you will learn from start how to do this, you can use the link that I gave you for the jquery stuff and for more about ViewModels you can look here also (the sample asp.net mvc app) http://valueinjecter.codeplex.com/
Omu
Thanks for your patience, but it's not so simple to me. I mentioned that I fixed the binding/posting with the custom binder class. I realize you didn't use this, but I did. My problem is that my validation is not working. The only way I can make the red borders work is with the jQuery validation library--which I would like to avoid. I want to use the regular old .NET MVC validation because it will scale with my project and allow me not to code a bunch of extra jQuery.
David
if you get validation errors (!Modelstate.IsValid) in the Action and after you return View(viewModel) and in the View you have Html.TextBox (will have a class="field-validation-error") and Html.ValidationMessage will write a span with the error message
Omu
see edits. almost there
David