【问题标题】:How can I refresh partial view and the main view at the same time?如何同时刷新局部视图和主视图?
【发布时间】:2015-01-26 01:26:40
【问题描述】:

1)这里是我的主视图的控制器方法:

public ActionResult PredefPageLoad()
    {
        List<PredefineViewsView> predefViewsViews = null;
        try
        {
            using (PanSenseEntities context = new PanSenseEntities())
            {
                int userID = Convert.ToInt32(Session["LoggedUserID"]);
                predefViewsViews = (from x in context.PredefineViewsViews where x.UserID == userID select x).ToList();
            }
        }
        catch (Exception e)
        {
            Console.WriteLine(e);
        }
        return View(predefViewsViews);
    }

2) 所以我的主要视图是显示一个网络网格,其中每行包含一个 ID、一个名称和 其子名称的数量,以及用于添加、编辑的图像图标 还有一个图标,用于打开显示名称及其所有子名称的局部视图

 @{
        var grid = new WebGrid(Model);
  }
    <div id="gridContent">

    <button type="button" id="createNewPredefinedView" style="margin-bottom: 20px;">@Html.Localize("createNew")</button>

        @grid.GetHtml(
    tableStyle: "webgrid-table",
    headerStyle: "webgrid-header",
    footerStyle: "webgrid-footer",
    alternatingRowStyle: "webgrid-alternating-row",
    selectedRowStyle: "webgrid-selected-row",
    rowStyle: "webgrid-row-style",
    mode: WebGridPagerModes.All,
    columns:

        grid.Columns(
            grid.Column("PredefID", format: @<text>  <span class="display-mode" id="PredefViewID">@item.PredefineViewID </span> <label id="PredefID" class="edit-mode">@item.PredefineViewID</label> </text>, style: "col1Width"),


            grid.Column("", format: @<text>
            <img class="edit-table display-mode click_images" src="~/Images/edit.png" />
            <img class="delete-table display-mode click_images" src="~/Images/delete.png" />
            <img class="open-sensors display-mode click_images" src="~/Images/Sensor.png" />
            <img class="save-table edit-mode click_images" src="~/Images/save.png" />
            <img class="cancel-table edit-mode click_images" src="~/Images/cancel.png" />
            </text>, style: "col2Width", canSort: false),

            grid.Column("PredefName", @Html.Localize("name").ToString(), format: @<text>  <span class="display-mode">  <label id="lblPredefName">@item.Name</label> </span> <input type="text" id="PredefName" value="@item.Name" class="edit-mode" /> </text>, style: "col1Width", canSort: false),

            grid.Column("AmountOfSensors", @Html.Localize("amountOfSensors").ToString(), format: @<text>  <span class="display-mode" id="lblAmountOfSensors">  @item.SensorNo </span> <label id="AmountOfSensors" class="edit-mode"> @item.SensorNo </label> </text>, style: "col2Width", canSort: false)
         ))
    </div>



    <div id="sensorNames">

    </div>

3) 我给了这个图像图标“class:open-sensors”,当我点击打开嵌套在 div“sensorNames”内的提到的局部视图时,这里是该操作的 java 脚本:

$('.open-sensors').on('click', function () {
        var tr = $(this).parents('tr:first');
        var PredefID = tr.find("#PredefID").html();
        var divSensorNames = $("#sensorNames");
        var urlShowSensors = "@Url.Action("ShowSensorNames", "PredefinedViews", new { predefinedViewID = "PredefID" })";
        urlShowSensors = urlShowSensors.replace("PredefID", PredefID);
        $(divSensorNames).load(urlShowSensors);
        });

4) 然后控制器方法过滤选择的 ID:

public ActionResult ShowSensorNames(string predefinedViewID)
    {
        List<PredefineViewItemsView> predefViewItemsViews = null;
        try
        {
            using (PanSenseEntities context = new PanSenseEntities())
            {
                int predefViewID = Convert.ToInt32(predefinedViewID);
                predefViewItemsViews = (from x in context.PredefineViewItemsViews where x.PredefineViewID == predefViewID select x).ToList();
            }
        }
        return PartialView("DisplaySensors", predefViewItemsViews);
    }

