Razor (используя частичные представления) конкретное обновление - PullRequest
0 голосов
/ 14 февраля 2012

У меня есть страница Razor, которая содержит таблицу и частичное представление с источником в виде списка //(Model.LeaveTypeList)

                            @using (Html.BeginForm())
                            {           
                                <table>

                                    @*Grid Added as Partial View for leave Types*@
                                    <tr>
                                        <td colspan="2">
                                            <div>
                                                @Html.Partial("LeaveTypesPartial", Model.LeaveTypeList)
                                            </div>

                                        </td>
                                    </tr>

                                </table>

                            }

Это частичное представление (LeaveTypesPartial.cshtml)

                            @model List<AscoraWeb.Models.LeaveTypeModel>
                            @{

                                Layout = null;
                            }
                            @{        

                                //canSort:false,

                                var grid = new WebGrid(source: Model,
                                             defaultSort: "Name",
                                             rowsPerPage: 7);
                            }
                                <table>
                                 <tr>
                                        <td colspan="2" style="text-align: left; font-family: Arial Baltic; font-style: italic;font-size: 15px">
                                            These leaves can be assigned to Employees in the Service Calender for scheduling
                                        </td>

                                        <td colspan="2" style="text-align: left; font-family: Arial Baltic; font-style: italic;font-size: 15px">
                                        </td>
                                    </tr>

                                    @*Row with buttons*@
                                    <tr>
                                        <td align="right" colspan="1">
                                            <input type="button"/>
                                            <input type="button"/>
                                        </td>

                                    </tr>

                                    <tr>
                                        <td>
                                        <div id="grid">
                                            @grid.GetHtml(
                                                tableStyle: "grid",
                                                headerStyle: "head",
                                                alternatingRowStyle: "alt",
                                                columns: grid.Columns(
                                                    grid.Column("name")
                                                    )
                                       )
                                        </div>

                                        </td>
                                    </tr>
                                </table>

В контроллере приложения мы присваиваем некоторое значение частичному представлению

                                public ActionResult RatesAndCharges()
                                {
                                    //Message that will appear before the content of the view is shown
                                    ViewBag.Message = "This is the Rates and Charges section!";



                                    //Adding content for the leave types grid
                                    var ratesChargesModel = new RatesChargesModel { };

                                    ratesChargesModel.LeaveTypeList = new List<LeaveTypeModel>();

                                    var leaveTypeModel = new LeaveTypeModel { Name = "Paid Leave" };

                                    ratesChargesModel.LeaveTypeList.Add(leaveTypeModel);

                                    leaveTypeModel = new LeaveTypeModel { Name = "Unpaid Leave" };

                                    ratesChargesModel.LeaveTypeList.Add(leaveTypeModel);

                                    return View(ratesChargesModel);
                                }

Это отлично работает, и я могу видеть свою сетку с элементами

Элементы сетки могут быть отсортированы по имени (так как у нас есть значение по умолчанию: Имя) но когда мы нажимаем на имя, вся страница обновляется (вызывается публичный ActionResult RatesAndCharges ()) Поэтому мне нужен способ сортировки элементов в сетке без обновления моей страницы.

1 Ответ

0 голосов
/ 16 февраля 2012

Вы должны были бы сделать запрос AJAX на сервер, используя JQuery или что-то еще ... Я не знаю, поддерживает ли WebGrid это или нет. Но вы всегда можете сделать это самостоятельно, используя JQuery для вызова метода действия, который возвращает частичное представление, и вы меняете старый HTML на новый.

...