<div class="modal fade" id="signup" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-url='@Url.Action("Register","Account")'>
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="H1">Sign Up</h4>
</div>
<div class="modal-body" id="modalsignupbody">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
<button type="submit" id="SignUpbtn" class="btn btn-warning">Sign Up</button>
控制器:
[AllowAnonymous]
public ActionResult Register()
{
return PartialView("Register");
}
JQUERY:
$('#SignUpbtn').click(function () {
var url = $('#signup').data('url');
$.get(url, function (data) {
$('#modalsignupbody').html(data);
$('#signup').modal('show');
});
});
有人可以帮帮我吗?
错误:模态没有打开页面只是刷新
部分视图代码:
@model BrightFolio.Models.RegisterModel
@{
ViewBag.Title = "Register";
}
<hgroup class="title">
<h1>@ViewBag.Title.</h1>
<h2>Create a new account.</h2>
</hgroup>
@using (Html.BeginForm()) {
@Html.AntiForgeryToken()
@Html.ValidationSummary()
<fieldset>
<legend>Registration Form</legend>
<ol>
<li>
@Html.LabelFor(m => m.UserName)
@Html.TextBoxFor(m => m.UserName)
</li>
<li>
@Html.LabelFor(m => m.Password)
@Html.PasswordFor(m => m.Password)
</li>
<li>
@Html.LabelFor(m => m.ConfirmPassword)
@Html.PasswordFor(m => m.ConfirmPassword)
</li>
</ol>
<input type="submit" value="Register" />
</fieldset>
}
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
}
答案 0 :(得分:1)
在您的视图中使用以下
<div id='signup' class='modal hide fade in' data-url='@Url.Action("Register","Account")'>
<div id='modal-content'>
</div>
</div>
<button type="submit" id="SignUpbtn" class="btn btn-warning">Sign Up</button>
在您的脚本中使用
$(document).ready(function() {
$('#SignUpbtn').click(function() {
var url = $('#signup').data('url');
$.get(url, function(data) {
$('#modal-content').html(data);
$('#modal-content').modal('show');
});
});
});