5) 它会在“sensorNames”div 中打开部分视图:

 @{
    var gridSensors = new WebGrid(Model, canPage:false);
}
@gridSensors.GetHtml(
    tableStyle: "webgrid-table",
    headerStyle: "webgrid-header",
    footerStyle: "webgrid-footer",
    alternatingRowStyle: "webgrid-alternating-row",
    selectedRowStyle: "webgrid-selected-row",
    rowStyle: "webgrid-row-style",
    mode: WebGridPagerModes.All,
    columns:


    gridSensors.Columns(
            gridSensors.Column("PredefineViewID", format: @<text>  <span id="PredefineViewID">@item.PredefineViewID </span>  </text>, style: "col1Width"),

            gridSensors.Column("PredefineViewsItemID", format: @<text>  <span id="PredefineViewsItemID">@item.PredefineViewsItemID </span>  </text>, style: "col1Width"),

            gridSensors.Column("", format: @<text><img class="sensor-delete-table click_images" alt="@Html.Localize("delete")" title="@Html.Localize("delete")" src="~/Images/delete.png" /></text>, style: "col1Width", canSort: false),

            gridSensors.Column("PredefName", @Html.Localize("name").ToString(), format: @<text>  <span><label id="lblPredefineViewName">@item.PredefineViewName</label> </span>  </text>, style: "col1Width", canSort: false),

            gridSensors.Column("PredefName", @Html.Localize("sensorName").ToString(), format: @<text>  <span><label id="lblSensorName">@item.SensorName</label> </span>  </text>, style: "col3Width", canSort: false)

    ))

这是问题部分-如何使用第三列“class=sensor-delete-table”中的图像图标删除我的子名称(当然是在部分视图中)并刷新此网络网格(取出删除的行)以及主视图web-grid(子名称数量减1)?

6) 我设法做的事情 删除了我的数据库中的记录,只刷新了部分视图,而不是主视图

$(function () {
        $(".sensor-delete-table").on("click", function () {
            var divSensorNames = $("#sensorNames");
            var tr = $(this).parents('tr:first');
            var PredefineViewsItemID = tr.find("#PredefineViewsItemID").html();
            var PredefineViewID = tr.find("#PredefineViewID").html();
            var flag = confirm('@Html.Localize("deleteCheck")');
            var urlShowNewSensors = "@Url.Action("ShowSensorNames", "PredefinedViews", new { predefinedViewID = "PredefineViewID" })";
            urlShowNewSensors = urlShowNewSensors.replace("PredefineViewID", PredefineViewID);
            if (PredefineViewID != "" && flag) {

                $.ajax({
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    url: '@Url.Action("DeleteSensor", "PredefinedViews")',
                    data: JSON.stringify({ pviID: PredefineViewsItemID, pID: PredefineViewID}),
                    dataType: "json",
                    complete: function (result) {
                    $("#sensorNames").html(result.responseText);
                    },
                });
            }
        });
    });

7) 这是删除方法:

[HttpPost]
    public ActionResult DeleteSensor(int pviID, int pID)
    {
        using (PanSenseEntities context = new PanSenseEntities())
        {
            tblPredefineViewItem existing = context.tblPredefineViewItems.Find(pviID);
            if (existing != null)
            {
                context.tblPredefineViewItems.Remove(existing);
                context.SaveChanges();
            }
        }
        return RedirectToAction("ShowSensorNames", "PredefinedViews", new { predefinedViewID = pID });
    }

这成功地删除了子名称并将其带到我在步骤 4)中提到的方法,从那里它进入步骤 6)中的“完成:”。 你可能会问我为什么不使用“成功:”而不是完成?因为它没有注册它做了任何事情,“完成:”或“完成:”也没有。 我也尝试做一个“window.location.reload()”并尝试将它放在“$("#sensorNames").html(result.responseText);”之前线和我能想到的所有其他地方,但它总是以我想要的错误顺序结束。首先,我希望它刷新页面,然后用少一个子名称打开新的 webgrid,但它恰恰相反——它删除了已删除的 webgrid 并刷新了页面,所以我留下了一个没有打开的刷新的主视图部分视图 - 除非我手动打开它,但这不是我想要的。

抱歉,这篇文章太长了,这是我第一次在这里提问。

8) 编辑以显示生成的 html,第一个表格是:

<div id="gridContent" class="table-responsive col-md-6" style="padding-top: 20px; ">

<button type="button" id="createNewPredefinedView" style="margin-bottom: 20px;">Create new</button>

