Выровняйте значения по правому краю, используя @ html .grid column.format - PullRequest
0 голосов
/ 10 января 2020

Как правильно выровнять значения при использовании columns.add () внутри коллекции @ html .grid (). Columns?

@Html.Grid(Model.Unidades).Columns(columns => {
columns.Add()
    .Encoded(false)
    .Sanitized(false)
    .Titled("Volume")
    .RenderValueAs(o => CustomRenderingOfColumnVolume(o));
columns.Add(m => m.VolumeCorrigido)
    .Titled("Volume")
    .Format("{0:N4}")
    .Sanitized(false)
    .Encoded(false);
});

@helper CustomRenderingOfColumnVolume(Dto.ObjectDto item) { 
        <span style="text-align: right; width: 100%">@string.Format("{0:N2}", item.Volume)</span>
}

Я уже пытался, но безуспешно: - Пользовательский .toString () из объекта столбца, но он не допускает пользовательский формат - Использование .Format ("{0,10}"). SetWidth (30), как мы делаем для выравнивания по правому краю с использованием пользовательского формата строки - Использование @helper (см. CustomRenderingOfColumnVolume выше для кода) - другие многие вещи, которые я не могу вспомнить сейчас

Я не нашел ни документации, ни учебника, ни указания Google c для этого компонента. Мне просто нужно кое-что для изучения или совет, чтобы выровнять значения столбца вправо. Я буду признателен за любую помощь, даже CSS для компонента столбца в @helper.

Ответы [ 2 ]

0 голосов
/ 10 января 2020

Мой друг отправил другое решение, похожее на @RahulSharma, но без использования @helper ни именованного класса css, просто метод из объекта столбца:

<style>
    /*Simple css hack to right align text*/
    td[data-name='Volume'] {
        text-align: right;
    }
</style>

[...]
columns.Add(m => m.Volume)
    .Titled("Volume")
    .Format("{0:N4}")
    .Sanitized(false)
    .Encoded(false);
});

I ' Я проверил оба и работал очень хорошо. Спасибо за все.

0 голосов
/ 10 января 2020

Вы можете применить класс к вашей колонке:

columns.Add().Encoded(false).Sanitized(false).Titled("Volume").RenderValueAs(o => CustomRenderingOfColumnVolume(o)).Css("align-right");

А затем в вашем CSS:

.align-right{text-align: right !important}

...