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

Printable View

Feb 21, 2020, 6:58 AM
NewLink

[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:

Code:

[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
Feb 21, 2020, 5:28 PM
fabricio.murta

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.
Feb 22, 2020, 8:31 AM
NewLink

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

Code:

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

Code:

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

Code:

@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
Feb 24, 2020, 6:27 PM
fabricio.murta

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. :)
Feb 25, 2020, 7:14 AM
NewLink

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
Feb 25, 2020, 11:06 AM
fabricio.murta

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.
Feb 25, 2020, 1:00 PM
NewLink

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
Feb 25, 2020, 1:12 PM
fabricio.murta

Okay, Dan, thanks for the feedback!