CODEWITHSUNDEEP
javascriptasp.net-mvc-3popup
Teslo.
Teslo.

Reputation: 501

Open ASP.NET MVC3 application in a popup

In an ASP.NET MVC3 project, I have 2 controllers: one is

HomeController.cs

public class HomeController : Controller
{
    //
    // GET: /Home/

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

    //
    // POST: /Home/CheckLogin/

    [HttpPost]
    public ActionResult CheckLogin()
    {
        // setting the session variable if login is correct
        // and redirecting to /ReWeb/

        // else, reloading the login.
    }
}

and the other is ReWebController.cs

public class ReWebController : Controller
{
    //
    // GET: /ReWeb/

    public ActionResult Index()
    {
        // Session verification
        if (Session["_ReWeb"] != null)
        {
            return View();
        }

        // If session is null or not valid,
        // redirect to login page
        return RedirectToAction("Index", "Home");
    }
}

In the login page, which is the view returned by the HomeController Index action, I have the following form:

<div id="loginPanel">
    <form enctype="application/x-www-form-urlencoded" id="login" method="post">
        <h1>Log In</h1>
        <fieldset id="inputs">
            <input id="Utente" name="Utente" type="text" placeholder="Utente" autofocus="true" required="true" />   
            <input id="Password" name="Password" type="password" placeholder="Password" required="true" />
        </fieldset>
        <fieldset id="actions">
            <input type="submit" id="submit" value="Log in" onclick="javascript:window.open('/Home/CheckLogin/', 'WebClient', 'width=500,height=250,left=100,top=100')"/>
        </fieldset>
    </form>
</div>

What I'm trying to do is, when the user clicks the Log in button, the application to return the view of the ReWebController in a popup page. From what I've done here, it opens the popup, but gives an 404 error: Server Error in '/' Application. The resource cannot be found. Requested URL: /Home/CheckLogin/.

How can I accomplish this approach? Am I doing it right?

Many thanks!

Upvotes: 0

Views: 375

Answers (2)

brad oyler
brad oyler

Reputation: 3780

You could just add action="Checklogin" to your form element.

Upvotes: 0

Kristof Claes
Kristof Claes

Reputation: 10941

You're getting the 404 error because your HomeController only contains a CheckLogin action that accepts POST-requests. When clicking your login button, your just loading a URL in a new window, which is a GET-request.

One option to handle this to let you CheckLogin action return a JSON object containing true or false, depending on whether or not the login was successful. In your login view, you can then do something like this:

$('form#login').submit(function () {
    var data = {}; // put the login data in here

    $.post('/Home/CheckLogin', data, function (result) {
        // Here you can check 'result'
        if (result.success === true) {
            window.open('/ReWeb', 'WebClient', 'width=500,height=250,left=100,top=100');
        }
        else {
            // The login failed
        }
    }).error(function() {
        // Something went wrong when trying to make the request.
        // Like a 404, 501, ... error
    });

    return false;
});

Upvotes: 1

Related Questions