What's New?

[FIXED] [#1694] Grid number column alignment - mismatched Center and Right enumeration

  1. #1
    Feb 21, 2020, 7:58 AM

    [FIXED] [#1694] Grid number column alignment - mismatched Center and Right enumeration

    Hello support team,
    we just installed Ext.NET 5.1 in the hope that the old bug in aligning numeric columns in the grid will be resolved... unfortunately not. Because it looks like an ordinary typo, I won't send a test case, the code snippet should clarify this issue. If column alignment is specified in the model, Align = Ext.Net.Alignment.Right centers the column and vice versa, Align = Ext.Net.Alignment.Center aligns column to the right:

    [NumberColumn(Order = 3, Flex = 1, Align = Ext.Net.Alignment.Right)]
[Filter(FilterType.Number)]
public decimal Amount { get; set; }
    The definition above results in a centered column.

    Kind regards
    Dan
    Last edited by fabricio.murta; Feb 24, 2020 at 7:27 PM.
  2. #2
    Feb 21, 2020, 6:28 PM
    Hello Dan!

    This looks like a rarely used setup, to rely on attributes to describe columns. In my years in the company I believe this is the first report fromn someone using this feature. As far as I could find, we don't even have examples in Examples Explorer using such syntax.

    Notwithstanding, that attribute should be using another enum as you can see if you reference the Align column setting from code behind, WebForms or Razor syntax. The attribute probably has more issues that should be reviewed as column settings changed over time.

    Anyway, we've logged it as #1694 in our issues tracker and will post an update here as soon as we get it fixed.

    In this case, a sample would help us understand how you use the feature to ensure the fix will apply to you so, if you get a chance please provide a simplified test case showing how you reproduce the issue.
    Fabrício Murta
    Developer & Support Expert
    Ext.NETASP.NET UI Component framework
    RetypeDocumentation website generator
    MojeeLightning fast Emoji library for .NET
    Ext.NET Examples|Ext.NET API Docs|ExtJS API Docs|Twitter
  3. #3
    Feb 22, 2020, 9:31 AM
    Hi FabrÃ*cio,
    thank you for reply. I'm a little surprised that this approach is so rarely used. I consider it a nice way not to reduce the model to a mere description of the data, but to extend it by other attributes associated with the data type and its representation. However, it points to a diverse range of possibilities that technology offers and everyone can choose according to their personal taste.

    As already mentioned, the test case is rather simple and straightforward:

    Model
    namespace TestCases.Models
{
    public class M_Test
    {
        public List<M_Test_Row> Rows { set; get; }
    }

    public class M_Test_Row
    {
        [Column(Order = 1, Flex = 1, Align = Ext.Net.Alignment.Right)]
        public int Amount { get; set; }
    }
}
    Controller
    namespace TestCases.Controllers
{
    public class GridColumnAlignController : Controller
    {
        public ActionResult Index()
        {
            M_Test model = new M_Test
            {
                Rows = new List<M_Test_Row>
                {
                    new M_Test_Row { Amount = 4560 },
                    new M_Test_Row { Amount = 71329 },
                    new M_Test_Row { Amount = 13 },
                    new M_Test_Row { Amount = 132 }
                }
            };

            return View(model);
        }
    }
}
    View
    @model TestCases.Models.M_Test

@{
    ViewBag.Title = "Grid Column Align";
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <title>Ext.NET MVC Test Case</title>
</head>

<body>
    @Html.X().ResourceManager()

    @Html.X().DisplayField().ID("version").ReadOnly(true).Margin(10).Width(200)

    @Html.X().GridPanelFor(m => m.Rows).Margin(10).Width(100).Height(150)
</body>

</html>

<script type="text/javascript">
    Ext.onReady(function () {
        Ext.getCmp("version").setValue("Ext JS " + Ext.getVersion().version + " / " + "Ext.NET " + Ext.net.Version);
    });
</script>
    Tested on Ext.NET 5.1.

    Thank you for your assistance.

    Best regards
    Dan
  4. #4
    Feb 24, 2020, 7:27 PM
    Hello again, Dan!

    Thank you for letting us know how exactly you have been using this setting in Ext.NET, the very simple test case is perfect to highlight its usage. We should include an example in our MVC Examples Explorers highlighting this feature -- and this will help us identify issues with the attributes should they ever change again.

    On to the fix, we have applied the change in Ext.NET that would address this issue. Beware this is a breaking change introduced back in Ext.NET 4.2.0 (more info in the related github issue). As it has been broken including between Ext.NET 4 to 5 release, we deemed it worth introducing the breaking change even though this will be an intra-major release, considering it has been broken for the previous major version.

    The new values, obeying Sencha's Ext JS API on Grid column alignment, have changed as follows:

    - Left => Start
    - Center => Center (yes, this one didn't change)
    - Right => End

    And the Default option was introduced. This avoids an issue where Left would never be emitted to client side; if the column align default value had been altered somewhere else in the page, this would result in the impossibility to left-align columns from code-behind commands. The Default setting ensures it will use the current Ext JS default, no matter what it is -- and it is equivalent to not specifying the setting at all as, by default, the default is chosen.

    The change makes sense when you think on Ext NET's inherent support for RTL (right-to-left, inherited from Ext JS) layouts, where "right" could (and probably was before 4.2.0) inverted when the layout was that. Changing it to start/end would congruently indicate the correct layout to expect from the setting in either reading directions.

    Hope this helps!

    In case the answer is too long and boring to read: the issue has been fixed and will be available next Ext.NET release. It introduces a breaking change, for details I'm afraid reading the whole answer would be required. :)
    Fabrício Murta
    Developer & Support Expert
    Ext.NETASP.NET UI Component framework
    RetypeDocumentation website generator
    MojeeLightning fast Emoji library for .NET
    Ext.NET Examples|Ext.NET API Docs|ExtJS API Docs|Twitter
  5. #5
    Feb 25, 2020, 8:14 AM
    Hi FabrÃ*cio,
    thank you for the detailed answer. Taking RTL into account, the new values ​​make sense. Please let me know when the fix is ​​available.

    Kind regards
    Dan
  6. #6
    Feb 25, 2020, 12:06 PM
    Hello Dan,

    You can actually have an override to switch the center and right alignment behavior. But:

    - if in the same page you declare the override, you also right or center-align columns by other means (as Razor, or from controller -- rather than attributes in the model), they will be then swapped. Perhaps not a problem for your pages using GridPanelFor
    - the workaround should have a test to check whether Ext.NET version is between 4.2.0 and 5.1.0, so that it won't break, for instance, when you upgrade to the next release (ideally the workaround should be removed completely, but this would avoid forgetting it)

    Are you interested in a workaround like that for the time being, before the next release? We don't have a precise deadline on the next release now but you can keep watch by subscribing to our newsletter at Ext.NET website or following us in facebook or twitter.

    Let us know if you really need a workaround for the time being or if that's alright to wait until release, which should happen in the next few months, likely following another release of Ext JS.
    Last edited by fabricio.murta; Feb 25, 2020 at 5:12 PM.
  7. #7
    Feb 25, 2020, 2:00 PM
    Hi FabrÃ*cio,
    thank you for the offer, but we've already implemented a workaround that works for us. We just need to remember to remove it when a fix is ​​available. We will wait...

    Kind regards
    Dan
  8. #8
    Feb 25, 2020, 2:12 PM
    Okay, Dan, thanks for the feedback!
    Fabrício Murta
    Developer & Support Expert
    Ext.NETASP.NET UI Component framework
    RetypeDocumentation website generator
    MojeeLightning fast Emoji library for .NET
    Ext.NET Examples|Ext.NET API Docs|ExtJS API Docs|Twitter

Similar Threads

  1. [CLOSED] Grid column alignment + row expander
    By machinableed in forum 2.x Legacy Premium Help
    Replies: 1
    Last Post: Jun 14, 2012, 1:50 PM
  2. [CLOSED] Multi Level Grid -> Column Headers css style and alignment
    By bsnezw in forum 1.x Legacy Premium Help
    Replies: 7
    Last Post: Jun 16, 2011, 4:22 PM
  3. [CLOSED] number renderer in grid column
    By Vasudhaika in forum 1.x Legacy Premium Help
    Replies: 5
    Last Post: Dec 05, 2010, 11:01 AM
  4. [CLOSED] Number grid column format
    By Stefanaccio in forum 1.x Legacy Premium Help
    Replies: 15
    Last Post: Oct 27, 2010, 3:40 PM
  5. [CLOSED] [1.0] Number format in Grid Column
    By bsnezw in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Feb 09, 2010, 2:06 PM

Tags for this Thread

Posting Permissions