<table class="webgrid-table">
    <thead>
        <tr class="webgrid-header">
            <th scope="col" style="display: none;">
                <a href="/PredefinedViews/PredefPageLoad?sort=PredefID&amp;sortdir=ASC">PredefID</a>
            </th>
            <th scope="col">
            </th>
            <th scope="col">
                Name
            </th>
            <th scope="col">
                Amount of Sensors
            </th>
        </tr>
    </thead>
    <tbody>
        <tr class="webgrid-row-style">
            <td class="col1Width" style="display: none;">  <span class="display-mode" id="PredefViewID">18 </span> <label id="PredefID" class="edit-mode" style="display: none;">18</label> </td>
            <td class="col2Width">


                <img class="edit-table display-mode click_images" alt="Edit" title="Edit" src="/Images/edit.png">
                <img class="delete-table display-mode click_images" alt="Delete" title="Delete" src="/Images/delete.png">

                <img class="open-sensors display-mode click_images" alt="View of Existing Sensors" title="View of Existing Sensors" src="/Images/Sensor.png">



                <img class="save-table edit-mode click_images" alt="Save" title="Save" src="/Images/save.png" style="display: none;">
                <img class="cancel-table edit-mode click_images" alt="Cancel" title="Cancel" src="/Images/cancel.png" style="display: none;">

            </td>
            <td class="col1Width">  <span class="display-mode">  <label id="lblPredefName">pokusaj4555</label> </span> <input type="text" id="PredefName" value="pokusaj4555" class="edit-mode" style="display: none;"> </td>
            <td class="col2Width">  <span class="display-mode" id="lblAmountOfSensors">  10 </span> <label id="AmountOfSensors" class="edit-mode" style="display: none;"> 10 </label> </td>
        </tr>
        <tr class="webgrid-alternating-row">
            <td class="col1Width" style="display: none;">  <span class="display-mode" id="PredefViewID">19 </span> <label id="PredefID" class="edit-mode" style="display: none;">19</label> </td>
            <td class="col2Width">


                <img class="edit-table display-mode click_images" alt="Edit" title="Edit" src="/Images/edit.png">
                <img class="delete-table display-mode click_images" alt="Delete" title="Delete" src="/Images/delete.png">

                <img class="open-sensors display-mode click_images" alt="View of Existing Sensors" title="View of Existing Sensors" src="/Images/Sensor.png">



                <img class="save-table edit-mode click_images" alt="Save" title="Save" src="/Images/save.png" style="display: none;">
                <img class="cancel-table edit-mode click_images" alt="Cancel" title="Cancel" src="/Images/cancel.png" style="display: none;">

            </td>
            <td class="col1Width">  <span class="display-mode">  <label id="lblPredefName">pokusaj1333</label> </span> <input type="text" id="PredefName" value="pokusaj1333" class="edit-mode" style="display: none;"> </td>
            <td class="col2Width">  <span class="display-mode" id="lblAmountOfSensors">  11 </span> <label id="AmountOfSensors" class="edit-mode" style="display: none;"> 11 </label> </td>
        </tr>
        <tr class="webgrid-row-style">
            <td class="col1Width" style="display: none;">  <span class="display-mode" id="PredefViewID">20 </span> <label id="PredefID" class="edit-mode" style="display: none;">20</label> </td>
            <td class="col2Width">


                <img class="edit-table display-mode click_images" alt="Edit" title="Edit" src="/Images/edit.png">
                <img class="delete-table display-mode click_images" alt="Delete" title="Delete" src="/Images/delete.png">

                <img class="open-sensors display-mode click_images" alt="View of Existing Sensors" title="View of Existing Sensors" src="/Images/Sensor.png">



                <img class="save-table edit-mode click_images" alt="Save" title="Save" src="/Images/save.png" style="display: none;">
                <img class="cancel-table edit-mode click_images" alt="Cancel" title="Cancel" src="/Images/cancel.png" style="display: none;">

            </td>
            <td class="col1Width">  <span class="display-mode">  <label id="lblPredefName">pokusaj3</label> </span> <input type="text" id="PredefName" value="pokusaj3" class="edit-mode" style="display: none;"> </td>
            <td class="col2Width">  <span class="display-mode" id="lblAmountOfSensors">  10 </span> <label id="AmountOfSensors" class="edit-mode" style="display: none;"> 10 </label> </td>
        </tr>
        <tr class="webgrid-alternating-row">
            <td class="col1Width" style="display: none;">  <span class="display-mode" id="PredefViewID">21 </span> <label id="PredefID" class="edit-mode" style="display: none;">21</label> </td>
            <td class="col2Width">


                <img class="edit-table display-mode click_images" alt="Edit" title="Edit" src="/Images/edit.png">
                <img class="delete-table display-mode click_images" alt="Delete" title="Delete" src="/Images/delete.png">

                <img class="open-sensors display-mode click_images" alt="View of Existing Sensors" title="View of Existing Sensors" src="/Images/Sensor.png">



                <img class="save-table edit-mode click_images" alt="Save" title="Save" src="/Images/save.png" style="display: none;">
                <img class="cancel-table edit-mode click_images" alt="Cancel" title="Cancel" src="/Images/cancel.png" style="display: none;">

            </td>
            <td class="col1Width">  <span class="display-mode">  <label id="lblPredefName">asdasd</label> </span> <input type="text" id="PredefName" value="asdasd" class="edit-mode" style="display: none;"> </td>
            <td class="col2Width">  <span class="display-mode" id="lblAmountOfSensors">  3 </span> <label id="AmountOfSensors" class="edit-mode" style="display: none;"> 3 </label> </td>
        </tr>
        <tr class="webgrid-row-style">
            <td class="col1Width" style="display: none;">  <span class="display-mode" id="PredefViewID">22 </span> <label id="PredefID" class="edit-mode" style="display: none;">22</label> </td>
            <td class="col2Width">


                <img class="edit-table display-mode click_images" alt="Edit" title="Edit" src="/Images/edit.png">
                <img class="delete-table display-mode click_images" alt="Delete" title="Delete" src="/Images/delete.png">

                <img class="open-sensors display-mode click_images" alt="View of Existing Sensors" title="View of Existing Sensors" src="/Images/Sensor.png">



                <img class="save-table edit-mode click_images" alt="Save" title="Save" src="/Images/save.png" style="display: none;">
                <img class="cancel-table edit-mode click_images" alt="Cancel" title="Cancel" src="/Images/cancel.png" style="display: none;">

            </td>
            <td class="col1Width">  <span class="display-mode">  <label id="lblPredefName">qwer</label> </span> <input type="text" id="PredefName" value="qwer" class="edit-mode" style="display: none;"> </td>
            <td class="col2Width">  <span class="display-mode" id="lblAmountOfSensors">  3 </span> <label id="AmountOfSensors" class="edit-mode" style="display: none;"> 3 </label> </td>
        </tr>
        <tr class="webgrid-alternating-row">
            <td class="col1Width" style="display: none;">  <span class="display-mode" id="PredefViewID">23 </span> <label id="PredefID" class="edit-mode" style="display: none;">23</label> </td>
            <td class="col2Width">


                <img class="edit-table display-mode click_images" alt="Edit" title="Edit" src="/Images/edit.png">
                <img class="delete-table display-mode click_images" alt="Delete" title="Delete" src="/Images/delete.png">

                <img class="open-sensors display-mode click_images" alt="View of Existing Sensors" title="View of Existing Sensors" src="/Images/Sensor.png">



                <img class="save-table edit-mode click_images" alt="Save" title="Save" src="/Images/save.png" style="display: none;">
                <img class="cancel-table edit-mode click_images" alt="Cancel" title="Cancel" src="/Images/cancel.png" style="display: none;">

            </td>
            <td class="col1Width">  <span class="display-mode">  <label id="lblPredefName">asd123</label> </span> <input type="text" id="PredefName" value="asd123" class="edit-mode" style="display: none;"> </td>
            <td class="col2Width">  <span class="display-mode" id="lblAmountOfSensors">  4 </span> <label id="AmountOfSensors" class="edit-mode" style="display: none;"> 4 </label> </td>
        </tr>
        <tr class="webgrid-row-style">
            <td class="col1Width" style="display: none;">  <span class="display-mode" id="PredefViewID">1052 </span> <label id="PredefID" class="edit-mode" style="display: none;">1052</label> </td>
            <td class="col2Width">


                <img class="edit-table display-mode click_images" alt="Edit" title="Edit" src="/Images/edit.png">
                <img class="delete-table display-mode click_images" alt="Delete" title="Delete" src="/Images/delete.png">

                <img class="open-sensors display-mode click_images" alt="View of Existing Sensors" title="View of Existing Sensors" src="/Images/Sensor.png">



                <img class="save-table edit-mode click_images" alt="Save" title="Save" src="/Images/save.png" style="display: none;">
                <img class="cancel-table edit-mode click_images" alt="Cancel" title="Cancel" src="/Images/cancel.png" style="display: none;">

            </td>
            <td class="col1Width">  <span class="display-mode">  <label id="lblPredefName">qwerty</label> </span> <input type="text" id="PredefName" value="qwerty" class="edit-mode" style="display: none;"> </td>
            <td class="col2Width">  <span class="display-mode" id="lblAmountOfSensors">  0 </span> <label id="AmountOfSensors" class="edit-mode" style="display: none;"> 0 </label> </td>
        </tr>
        <tr class="webgrid-alternating-row">
            <td class="col1Width" style="display: none;">  <span class="display-mode" id="PredefViewID">2052 </span> <label id="PredefID" class="edit-mode" style="display: none;">2052</label> </td>
            <td class="col2Width">


                <img class="edit-table display-mode click_images" alt="Edit" title="Edit" src="/Images/edit.png">
                <img class="delete-table display-mode click_images" alt="Delete" title="Delete" src="/Images/delete.png">

                <img class="open-sensors display-mode click_images" alt="View of Existing Sensors" title="View of Existing Sensors" src="/Images/Sensor.png">



                <img class="save-table edit-mode click_images" alt="Save" title="Save" src="/Images/save.png" style="display: none;">
                <img class="cancel-table edit-mode click_images" alt="Cancel" title="Cancel" src="/Images/cancel.png" style="display: none;">

            </td>
            <td class="col1Width">  <span class="display-mode">  <label id="lblPredefName">qwerty</label> </span> <input type="text" id="PredefName" value="qwerty" class="edit-mode" style="display: none;"> </td>
            <td class="col2Width">  <span class="display-mode" id="lblAmountOfSensors">  0 </span> <label id="AmountOfSensors" class="edit-mode" style="display: none;"> 0 </label> </td>
        </tr>
    </tbody>
