Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
135
Format Grid Columns
posted

Hello I have a question regarding the igGrid in an ASP.NET MVC using razor website including Bootstrap.

How can I apply styling to the UI Grid (cell by cell if possible). I would like to do the following:

1.) Align header and column to right,left.center on columns. Right now the grid is left aligning all column header text and column values.
2.) Dynamically change cell value color based on its value. For example if a value is a negative number, display the value in red. If this can be done in c# that would be great.


I want to do this using c# not in jQuery. Below is my my grid.


                @(Html.Infragistics().Grid<eMerchant.Reports.Models.EventSummary>()
                                            .ID("uigOrderSummary")
                                            .PrimaryKey("OrderGUID")
                                            .AutoGenerateLayouts(true)
                                            .AutoGenerateColumns(false)
                                            .AutoCommit(true)
                                            .Caption("Event Summary")
                                            .DataSource(Model)
                                            .Width("100%")
                                            .RenderCheckboxes(true)

                                            .Columns(column =>
                                            {
                                                column.Unbound("orders").HeaderText("").Width("60px").Template("<a class='link' href='" + Url.Action("OrderList", "Orders", new { area = "Reports" }) + "?EventGUID=${EventGUID}&ProductGUID=${ProductGUID}&FromDate=" + HttpContext.Current.Server.UrlEncode(ViewBag.CriteriaFromDate) + "&ToDate=" + HttpContext.Current.Server.UrlEncode(ViewBag.CriteriaToDate) + "&ShowFailedOrders=" + ViewBag.ShowFailedOrders + "&DisplayListInGet=true&UrlSource=EventSummary'" + " target='_blank'>Orders</a>").Hidden(false);
                                                column.For(x => x.EventGUID).DataType("string").HeaderText("EventGUID").Hidden(true);
                                                column.For(x => x.EventName).DataType("string").HeaderText("Event").Width("150px").Hidden(false);
                                                column.For(x => x.ProductTypeName).DataType("string").HeaderText("Type").Hidden(false);
                                                column.For(x => x.ProductGUID).DataType("string").HeaderText("ProductGUID").Hidden(true);
                                                column.For(x => x.ProductName).DataType("string").Width("200px").HeaderText("Product").Hidden(false);
                                                column.For(x => x.ProductSKU).DataType("string").Width("100px").HeaderText("SKU").Hidden(true);
                                                column.For(x => x.EventProductGUID).DataType("string").HeaderText("EventProductGUID").Hidden(true);
                                                column.For(x => x.EventProducts_ProductSKU).DataType("string").HeaderText("SKU").Hidden(true);
                                                column.For(x => x.EventProducts_ProductName).DataType("string").HeaderText("Product").Hidden(true);
                                                column.For(x => x.NoOfOrders).DataType("number").Width("100px").HeaderText("Orders").Format("0:0").Hidden(false);
                                                column.For(x => x.NoOfItems).DataType("number").HeaderText("Items").Format("0:0").Hidden(true);
                                                column.For(x => x.Quantity).DataType("number").Width("125px").HeaderText("Quantity").Format("0:0").Hidden(false);
                                                column.For(x => x.ItemUnitPrice).DataType("number").Width("150px").HeaderText("Price").Format("0:$0.00").Hidden(false);
                                                column.For(x => x.SubTotal).DataType("number").Width("150px").HeaderText("Subtotal").Format("0:$0.00").Hidden(false);
                                                column.For(x => x.SalesTax).DataType("number").Width("150px").HeaderText("Sales Tax").Format("0:$0.00").Hidden(false);
                                                column.For(x => x.ProcessngFees).DataType("number").Width("150px").HeaderText("Processiing Fees").Format("0:$0.00").Hidden(false);
                                                column.For(x => x.Total).DataType("number").Width("150px").HeaderText("Total").Format("0:$0.00").Hidden(false);
                                            })


                                            .Features(features =>
                                            {
                                                features.Filtering().Type(OpType.Local);
                                                //features.Paging().Type(OpType.Local);
                                                features.Resizing();
                                                features.Selection().Mode(SelectionMode.Row).MultipleSelection(false);
                                                features.Sorting().Type(OpType.Local).Mode(SortingMode.Multiple);
                                                features.Tooltips().Visibility(TooltipsVisibility.Always);

                                                features.Responsive().EnableVerticalRendering(false).ColumnSettings(settings =>
                                                {
                                                    settings.ColumnSetting().ColumnKey("orders").Configuration(config =>
                                                    {
                                                        config.AddColumnModeConfiguration("desktop", c => c.Hidden(false));
                                                        config.AddColumnModeConfiguration("phone", c => c.Hidden(true));
                                                        config.AddColumnModeConfiguration("tablet", c => c.Hidden(false));
                                                    });

                                                    settings.ColumnSetting().ColumnKey("ProductTypeName").Configuration(config =>
                                                    {
                                                        config.AddColumnModeConfiguration("desktop", c => c.Hidden(false));
                                                        config.AddColumnModeConfiguration("phone", c => c.Hidden(true));
                                                        config.AddColumnModeConfiguration("tablet", c => c.Hidden(false));
                                                    });

                                                    settings.ColumnSetting().ColumnKey("EventName").Configuration(config =>
                                                    {
                                                        config.AddColumnModeConfiguration("desktop", c => c.Hidden(false));
                                                        config.AddColumnModeConfiguration("phone", c => c.Hidden(true));
                                                        config.AddColumnModeConfiguration("tablet", c => c.Hidden(false));
                                                    });

                                                    settings.ColumnSetting().ColumnKey("ProductSKU").Configuration(config =>
                                                    {
                                                        config.AddColumnModeConfiguration("desktop", c => c.Hidden(true));
                                                        config.AddColumnModeConfiguration("phone", c => c.Hidden(true));
                                                        config.AddColumnModeConfiguration("tablet", c => c.Hidden(true));
                                                    });

                                                    settings.ColumnSetting().ColumnKey("ItemUnitPrice").Configuration(config =>
                                                    {
                                                        config.AddColumnModeConfiguration("desktop", c => c.Hidden(false));
                                                        config.AddColumnModeConfiguration("phone", c => c.Hidden(true));
                                                        config.AddColumnModeConfiguration("tablet", c => c.Hidden(false));
                                                    });

                                                    settings.ColumnSetting().ColumnKey("SubTotal").Configuration(config =>
                                                    {
                                                        config.AddColumnModeConfiguration("desktop", c => c.Hidden(false));
                                                        config.AddColumnModeConfiguration("phone", c => c.Hidden(true));
                                                        config.AddColumnModeConfiguration("tablet", c => c.Hidden(false));
                                                    });

                                                    settings.ColumnSetting().ColumnKey("SalesTax").Configuration(config =>
                                                    {
                                                        config.AddColumnModeConfiguration("desktop", c => c.Hidden(false));
                                                        config.AddColumnModeConfiguration("phone", c => c.Hidden(true));
                                                        config.AddColumnModeConfiguration("tablet", c => c.Hidden(false));
                                                    });

                                                    settings.ColumnSetting().ColumnKey("ProcessngFees").Configuration(config =>
                                                    {
                                                        config.AddColumnModeConfiguration("desktop", c => c.Hidden(false));
                                                        config.AddColumnModeConfiguration("phone", c => c.Hidden(true));
                                                        config.AddColumnModeConfiguration("tablet", c => c.Hidden(false));
                                                    });

                                                    settings.ColumnSetting().ColumnKey("Total").Configuration(config =>
                                                    {
                                                        config.AddColumnModeConfiguration("desktop", c => c.Hidden(false));
                                                        config.AddColumnModeConfiguration("phone", c => c.Hidden(true));
                                                        config.AddColumnModeConfiguration("tablet", c => c.Hidden(false));
                                                    });
                                                });

                                                features.Summaries().ShowSummariesButton(false).ShowDropDownButton(false).ColumnSettings(settings =>
                                                {
                                                    settings.ColumnSetting().ColumnKey("EventGUID").AllowSummaries(false);
                                                    settings.ColumnSetting().ColumnKey("EventName").AllowSummaries(false);
                                                    settings.ColumnSetting().ColumnKey("ProductTypeName").AllowSummaries(false);
                                                    settings.ColumnSetting().ColumnKey("ProductName").AllowSummaries(false);
                                                    settings.ColumnSetting().ColumnKey("ProductSKU").AllowSummaries(false);
                                                    settings.ColumnSetting().ColumnKey("EventProducts_ProductSKU").AllowSummaries(false);
                                                    settings.ColumnSetting().ColumnKey("EventProducts_ProductName").AllowSummaries(false);
                                                    settings.ColumnSetting().ColumnKey("ItemUnitPrice").AllowSummaries(false);
                                                    settings.ColumnSetting().ColumnKey("NoOfOrders").AllowSummaries(false);
                                                    settings.ColumnSetting().ColumnKey("NoOfItems").AllowSummaries(false);


                                                    settings.ColumnSetting().ColumnKey("Quantity").SummaryOperands(so =>
                                                    {
                                                        so.SummaryOperand().Type(SummaryFunction.Sum).Active(true).RowDisplayLabel("");
                                                    });

                                                    settings.ColumnSetting().ColumnKey("SubTotal").SummaryOperands(so =>
                                                    {
                                                        so.SummaryOperand().Type(SummaryFunction.Sum).Active(true).RowDisplayLabel("");
                                                    });

                                                    settings.ColumnSetting().ColumnKey("SalesTax").SummaryOperands(so =>
                                                    {
                                                        so.SummaryOperand().Type(SummaryFunction.Sum).Active(true).RowDisplayLabel("");
                                                    });

                                                    settings.ColumnSetting().ColumnKey("ProcessngFees").SummaryOperands(so =>
                                                    {
                                                        so.SummaryOperand().Type(SummaryFunction.Sum).Active(true).RowDisplayLabel("");
                                                    });

                                                    settings.ColumnSetting().ColumnKey("Total").SummaryOperands(so =>
                                                    {
                                                        so.SummaryOperand().Type(SummaryFunction.Sum).Active(true).RowDisplayLabel("");
                                                    });

                                                });

                                            })
                                            .DataBind()
                                            .Render()

Parents
No Data
Reply
  • 0
    Offline posted

    Learn from the success stories of other Canadian candle businesses. For example, Coal and Canary started as a small business and grew into a well-known Soy Wax Wholesale Canada brand thanks to their unique scents and stylish packaging.

Children
No Data