我对Javascript很新。我正在处理这个视图,所以按钮提交应该保存数据,如果文本框是空的,则有一个错误的javascript部分应该回复一个bootstrap aler No Data。但在所有情况下,无数据警报都不会显示,只有成功警报,即使这些字段中的字段为空。我会恳请每一个帮助。
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function ()
{
$("#btnSubmit").click(function () {
var data = $("#myForm").serialize();
var newUrl = '@Url.Action("Index","AspNetUsers")';
$.ajax({
type: "POST",
url: "/AspNetUsers/Index1",
data: data,
success: function (response) {
$('#your-modal').fadeTo(2000, 500).slideUp(500, function () {
$('#your-modal').slideUp(500);
window.location.href = newUrl;
// $('#your-modal').modal('toggle');
// $('#your-modal').show();
//$('#your-modal .btn-default').click(function () {
// window.location.href = newUrl;
});
// window.location.href = 'Url.Action("Index", "Pages")';
//window.location.href = "/{controller}/{action}" //in your case, /employee/empl
// window.location = "//www.aspsnippets.com/";
// }
// alert("done");
},
error: function (response) {
// alert('No Data ');
$('#your-modal2').fadeTo(2000, 500).slideUp(500, function () {
$('#your-modal2').slideUp(500);
});
}
})
})
})
</script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
&#13;
<style>
#your-modal
{
text-align:center;
}
#your-modal2
{
text-align:center;
}
#x:hover {
padding: 15px;
border: 1px solid #6699ff;
border-bottom-width: 2px;
background-color: transparent;
}
.col-md-6.active:hover {
box-shadow: 2px 2px 2px 2px rgba(4,4,4,.4) !important;
}
</style>
&#13;
@model CMSFC.Models.AspNetUser
@{
ViewBag.Title = " ";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<div class="alert alert-success" id="your-modal" hidden="hidden" >
<strong>DONE </strong>
<br />
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
<div class="alert alert-warning" id="your-modal2" hidden="hidden" >
<strong>No Data</strong>
<br />
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
<form id="myForm">
<div style="display:block">
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="col-md-6 active" style="border: 0.5px solid ;box-shadow: 5px 5px 5px #99ccff; border-radius: 5px;margin-right:10px;float:left;width: 55%; height:40%;margin-left:-10%;">
<div class="form-horizontal">
<h3 style="text-align:center; border-radius:5px;margin:5px;padding:15px;color:black">Title</h3>
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group">
@Html.LabelFor(model => model.Id, htmlAttributes: new { @class = "control-label col-md-4 " })
<div class="col-md-6">
@Html.EditorFor(model => model.Id, new { htmlAttributes = new { id = "x", @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Id, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Email, htmlAttributes: new { @class = "control-label col-md-4" })
<div class="col-md-6">
@Html.EditorFor(model => model.Email, new { htmlAttributes = new { id = "x", @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Email, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
<div>
@Html.LabelFor(model => model.EmailConfirmed, htmlAttributes: new { @class = "control-label col-md-4" })
<div class="col-md-6">
<div class="checkbox">
@Html.EditorFor(model => model.EmailConfirmed)
@Html.ValidationMessageFor(model => model.EmailConfirmed, "", new { @class = "text-danger" })
</div>
</div>
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.PasswordHash, htmlAttributes: new { @class = "control-label col-md-4" })
<div class="col-md-6">
@Html.EditorFor(model => model.PasswordHash, new { htmlAttributes = new { id = "x", @class = "form-control" } })
@Html.ValidationMessageFor(model => model.PasswordHash, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.SecurityStamp, htmlAttributes: new { @class = "control-label col-md-4" })
<div class="col-md-6">
@Html.EditorFor(model => model.SecurityStamp, new { htmlAttributes = new { id = "x", @class = "form-control" } })
@Html.ValidationMessageFor(model => model.SecurityStamp, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.PhoneNumber, htmlAttributes: new { @class = "control-label col-md-4" })
<div class="col-md-6">
@Html.EditorFor(model => model.PhoneNumber, new { htmlAttributes = new { id = "x", @class = "form-control" } })
@Html.ValidationMessageFor(model => model.PhoneNumber, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.PhoneNumberConfirmed, htmlAttributes: new { @class = "control-label col-md-5" })
<div class="col-md-5">
<div class="checkbox">
@Html.EditorFor(model => model.PhoneNumberConfirmed)
@Html.ValidationMessageFor(model => model.PhoneNumberConfirmed, "", new { @class = "text-danger" })
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 active" style="border: 0.5px solid ;
box-shadow: 5px 5px 5px #99ccff;border-radius: 5px; margin-bottom:10%;float:right ;margin-right:-5%; width: 55%; height:1
00%;margin-left:1%; position:relative;">
<h3 style="text-align:center; border-radius:5px;margin:5px;padding:15px;color:black">Title</h3>
<hr />
<div class="form-group">
@Html.LabelFor(model => model.TwoFactorEnabled, htmlAttributes: new { @class = "control-label col-md-4" })
<div class="col-md-6">
<div class="checkbox">
@Html.EditorFor(model => model.TwoFactorEnabled)
@Html.ValidationMessageFor(model => model.TwoFactorEnabled, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.LockoutEndDateUtc, htmlAttributes: new { @class = "control-label col-md-4" })
<div class="col-md-6">
@Html.EditorFor(model => model.LockoutEndDateUtc, new { htmlAttributes = new { id = "x", @class = "form-control" } })
@Html.ValidationMessageFor(model => model.LockoutEndDateUtc, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="col-md-6 active" style="border: 0.5px solid ;
box-shadow: 5px 5px 5px #99ccff;border-radius: 5px; margin-top:-20%;float:right ;margin-right:-5%; width: 55%; height:100%;margin-left:5%; position:relative;">
<h3 style="text-align:center; border-radius:5px;margin:5px;padding:15px; color:black">Title</h3>
<hr />
<div class="form-group">
@Html.LabelFor(model => model.LockoutEnabled, htmlAttributes: new { @class = "control-label col-md-4" })
<div class="col-md-6">
<div class="checkbox">
@Html.EditorFor(model => model.LockoutEnabled)
@Html.ValidationMessageFor(model => model.LockoutEnabled, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.AccessFailedCount, htmlAttributes: new { @class = "control-label col-md-4" })
<div class="col-md-6">
@Html.EditorFor(model => model.AccessFailedCount, new { htmlAttributes = new { id = "x", @class = "form-control" } })
@Html.ValidationMessageFor(model => model.AccessFailedCount, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.UserName, htmlAttributes: new { @class = "control-label col-md-4" })
<div class="col-md-6">
@Html.EditorFor(model => model.UserName, new { htmlAttributes = new { id = "x", @class = "form-control" } })
@Html.ValidationMessageFor(model => model.UserName, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="btn-toolbar" style="float:left;">
<br />
<input type="reset" value="Create" class="btn btn-primary" id="btnSubmit" />
<button type="button" class="btn">Basic</button>
<button type="button" class="btn btn-default">Default</button>
<button type="button" class="btn btn-primary">Primary</button>
<button type="button" class="btn btn-success">Success</button>
<button type="button" class="btn btn-info">Info</button>
<button type="button" class="btn btn-warning">Warning</button>
<button type="button" class="btn btn-danger">Danger</button>
</div>
}
</div>
</form>
&#13;
e // GET: AspNetUsers/Create
public ActionResult Index1()
{
return View();
}
// POST: AspNetUsers/Create
// To protect from overposting attacks, please enable the specific properties you want to bind to, for
// more details see http://go.microsoft.com/fwlink/?LinkId=317598.
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Index1([Bind(Include = "Id,Email,EmailConfirmed,PasswordHash,SecurityStamp,PhoneNumber,PhoneNumberConfirmed,TwoFactorEnabled,LockoutEndDateUtc,LockoutEnabled,AccessFailedCount,UserName")] AspNetUser aspNetUser)
{
if (ModelState.IsValid)
{
db.AspNetUsers.Add(aspNetUser);
db.SaveChanges();
// return Json("User Details are updated");
return RedirectToAction("Index");
}
return View(aspNetUser);
}
答案 0 :(得分:0)
除非你的Asp脚本响应HTTP错误,否则不要期望调用JS错误回调。
大多数现代Web框架都可以帮助您进行客户端验证(但绝不依赖它)。或者您可以尝试编写自己的:
$('input').each(function(k, v) {
var v_val = $(v).val()
if (v_val == null || v_val == "") {
alert("Fill required field" + $(v).attr("name"))
}
});
像这样......
答案 1 :(得分:-1)
ng-pattern