</table>

这是第二张表:

<table class="webgrid-table">
    <thead>
        <tr class="webgrid-header">
            <th scope="col">
                <a href="/PredefinedViews/ShowSensorNames?predefinedViewID=20&amp;sort=PredefineViewID&amp;sortdir=ASC">PredefineViewID</a>
            </th>
            <th scope="col">
                <a href="/PredefinedViews/ShowSensorNames?predefinedViewID=20&amp;sort=PredefineViewsItemID&amp;sortdir=ASC">PredefineViewsItemID</a>
            </th>
            <th scope="col">
            </th>
            <th scope="col">
                Name
            </th>
            <th scope="col">
                Sensor Name
            </th>
        </tr>
    </thead>
    <tbody>
        <tr class="webgrid-row-style">
            <td class="col1Width">  <span id="PredefineViewID">20 </span>  </td>
            <td class="col1Width">  <span id="PredefineViewsItemID">42 </span>  </td>
            <td class="col1Width"><img class="sensor-delete-table click_images" alt="Delete" title="Delete" src="/Images/delete.png"></td>
            <td class="col1Width">  <span><label id="lblPredefineViewName">pokusaj3</label> </span>  </td>
            <td class="col3Width">  <span><label id="lblSensorName">Solar radiation </label> </span>  </td>
        </tr>
        <tr class="webgrid-alternating-row">
            <td class="col1Width">  <span id="PredefineViewID">20 </span>  </td>
            <td class="col1Width">  <span id="PredefineViewsItemID">1123 </span>  </td>
            <td class="col1Width"><img class="sensor-delete-table click_images" alt="Delete" title="Delete" src="/Images/delete.png"></td>
            <td class="col1Width">  <span><label id="lblPredefineViewName">pokusaj3</label> </span>  </td>
            <td class="col3Width">  <span><label id="lblSensorName">Soil Temperature </label> </span>  </td>
        </tr>
        <tr class="webgrid-row-style">
            <td class="col1Width">  <span id="PredefineViewID">20 </span>  </td>
            <td class="col1Width">  <span id="PredefineViewsItemID">1124 </span>  </td>
            <td class="col1Width"><img class="sensor-delete-table click_images" alt="Delete" title="Delete" src="/Images/delete.png"></td>
            <td class="col1Width">  <span><label id="lblPredefineViewName">pokusaj3</label> </span>  </td>
            <td class="col3Width">  <span><label id="lblSensorName">Soil Moisture na 15cm</label> </span>  </td>
        </tr>
        <tr class="webgrid-alternating-row">
            <td class="col1Width">  <span id="PredefineViewID">20 </span>  </td>
            <td class="col1Width">  <span id="PredefineViewsItemID">1125 </span>  </td>
            <td class="col1Width"><img class="sensor-delete-table click_images" alt="Delete" title="Delete" src="/Images/delete.png"></td>
            <td class="col1Width">  <span><label id="lblPredefineViewName">pokusaj3</label> </span>  </td>
            <td class="col3Width">  <span><label id="lblSensorName">Soil Moisture na 30cm</label> </span>  </td>
        </tr>
        <tr class="webgrid-row-style">
            <td class="col1Width">  <span id="PredefineViewID">20 </span>  </td>
            <td class="col1Width">  <span id="PredefineViewsItemID">1126 </span>  </td>
            <td class="col1Width"><img class="sensor-delete-table click_images" alt="Delete" title="Delete" src="/Images/delete.png"></td>
            <td class="col1Width">  <span><label id="lblPredefineViewName">pokusaj3</label> </span>  </td>
            <td class="col3Width">  <span><label id="lblSensorName">Leaf wetness prvi</label> </span>  </td>
        </tr>
        <tr class="webgrid-alternating-row">
            <td class="col1Width">  <span id="PredefineViewID">20 </span>  </td>
            <td class="col1Width">  <span id="PredefineViewsItemID">1127 </span>  </td>
            <td class="col1Width"><img class="sensor-delete-table click_images" alt="Delete" title="Delete" src="/Images/delete.png"></td>
            <td class="col1Width">  <span><label id="lblPredefineViewName">pokusaj3</label> </span>  </td>
            <td class="col3Width">  <span><label id="lblSensorName">Ait temperature </label> </span>  </td>
        </tr>
        <tr class="webgrid-row-style">
            <td class="col1Width">  <span id="PredefineViewID">20 </span>  </td>
            <td class="col1Width">  <span id="PredefineViewsItemID">1128 </span>  </td>
            <td class="col1Width"><img class="sensor-delete-table click_images" alt="Delete" title="Delete" src="/Images/delete.png"></td>
            <td class="col1Width">  <span><label id="lblPredefineViewName">pokusaj3</label> </span>  </td>
            <td class="col3Width">  <span><label id="lblSensorName">Air humidity </label> </span>  </td>
        </tr>
        <tr class="webgrid-alternating-row">
            <td class="col1Width">  <span id="PredefineViewID">20 </span>  </td>
            <td class="col1Width">  <span id="PredefineViewsItemID">1129 </span>  </td>
            <td class="col1Width"><img class="sensor-delete-table click_images" alt="Delete" title="Delete" src="/Images/delete.png"></td>
            <td class="col1Width">  <span><label id="lblPredefineViewName">pokusaj3</label> </span>  </td>
            <td class="col3Width">  <span><label id="lblSensorName">Wind speed </label> </span>  </td>
        </tr>
        <tr class="webgrid-row-style">
            <td class="col1Width">  <span id="PredefineViewID">20 </span>  </td>
            <td class="col1Width">  <span id="PredefineViewsItemID">1130 </span>  </td>
            <td class="col1Width"><img class="sensor-delete-table click_images" alt="Delete" title="Delete" src="/Images/delete.png"></td>
            <td class="col1Width">  <span><label id="lblPredefineViewName">pokusaj3</label> </span>  </td>
            <td class="col3Width">  <span><label id="lblSensorName">Wind direction </label> </span>  </td>
        </tr>
        <tr class="webgrid-alternating-row">
            <td class="col1Width">  <span id="PredefineViewID">20 </span>  </td>
            <td class="col1Width">  <span id="PredefineViewsItemID">1131 </span>  </td>
            <td class="col1Width"><img class="sensor-delete-table click_images" alt="Delete" title="Delete" src="/Images/delete.png"></td>
            <td class="col1Width">  <span><label id="lblPredefineViewName">pokusaj3</label> </span>  </td>
            <td class="col3Width">  <span><label id="lblSensorName">Precipitation </label> </span>  </td>
        </tr>
    </tbody>
