ASP.NET MVC中的弹出窗口
如何弹出模态窗口时如何删除菜单部分,因此只保留插入信息的表单。我的代码工作正常。但是,当我按编辑按钮时,它像带有导航栏一样弹出整个窗口。
我的编辑控制器(实体framevork):
// GET: Products/Edit/5
public ActionResult Edit(int? id)
{
if (id == null)
{
return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
}
Product product = db.Products.Find(id);
if (product == null)
{
return HttpNotFound();
}
ViewBag.FK_CATEGORY = new SelectList(db.Categories, "CATEGORY_ID", "CATEGORY_NAME", product.FK_CATEGORY);
return View(product);
}
// POST: Products/Edit/5
// To protect from overposting attacks, enable the specific properties you want to bind to, for
// more details see https://go.microsoft.com/fwlink/?LinkId=317598.
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Edit([Bind(Include = "PRODUCT_ID,PRODUCT_NAME,FK_CATEGORY")] Product product)
{
if (ModelState.IsValid)
{
db.Entry(product).State = EntityState.Modified;
db.SaveChanges();
return RedirectToAction("Index");
}
ViewBag.FK_CATEGORY = new SelectList(db.Categories, "CATEGORY_ID", "CATEGORY_NAME", product.FK_CATEGORY);
return View(product);
}
我的编辑partialView: @model mynewapp5.models.product
<div class="modal-header">
<h4 class="modal-title">Edit product</h4>
</div>
<!-- Modal body -->
<div class="modal-body" id="editform">
<div class="form-horizontal">
@using (Html.BeginForm("Edit", "Products", FormMethod.Post, new { @id = "formsubmit" }))
{
@Html.AntiForgeryToken()
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
@Html.HiddenFor(model => model.PRODUCT_ID)
<div class="form-group">
@Html.LabelFor(model => model.PRODUCT_NAME, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.PRODUCT_NAME, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.PRODUCT_NAME, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.FK_CATEGORY, "FK_CATEGORY", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("FK_CATEGORY", null, htmlAttributes: new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.FK_CATEGORY, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Save" class="btn btn-default" />
</div>
</div>
}
</div>
和我的索引:
<div class="modal fade" id="myModal" role="dialog" data-url="@Url.Action("CreatePartialView", "Products")">
</div>
<script>
function editBut() {
$('.btn-success').click(function () {
var url = $('#myModalEdit').data('url');
$.get(url, function (data) {
$("#myModalEdit").html(data);
$("#myModalEdit").modal('show');
});
});
}
</script>
<a href="@Url.Action("Edit", "Products", new { id = item.PRODUCT_ID })" class="btn btn-success" data-toggle="modal" data-target="#myModalEdit" onclick="editBut()">Edit</a> |
How to remove the menu part when the modal window pops up, and so that only the forms for inserting information remain. My code works fine. but when I press Edit button, it popups like the whole window with nav bar.
My Edit controller (Entity Framevork):
// GET: Products/Edit/5
public ActionResult Edit(int? id)
{
if (id == null)
{
return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
}
Product product = db.Products.Find(id);
if (product == null)
{
return HttpNotFound();
}
ViewBag.FK_CATEGORY = new SelectList(db.Categories, "CATEGORY_ID", "CATEGORY_NAME", product.FK_CATEGORY);
return View(product);
}
// POST: Products/Edit/5
// To protect from overposting attacks, enable the specific properties you want to bind to, for
// more details see https://go.microsoft.com/fwlink/?LinkId=317598.
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Edit([Bind(Include = "PRODUCT_ID,PRODUCT_NAME,FK_CATEGORY")] Product product)
{
if (ModelState.IsValid)
{
db.Entry(product).State = EntityState.Modified;
db.SaveChanges();
return RedirectToAction("Index");
}
ViewBag.FK_CATEGORY = new SelectList(db.Categories, "CATEGORY_ID", "CATEGORY_NAME", product.FK_CATEGORY);
return View(product);
}
My Edit PartialView:
@model MyNewApp5.Models.Product
<div class="modal-header">
<h4 class="modal-title">Edit product</h4>
</div>
<!-- Modal body -->
<div class="modal-body" id="editform">
<div class="form-horizontal">
@using (Html.BeginForm("Edit", "Products", FormMethod.Post, new { @id = "formsubmit" }))
{
@Html.AntiForgeryToken()
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
@Html.HiddenFor(model => model.PRODUCT_ID)
<div class="form-group">
@Html.LabelFor(model => model.PRODUCT_NAME, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.PRODUCT_NAME, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.PRODUCT_NAME, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.FK_CATEGORY, "FK_CATEGORY", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("FK_CATEGORY", null, htmlAttributes: new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.FK_CATEGORY, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Save" class="btn btn-default" />
</div>
</div>
}
</div>
And my Index:
<div class="modal fade" id="myModal" role="dialog" data-url="@Url.Action("CreatePartialView", "Products")">
</div>
<script>
function editBut() {
$('.btn-success').click(function () {
var url = $('#myModalEdit').data('url');
$.get(url, function (data) {
$("#myModalEdit").html(data);
$("#myModalEdit").modal('show');
});
});
}
</script>
<a href="@Url.Action("Edit", "Products", new { id = item.PRODUCT_ID })" class="btn btn-success" data-toggle="modal" data-target="#myModalEdit" onclick="editBut()">Edit</a> |
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
尝试一下
它取自 https://jquerymodal.com/ 示例4:AJAX
我希望这有帮助
try this
it's taken from https://jquerymodal.com/ - Example 4: AJAX
I hope this helps