Question

大家好，我尝试使用模式以避免出现多个页面。但是我遇到了一个问题，首先，我单击查看按钮，它将显示模态化正确的信息；但是当我单击其他视图按钮而不是下一个数据时，它将显示前一个数据。第二，选择查看按钮并尝试选择新的鞋子按钮（期望必须以模态显示新模块）后，它将显示我在查看按钮中选择的上一项的数据：

    Controller:

          public ActionResult Index() //main page
                {
                    var result = _Context.Shoeses.Include(x => x.Supply).ToList();
                    return View(result);
                }


         public ActionResult New() //create new product
                {
                    var SupplierCategory = _Context.Suppliers.ToList();
                    var listOfSupplier = new ShoesViewModel
                    {
                        Supply = SupplierCategory
                    };
                    return PartialView(listOfSupplier);
                }

         public ActionResult Details(int id) //view selected data
                {
                    Shoes productItem = new Shoes();
                    productItem = _Context.Shoeses.Find(id);
                    return PartialView("_Details", productItem);
                }

    View: Index

            @model  IEnumerable<ShoeInformation.Models.Shoes>
            @{
                ViewBag.Title = "Index";
                Layout = "~/Views/Shared/_Layout.cshtml";
            }

            <br />
            <br />
            <h2>Tindahan sa Bahay ni Tatang Benjamin</h2>
            <br />
            <br />
        //my modal
            <div class="modal fade" id="myModal">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <a class="close" data-dismiss="modal">&times;</a>
                            <h3 class="modal-title">Details</h3>
                        </div>
                        <div class="modal-body" id="modalBody">
                            Testing Only
                        </div>
                    </div>
                </div>
            </div>
        //my modal
              <p>@Html.ActionLink("New Shoes", "New", "Shoes", new { id="btn_Modal"}, new { @class = "btn btn-primary btn-lg",@data_toggle="modal" ,@data_target="#myModal"})</p>

            <table class="table table-striped table-hover ">
                <tr>
                    <th>Product ID
                    </th>
                    <th>Product Code
                    </th>
                    <th>Product Name
                    </th>
                    <th>Item Size
                    </th>
                    <th>Supplier
                    </th>
                    <th>Available Quantity
                    </th>
                    <th>Unit Price (Php)
                    </th>
                    <th>Action
                    </th>
                </tr>



  @foreach (var shoes in Model)
            { 
                <tr class="success">
                    <td>
                        @shoes.Id
                    </td>
                    <td>
                        @shoes.ProductCode
                    </td>
                    <td>
                      @Html.ActionLink(@shoes.ProductName, "Edit", "Shoes", new { id=shoes.Id})
                    </td>
                    <td>
                        @shoes.ItemSize
                    </td>
                    <td>
                        <input type="hidden" value="@shoes.Id" id="hiddenval" />
                        @Html.HiddenFor(x => shoes.Id)
                        @Html.DisplayFor(x => shoes.Supply.SupplierName)
                    </td>
                    <td>
                        @shoes.ItemQty
                    </td>
                    <td>
                        @shoes.ItemUnitPrice
                    </td>

                    <td>

         @Html.ActionLink("View", "Details", "Shoes", new { id=shoes.Id}, new { @class = "view-Modal",@data_toggle="modal" ,@data_target="#myModal"})

                    </td>
                </tr>
            }


        </table>
        @*<a href="#" id="btn_Modal" class="btn btn-success btn-sm" data-toggle="modal" data-target="#myModal">Open Modal Testing</a>*@


        @section scripts
        {
            <script src="~/Scripts/jquery.min.js"></script>
            <script src="~/Scripts/bootstrap.min.js"></script>
            <script type="text/javascript">
                $(document).ready(function()
                {
                    $('#myModal').hide();

                    $("#btn_Modal").click(function () {
                        $('#myModal').modal('show');
                    });

                    $(".view-Modal").click(function () {
                        var productId = 
$(this).closest('tr').find('#hiddenval').val();

                            $.ajax({
                                type: 'POST',
                                url: '/Shoes/Details',
                                data: { id: productId },
                                success: function (response)
                                {
                                    $('#modalBody').html(response);
                                    $('#myModal').modal('show');
                                }
                            });
                        })

                        $(".close").click(function ()
                        {
                            console.log("Clear All");
                        });


                    });
                </script>
            }

partial view: _details
@model  ShoeInformation.Models.Shoes

    <div>
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title">Details</h4>
        </div>
        <div class="modal-body">
            <table class="tablemodel">

                    <tr>
                         <tr>
                            @Html.DisplayFor(x=>x.Id)
                         </tr>
                        <tr>
                            @Html.DisplayFor(x=>x.ProductName)
                        </tr>

            </table>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
    </div>

我尝试断点查看问题，但是一切正常，但是在模态中它显示相同的值

有人可以帮我解决这个问题吗   预先感谢

模态问题局部视图显示相同的数据，但选择了不同的项目

0 个答案: