Popup window in asp.net mvc

Question

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> |

Answer 1

try this

// Open modal in AJAX callback
$('btn-success').click(function(event) {
  event.preventDefault();
  this.blur(); // Manually remove focus from clicked link.
  var url = $('#myModalEdit').data('url')
  $.get(url, function(html) {
    $(html).appendTo('body').modal();
  });
});

<!-- AJAX response must be wrapped in the modal's root class. -->
<div class="modal">
</div>

it's taken from https://jquerymodal.com/ - Example 4: AJAX

I hope this helps