Mvc3 WebGrid ajaxUpdateContainerId дублирует контейнер - PullRequest
Новая
       5

Mvc3 WebGrid ajaxUpdateContainerId дублирует контейнер

0 голосов
/ 07 ноября 2011

Я не знаю, является ли это ошибкой только на моем сайте, но WebGrid, очевидно, дублирует контейнер, указанный в ajaxUpdateContainerId. Вот мой код: 

<div id="grid-wrapper" class="grid-wrapper">
@{
    var a = new []
    {
        new { Mensagens = 3, Nome = "Rodrigo Manguinho", Agendamento = "08:00", Prazo = 2, Tipo = "Novo", Percentual = "30%"},
        new { Mensagens = 5, Nome = "Rodrigo Manguinho", Agendamento = "08:00", Prazo = 2, Tipo = "Novo", Percentual = "30%"}
    };

    var grid = new WebGrid(source: a, ajaxUpdateContainerId: "grid-wrapper");

    @grid.GetHtml(tableStyle: "grid round-3", alternatingRowStyle: "even", rowStyle: "odd", htmlAttributes: new { @cellpadding = "0px", @cellspacing = "0px" });
}
</div>

Когда я проверяю firebug, у div-сетки есть еще один div с тем же идентификатором и классом. Дублируется при нажатии любой ссылки TH для сортировки таблицы.

Ответы [ 2 ]

3 голосов
/ 28 марта 2012

У нас была та же проблема, что и у вас.Мы проанализировали исходный код для контроллера WebGrid и, по-видимому, ошибка существует и не может быть изменена, поскольку она жестко закодирована:

Взята из "mvc3-rtm-sources \ webpages \ src \ System.Web.Helpers \WebGrid \ WebGrid.cs ", строки 17-22: 

namespace System.Web.Helpers {
    public class WebGrid {
        // jquery code for partial page update of grid components (see http://api.jquery.com/load/)
        private const string _ajaxLinkScript = "$(\'#{0}\').load(\'{1} #{0}\');";
        private const string _ajaxLinkScriptWithCallback = "$(\'#{0}\').load(\'{1} #{0}\', {2});";

Как видите, ссылки на ajax нельзя изменить из внешнего API.К счастью, мы нашли способ исправить это, а также заставить его работать как с включенным, так и с отключенным JavaScript: 

@{
    WebGrid grid = new WebGrid(Model, ajaxUpdateContainerId: "myDivId", ajaxUpdateCallback: "myFunctionName");
    WebGrid gridNoJS = new WebGrid(Model);
}

<script type="text/javascript">
    $(myFunctionName);

    function myFunctionName() {
        $('#myDivId table tfoot a').each(function () {
            var $this = $(this);
            $this.attr('onclick', $this.attr('onclick').replace('#myDivId\',', '#myDivId table\','));
        });

        $('#myDivId table tfoot div').show();
    }
</script>

<div id="myDivId">
    @grid.Table(
        columns: grid.Columns(
            grid.Column("MyColumn1", header: "MyColumn1"),
            grid.Column("MyColumn2", header: "MyColumn2")),
        footer: @<text><noscript>@gridNoJS.Pager()</noscript><div style="display:none">@grid.Pager()</div></text>
    )
</div>

Вы также можете экстраполировать эту идею, чтобы исправить также ссылки сортировки.

1 голос
/ 08 декабря 2011

Я не знаю, поможет ли это вам вообще, но у меня была такая же проблема. У меня была такая же проблема, и я смог ее исправить. В моем случае я установил для ajaxContainerUpdateId тот же идентификатор, что и для идентификатора html-сетки. Вместо этого мне пришлось поместить контейнер div вокруг веб-сетки и установить ajaxUpdateContainerId в качестве идентификатора div, и присвоить WebGrid другой идентификатор в методе GetHtml. Первая часть моего объявления сетки показана ниже, где searchContainer - это div, содержащий метод grid.GetHtml. 

var grid = new System.Web.Helpers.WebGrid(canPage: true, rowsPerPage: ViewData["pagesize"] != null ? (int)ViewData["pagesize"] : 20, canSort: true,ajaxUpdateContainerId:"searchContainer");
grid.Bind(Model.Records, rowCount: Model.TotalResults, autoSortAndPage: false);
grid.Pager(WebGridPagerModes.All);
grid.SortColumn = ViewData["sortColumn"].ToString();
grid.SortDirection = ViewData["sortDir"].ToString().ToLower() == "asc" ? SortDirection.Ascending : SortDirection.Descending;
@grid.GetHtml(htmlAttributes: new { id = "searchgrid", @class = "grid" }, alternatingRowStyle: "alt" ,
...