Any way of posting back to modal popup?

Question

I'm using MVC entity framework in VS 2012, and I have the following problem. I have a link on every page to add a new client, which brings up a modal popup window with a form to add said client. The problem I'm having is, when I submit the form, the controller checks to see if that client has already been added. If not, then it takes the user to the client index page, and shows the details of the client that was just added. What I don't know how to do is if that client has already been added, to show the modal popup again with an error message at the top along the lines of Unable to add client, another client with those details already exists. My code is below:

Modal Partial View

@using System.Web.Optimization
@model Ringback.ViewModels.ClientDetailsViewModel

<div class="modal-dialog">
    <!-- Modal content-->
    <div class="modal-content">
        <div class="modal-header">
            <a class="close" data-dismiss="modal" aria-hidden="true">&times;</a>
            <h3>New Client</h3>
        </div>

        @using (Html.BeginForm("AddClientRow", "Client", null, FormMethod.Post, new { id = "AddClientDetailForm", @class = "" }))
        {    
            <div class="client-body">
                <div class="client-form">

                    <div class="client-form-control">
                        @Html.LabelFor(model => model.Firstname, new { @style = "margin-left:10px" })
                        @Html.TextBoxFor(model => model.Firstname, new { @style = "margin-left:9px" })
                        @Html.LabelFor(model => model.Surname, new { @style = "margin-left:10px" })
                        @Html.TextBoxFor(model => model.Surname, new { @style = "margin-left:14px" })
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <input type="submit" value="Save Changes" id="addNewClient" class="btn btn-primary" />
                <input type="button" value="Cancel" aria-hidden="true" data-dismiss="modal" class="btn btn-primary" />
            </div>
        }
    </div>
</div>

Controller

[HttpPost]
public ActionResult AddClientRow(ClientDetailsViewModel viewModel)
{
    using (var logger = new MethodLogger())
    {
        try
        {
            var clientId = 0;
            if (ModelState.IsValid)
            {
                var client = new App_Client()
                {
                    Firstname = viewModel.Firstname,
                    Surname = viewModel.Surname,
                };
                var clients = _clientService.GetAllClients().Where(x => x.Firstname == client.Firstname &&
                                                                        x.Surname == client.Surname);
                if (!clients.Any())
                {
                    _clientService.SaveClient(client);
                    clientId = client.ClientId;
                }
                else
                {
                    //don't know what to put here to show the modal again with the error message
                }
            }
            return RedirectToAction("Index", new { clientId = clientId });

        }
        catch (Exception e)
        {
            logger.LogException(e);
            throw;
        }
    }
}

If I put RedirectToPartial with the name of the modal partial, it will not load it as a modal popup on whatever page the user is on, instead it will redirect to a page with the modal content on it and nothing else. I think I could probably achieve this using Json, but it seems messy, and would be easier if I could just put something in the controller to handle it. Is it doable, or is Jquery the only way?

Answer 1

You can do that by using JavaScript with ajax.

What have to do :-

1. Just make a method in controller which check user already exist or not. it will return result in json format.
2. Create a JavaScript function which make a ajax call to that method of controller and return true if user not exist or return false if user already exist and shown an message into a lable inside that model.
3. Call that JavaScript function on that button which you are using to do post-back.

it will work. i also doing the same thing many times when using model.