1

编辑:我明白为什么它没有运行两次。我在被清除的 div 中有“Ajax.BeginForm()”调用。我将其移至局部视图。现在它在 Internet Explorer 中运行良好,但在 Firefox 或 Chrome 中却不行。Part 保存到 db,但返回的 View 不是 Partial View。

我正在为“车辆”创建“编辑”页面。我有一个可以添加到车辆的零件列表。零件以局部视图显示。部分视图基本上是一个带有一些 javascript 的 DropDownList。

我想要的是当用户单击“将零件添加到车辆”按钮时更新局部视图。发生的事情是更新导致整个页面被部分视图填充。

这是我的最新文件:

控制器:

[HttpGet]
    public ActionResult _AddPartToVehicle(IList<ShopLog.ViewModels.VehicleEditAddPartToVehicleViewModel> vehicleEditAddPartToVehicleViewModel)
    {
        return View(vehicleEditAddPartToVehicleViewModel);
    }


    [HttpPost]
    public ActionResult _AddPartToVehicle(Guid partID, Guid vehicleID)
    {
        Vehicle vehicle = db.Vehicles.Find(vehicleID);
        Part part = db.Parts.Find(partID);

        //protect against concurrency (what if someone has deleted this part or this vehicle since the form was loaded?)
        try
        {
            if ((vehicle != null) && (part != null))
            {
                vehicle.Parts.Add(part);
                db.SaveChanges();
                ViewBag.VehicleID = vehicleID;

                return PartialView(GetPartsForThisVehicle(vehicle));
            }
        }
        catch (DataException)
        {
            //Log the error (add a variable name after Exception)
            ModelState.AddModelError(string.Empty, "Unable to add part to vehicle. Try again, and if the problem persists contact your system administrator.");
        }

局部视图:

@model IList<ShopLog.ViewModels.VehicleEditAddPartToVehicleViewModel>

@section scripts{

}

@using (Ajax.BeginForm("_AddPartToVehicle", new AjaxOptions() { UpdateTargetId = "divAddPartToVehicle", InsertionMode = System.Web.Mvc.Ajax.InsertionMode.Replace }))
{
<fieldset>

        <legend>Parts For This Vehicle</legend>
        @if (Model != null)
        {
            if (Model.ToList().Count > 0)
            {

                <div class="editor-field">

                    <table>
                        <tr>
                            <th>Part</th>
                            <th></th>
                        </tr>

                        @foreach (var part in Model)
                        {
                            if (part.OnVehicle)
                            {
                                <tr>
                                    <td>
                                        @part.Name
                                    </td>
                                    <td>
                                        @Html.ActionLink("Details", "Edit", "Part", new { id = part.PartID }, null) |
                                        @Html.ActionLink("Remove", "RemoveVehiclePart", new { partID = part.PartID, vehicleID = ViewBag.VehicleID })
                                    </td>
                                </tr>                                    
                            }
                        }
                    </table>              
                </div>  
            }
        }


        <table class="layouttable">
            <tr>
                <td>
                        <div title="" id="tooltip">
                        @{
        IList<ShopLog.ViewModels.VehicleEditAddPartToVehicleViewModel> partsNotOnVehicle = new List<ShopLog.ViewModels.VehicleEditAddPartToVehicleViewModel>();

        foreach (var part in Model)
        {
            if (!part.OnVehicle)
            {
                ShopLog.ViewModels.VehicleEditAddPartToVehicleViewModel partNotOnVehicle = new ShopLog.ViewModels.VehicleEditAddPartToVehicleViewModel();

                partNotOnVehicle.Cost = part.Cost;
                partNotOnVehicle.Name = part.Name;
                partNotOnVehicle.Notes = part.Notes;
                partNotOnVehicle.OnVehicle = part.OnVehicle;
                partNotOnVehicle.PartID = part.PartID;

                partsNotOnVehicle.Add(partNotOnVehicle);
            }
        }

                            @Html.DropDownList("partID", partsNotOnVehicle.Select(m => new SelectListItem() { Text = m.Name, Value = m.PartID.ToString() }), new { @class = "dropdown", onchange = "GetDivTitle(this.value)", onmouseover = "GetDivTitle(this.value)" })
                        }
                        </div> 
                </td>
            </tr>
            <tr>
                <td>
                    <div id="divAddPartToVehicle">
                        <input type="hidden" name="vehicleID" value="@ViewBag.VehicleID") />                            
                        <input type="submit" value="Add Part To Vehicle"/>
                    </div>
                </td>
            </tr>

        </table> 
    </fieldset>
}

<script type="text/javascript">
    function GetDivTitle(value) {
        document.getElementById("tooltip").title = GetDropDownNotes(value);
    }

    function GetDropDownNotes(value) {
        switch (value) {
            @foreach (ShopLog.ViewModels.VehicleEditAddPartToVehicleViewModel item in Model)
            {
                <text>
                    case '@item.PartID.ToString()':
                        return '@item.Notes.Replace("\'", "").Replace("\"", "").Replace("\n", "").Replace("\r", "")';
                        break;
                </text>                   
            }
        }
    }     
</script>

看法:

@section scripts {
@Content.Script("jquery.validate.min.js", Url)
@Content.Script("jquery.validate.unobtrusive.min.js", Url)
@Content.Script("jquery.unobtrusive-ajax.min.js", Url)
}
...
    <div id="divAddPartToVehicle">

            @Html.Partial("_AddPartToVehicle", (IList<ShopLog.ViewModels.VehicleEditAddPartToVehicleViewModel>)ViewBag.Parts)

    </div>
...
4

1 回答 1

0

耶!我赢了!我有各种各样的表格问题。我将@Html.BeginForm 放在@Html.BeginForm 中,Ajax.BeginForm 也是如此。

一旦我解决了这些问题,它就像一个魅力!

于 2012-04-04T02:57:41.890 回答