bug entre asp.net mvc et jqueryui dialog form
Bonjour.
Pour le projet que je suis entrain de monter pour ma boite, je sais que je vais avoir besoin de pas mal de popup contenant des formulaires.
voici mon layout :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34
| <!DOCTYPE html>
<html lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta charset="utf-8" />
<title>@ViewBag.Title - Mon application ASP.NET MVC</title>
<link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<meta name="viewport" content="width=device-width" />
<!-- CSS -->
@Styles.Render("~/Content/_Unauthentificated")
@RenderSection("css", required: false)
<!-- modernizr -->
@Scripts.Render("~/bundles/modernizr")
<!-- jQuery -->
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
@RenderSection("jquery", required: false)
<!-- Scripts -->
@Scripts.Render("~/bundles/_Unauthentificated/Layout", "~/bundles/jqueryval")
@RenderSection("scripts", required: false)
</head>
<body>
@Html.Partial("_UnauthentificatedHeaderPartial")
@Html.Partial("_UnauthentificatedNavPartial")
@Html.Partial("_UnauthentificatedFooterPartial")
<div id="dialog-form"></div>
</body>
</html> |
voici un fichier javascript qui initialise une popup vide :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33
| $(function () {
$("#dialog-form").dialog({
autoOpen: false,
closeOnEscape: true,
modal: true,
resizable: false,
close: function () {
$(this).empty();
}
});
function DisplayPopup(Title, Url, Width, Height) {
$("#dialog-form").dialog({
title: Title,
width: Width,
height: Height
})
.html("<div class=\"loading\"></div>")
.dialog("open")
.load(Url);
}
$("a.button.login").click(function () {
DisplayPopup("Connexion", "/fr-FR/Account/Login", 500, 350);
return false;
});
});
$(document).ajaxStop(function () {
$.validator.unobtrusive.parse('form');
}); |
voici ma vue partielle contenant mon formulaire de login :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66
| @model LivDevis.Models.LoginModel
<script>
$(function () {
$("form").submit(function () {
var UserName = $("input[type=text]#UserName").val();
var Password = $("input[type=password]#Password").val();
var RememberMe = $("input[type=checkbox]#RememberMe").is(':checked');
var loginData = [];
loginData.push({ "name": "login.UserName", "value": UserName });
loginData.push({ "name": "login.Password", "value": Password });
loginData.push({ "name": "login.RememberMe", "value": RememberMe });
$.ajax({
url: "/fr-FR/Account/Login",
method: "post",
data: loginData,
success: function (error) {
alert(error);
}
});
return false;
});
});
</script>
<section id="center">
<hgroup class="title">
<h1>@*@ViewBag.Title.*@</h1>
</hgroup>
<section id="loginForm">
<h2>@LivDevis.Resources.Views.Account.Login.UseLocalAccount</h2>
<span>@ViewBag.Error</span>
@using (Html.BeginForm("Login", "Account", FormMethod.Post, new { autocomplete = "off" })) {
@Html.ValidationSummary(true)
<fieldset>
<legend>@LivDevis.Resources.Views.Account.Login.ConnectionForm</legend>
<ol>
<li>
@Html.LabelFor(m => m.UserName)
@Html.TextBoxFor(m => m.UserName)
@Html.ValidationMessageFor(m => m.UserName)
</li>
<li>
@Html.LabelFor(m => m.Password)
@Html.PasswordFor(m => m.Password)
@Html.ValidationMessageFor(m => m.Password)
</li>
<li>
@Html.CheckBoxFor(m => m.RememberMe)
@Html.LabelFor(m => m.RememberMe, new { @class = "checkbox" })
</li>
</ol>
<input type="submit" value="@LivDevis.Resources.Views.Account.Login.Connecting" />
</fieldset>
}
</section>
</section> |
voici un extrait de mon controller :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67
| using LivDevis.ClassLibrary.Entities;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Transactions;
using System.Web;
using System.Web.Mvc;
using System.Web.Security;
using DotNetOpenAuth.AspNet;
using Microsoft.Web.WebPages.OAuth;
using WebMatrix.WebData;
//using LivDevis.Filters;
using LivDevis.Models;
namespace LivDevis.Controllers
{
//[Authorize]
//[InitializeSimpleMembership]
public class AccountController : BaseController
{
//
// GET: /Account/Login
//[AllowAnonymous]
public ActionResult Login()
{
return PartialView("LoginPartial");
}
[HttpPost]
public string Login(LoginModel login)
{
string response = string.Empty;
if (ModelState.IsValid)
{
// trying to connect the user
if (Membership.ValidateUser(login.UserName, login.Password))
{
if (WebSecurity.Login(login.UserName, login.Password, persistCookie: false))
{
return response;
}
}
// declare the connection attempt
else
{
LivDevis.ClassLibrary.Entities.User user = LivDevis.ClassLibrary.Entities.User.GetByUserName(login.UserName);
switch (user != null)
{
case true:
response = (!user.IsAuthorized) ? "Votre compte a été désactivé. Veuillez consulter un administrateur." : response;
response = (!user.IsActivated) ? "Ce compte n'a pas été activé. Veuillez consulter l'email de demande d'activation de compte." : response;
response = (user.IsActivated && user.IsAuthorized) ? "Erreur sur le mot de passe." : response;
break;
case false:
response = "Erreur sur le nom d'utilisateur";
break;
}
}
}
return response;
}
}
} |
Alors maintenant, quels sont les bugs ?
D'une part, lorsque je clique sur le bouton de connexion, mon formulaire n'est pas validé par le plugin "jqueryval", ça passe directement au submit !
Deuxième bug, lorsque je procède au submit, je n'entre pas dans la méthode de mon controller, et j'obtiens une alerte contenant le contenu HTML de ma vue partielle.
Code:
1 2 3
| success: function (error) {
alert(error);
} |
Comment puis-je m'assurer que "jqueryval" fonctionne de nouveau, et corriger le submit ?
Merci pour votre aide ! :)