2

I want to create a simple form for adding new products using jqModal.

View / Home / Index.aspx:

<script type="text/javascript">
        $(document).ready(function () {

            $('#addProductControlSection').jqm({ modal: true,
                ajax: '<%: Url.Action("AddProduct", "Home") %>',
                onHide: myAddClose
            });

            function myAddClose(hash) {
                hash.w.fadeOut('1000', function () { hash.o.remove(); });
            }

        });
    </script>

    // rest of the code...

<a href="#" class="jqModal">Add product</a>

<div id="addProductControlSection" class="jqmWindow">

</div>

HomeController:

public ActionResult AddProduct()
{
    return View();
}

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult AddProduct(Product product)
{
    if(!ModelState.IsValid)
    {
       // how to show an error?
    }

    _productRepository.Save(product);
    // how to display 'success' or something...
}

I don't know how to implement validation. If user enters incorrect value for the Product.Price and clicks Save button, I don't want to close the form. I would like to display an error message like the one when using Validation Summary on normal views.

Thank you!

šljaker
  • 7,294
  • 14
  • 46
  • 80

1 Answers1

0

Have a look at the jQuery validation plugin or using MVC Model Validation to autogenerate the JS. The fact that it's in a modal dialog should have no effect on these techniques.

Rob Stevenson-Leggett
  • 35,279
  • 21
  • 87
  • 141
  • When I click Save button on the modal dialog, I enter the if(!ModelState.IsValid) and return View("AddProduct", product) is called. After that, modal dialog is closed and I want to prevent it. – šljaker Jul 27 '10 at 14:17
  • Regarding submit button... I forgot to include 'MicrosoftAjax.js' and 'MicrosoftMvcAjax.js' scripts. – šljaker Jul 28 '10 at 13:26