使用Ajax.Actionlink显示模态

时间:2014-11-01 14:29:19

标签: twitter-bootstrap model-view-controller asp.net-ajax

我尝试用部分视图替换引导模式 div 但是当我点击元素,没有任何反应。

我已经检查过它是否通过 MovieController 而且确实如此。 div modalDiv 刚刚更新。

我已将jquery.unobstrusive添加到我的jquery包中。

到目前为止,我的代码看起来像这样:

Index.cshtml

@Ajax.ActionLink(e.Title, "ShowDetails", "Movie", new { id = e.Id }, new AjaxOptions { UpdateTargetId = "modalDiv" })
<div id="modalDiv"></div>


MovieController.cs

[HttpGet]
    public ActionResult ShowDetails(int id)
    {
        var model = new MovieModel();
        model.SelectedMovie = facade.MovieRep.GetById(id);
        return PartialView("_Details", model);
    }


_ViewDetails.cshtml

<div id="modalDiv">
<div class="modal fade" tabindex="-1" role="dialog" aria-hidden="false">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">×</button>
                <h3 class="modal-title">@Model.SelectedMovie.Title</h3>
            </div>
            <div class="modal-body">
                <table>
                    <tr>
                        <td align="right">
                            Price:
                        </td>
                        <td>
                            $@Model.SelectedMovie.Price
                        </td>
                    </tr>
                    <tr>
                        <td align="right">
                            Cover:
                        </td>
                        <td>
                            @Model.SelectedMovie.ImageURL
                        </td>
                    </tr>
                    <tr>
                        <td align="right">
                            Trailer:
                        </td>
                        <td>
                            <a href="@Model.SelectedMovie.TrailerURL" target="_blank">Link</a>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Genre:
                        </td>
                        <td>
                            @foreach (var g in Facade.Instance.MovieGenreRep.GetGenreByMovie(Model.SelectedMovie))
                            {
                                <p>
                                    @g.Name
                                </p>
                            }
                        </td>
                    </tr>
                </table>
            </div>
            <div class="modal-footer">
                <button class="btn btn-default" data-dismiss="modal">Close</button>
                @Ajax.BeginForm("AddToCart", "Cart", null, new AjaxOptions { UpdateTargetId = "cart" })
                {
                <input type="hidden" name="Id" value="@Model.SelectedMovie.Id" />
                <button class="btn btn-success" data-dismiss="modal"><span class="icon-cart"> Add</span></button>
                }
            </div>
        </div>
    </div>
</div>
</div>

0 个答案:

没有答案