我有这个显示数据表的视图:
@if(Request.IsAuthenticated){
<fieldset id="detailPrix">
<legend>Details prix</legend>
<div class="scrollableContainer">
<div class="scrollingArea">
<table class="cruises scrollable">
<thead>
<tr>
<th>
Carburant
</th>
<th>
Prix
</th>
<th>
Date d'ajout
</th>
<th>
Mettre à jour
</th>
</tr>
</thead>
@for(int index =0; index<Model.carburants.Count;index++){
<tbody>
<tr>
<td>
@Html.DisplayName(Model.carburants[index].data.ToString())
</td>
<td>
@Html.DisplayName(Model.prixCarburants[index].ToString())
</td>
<td>
@Html.DisplayName(Model.dateAjoutCarburants[index].ToString())
</td>
<td>
@Html.ActionLink("Modifier", "ModifierPrix", new {carbuId = Model.carburants[index].id, stationId= Model.station.id, Myvmsd=Model, index=index, prix=Model.prixCarburants[index]})
</td>
</tr>
</tbody>
}
</table>
</div>
</div>
</fieldset>
}
else{
// If the user didn't authenticated, I want to display the popup modal to login (in JQuery or JS).
}
我希望我的登录视图进入模态弹出窗口。这是我的登录视图:
<section id="loginForm">
<h2>Connexion avec un compte local.</h2>
@using (Html.BeginForm(new { ReturnUrl = ViewBag.ReturnUrl })) {
@Html.AntiForgeryToken()
@Html.ValidationSummary(true)
<fieldset>
<legend>Formulaire de connexion.</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 id="LogIn" type="submit" value="Log in" />
</fieldset>
<p>
@Html.ActionLink("Register", "Register") Si vous n'avez pas de compte.
</p>
}
</section>
<section class="social" id="socialLoginForm">
<h2>Connexion via Les réseaux sociaux</h2>
@Html.Action("ExternalLoginsList", new { ReturnUrl = ViewBag.ReturnUrl })
</section>
例如,可以在JQuery的模态弹出窗口中显示此视图吗? 在此先感谢您的帮助!
答案 0 :(得分:0)
<div id="login">
<section id="loginForm">
<h2>Connexion avec un compte local.</h2>
@using (Html.BeginForm(new { ReturnUrl = ViewBag.ReturnUrl })) {
@Html.AntiForgeryToken()
@Html.ValidationSummary(true)
<fieldset>
<legend>Formulaire de connexion.</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 id="LogIn" type="submit" value="Log in" />
</fieldset>
<p>
@Html.ActionLink("Register", "Register") Si vous n'avez pas de compte.
</p>
}
</section>
</div>
<input type="button" id="loginbtn" />
<script>
var $login= $('#login').dialog({
autoOpen: false,
title: '',
modal: true,
width: 50,
height: 50
});
// you need to write button click event to open it
$('#loginbtn').click(function(){
$login.dialog('open');
});
</script>
询问是否有任何问题。
答案 1 :(得分:0)
我找到了解决方案:
在else语句中,我更改了最后一个<td>
:
<td>
<p>
@Html.ActionLink("Se logger", "Login", "Account", null, new { @class = "openDialog", data_dialog_id = "loginDialog", data_dialog_title = "Log in"})
</p>
</td>
在我的_Layout中我添加了<script>
:
<script type="text/javascript">
$.ajaxSetup({ cache: false });
$(document).ready(function () {
$(".openDialog").live("click", function (e) {
e.preventDefault();
$("<div></div>")
.addClass("dialog")
.attr("id", $(this)
.attr("data-dialog-id"))
.appendTo("body")
.dialog({
title: $(this).attr("data-dialog-title"),
close: function () { $(this).remove(); },
modal: true,
height: 250,
width: 400,
left: 0
})
.load(this.href);
});
$(".close").live("click", function (e) {
e.preventDefault();
$(this).closest(".dialog").dialog("close");
});
});
</script>
现在效果很好。 谢谢你的回答。