</table>

【问题讨论】:

    标签: c# jquery visual-studio-2013 asp.net-mvc-5


    【解决方案1】:

    您为什么不简单地在 jquery 中手动从 webgrid 中删除该行?您已经在 tr 变量中拥有该行。

    var tr = $(this).parents('tr:first');
    
    complete: function (result) {
        tr.remove(); //this will remove the row from the table.    
    },
    

    更新:

    当您习惯于使用 jquery 操作 DOM 时。您最后进行了返回 json 的 ajax 调用,并使用 json 返回动态更新 html。你可以使用很多 JavaScript 框架,但你可以用 jquery 来实现一切。

    也就是说,如果您不想学习如何操作 DOM 来处理您当前的情况,我会这样做。我希望您使用 ViewModel 来显示视图。因此,在您的主页模型中,我们将其命名为 MainPageViewModel。添加属性调用 IDPartialViewDeleted。当您删除该行时。在 MainPageViewModel 中更新该属性。 RedirectToAction 重新加载整个页面(可能是索引)。检查 IDPartialViewDeleted 是否有值,如果有,请调用显示具有特定 ID 的局部视图的函数。这样就可以了。

    正如我所说,如果你想操作 DOM。你所要做的就是。 从局部视图中删除该行。

    tr.remove();
    

    并在主网格中找到包含子节点数量的控件并更新该值。像这样的。

    var count = tr.closest("MainTableIdorClass").find("MyControlWithNumberOfChildren").val();
    count--;
    tr.closest("MainTableIdorClass").find("MyControlWithNumberOfChildren").val(count);
    

    这样,您甚至不必从服务器返回任何内容,客户端上的一切都是新鲜的。我希望它很清楚。

    更新 另一个编辑。为了简单起见,让我们引入一个新的非常有用的概念:自定义属性。 在表一的生成上执行此操作。

    grid.Column("AmountOfSensors", @Html.Localize("amountOfSensors").ToString(), format: @<text>  <span class="display-mode" data-id="@item.PredefineViewID" id="lblAmountOfSensors">  @item.SensorNo </span> <label id="AmountOfSensors" class="edit-mode"> @item.SensorNo </label> </text>, style: "col2Width", canSort: false)
    

    将 id 添加到您的 span。 然后以这种方式在删除时更新它:

    $("[data-id='" + PredefineViewID " +']").text(parseInt($("[data-id='" + PredefineViewID " +']").text()) - 1);
    

    是不是很简单?

    更新 试试这个:

    $(".sensor-delete-table").on("click", function () {
                var divSensorNames = $("#sensorNames");
                var tr = $(this).parents('tr:first');
                var PredefineViewsItemID = tr.find("#PredefineViewsItemID").html();
                var PredefineViewID = tr.find("#PredefineViewID").html();
                var flag = confirm('@Html.Localize("deleteCheck")');
                var urlShowNewSensors = "@Url.Action("ShowSensorNames", "PredefinedViews", new { predefinedViewID = "PredefineViewID" })";
                urlShowNewSensors = urlShowNewSensors.replace("PredefineViewID", PredefineViewID);
                if (PredefineViewID != "" && flag) {
    
                    $.ajax({
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        url: '@Url.Action("DeleteSensor", "PredefinedViews")',
                        data: JSON.stringify({ pviID: PredefineViewsItemID, pID: PredefineViewID}),
                        dataType: "json",
                        complete: function (result) {
                        $("#sensorNames").html(result.responseText);
                        var amount = parseInt($("[data-id='" + PredefineViewID + "']").text());
                        amount--;
                      $("[data-id='" + PredefineViewID + "']").text(amount.toString());
                        },
                    });
                }
            });
    

    【讨论】:

    • 我在字符串中有一个空格,这就是我得到 NaN 结果的原因,现在它完美运行,非常感谢您的宝贵时间!
    猜你喜欢
    • 2014-08-20
    • 1970-01-01
    • 2015-01-11
    • 1970-01-01
    • 2017-05-04
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多