[CLOSED] dynamic columns to gridpanel not showing up

  1. #1

    [CLOSED] dynamic columns to gridpanel not showing up

    I have a gridpanel which has few columns added in the html markup and one column added dynamically, but the dynamic column does not show up.
    Please guide me what's wrong I am doing here:

    View code:
    X.FormPanel().DefaultButton("btnTestDynamic").Layout(LayoutType.HBox)
                
                
                .Buttons(
                    X.Button().ID("btnTestDynamic").Text("Add").Listeners(l => { l.Click.Handler = "Add()"; }),
                    
                ).ButtonAlign(Alignment.Center),
                
                X.GridPanel().Layout(LayoutType.Fit).ID("testGrid")
                    .Store
                    (
                        X.Store().ID("testStore")
                        .AutoLoad(false)
                        .Model
                        (
                            X.Model()
                            .Fields
                            (
                                new ModelField("Id"),                           
                                new ModelField("JoiningDate", ModelFieldType.Date)
                                
                                )
                            )
                    )
                    .ColumnModel
                    (
                        X.Column().Text("Id").DataIndex("Id").Hidden(true),
                        X.Column().Text("Joining Date").DataIndex("JoiningDate")
            
                    )
                    .View(X.GridView().StripeRows(true).TrackOver(true))
                    .SelectionModel(X.RowSelectionModel().Mode(SelectionMode.Single))

    JS Code
    function Add()
    {
        
        Ext.net.Mask.show({ msg: 'Loading data..});
        $.ajax({
            url: "/Home/AddGridColumn",
            data: JSON.stringify({ testData: selectedValues }),
            async: false,
            type: "POST",
            contentType: 'application/json',
            success: function (result) {
                
                    Ext.net.Mask.hide();
                    App.testGrid.getStore().loadData(result.result);
                    App.testGrid.getView().refresh();
                    
                
            }
        });
    }
    CodeBehind:
    public ActionResult AddGridColumn(string[] testData)
            {
              
                using (var uow = _uow.Create())
                {
                    var finalData = GetJoinees(testData);
                    if (finalData .Count() > 0)
                    {
                        DataTable myDt = ConverDataToDatatable(finalData);
                        
                        GridPanel grid = X.GetCmp<GridPanel>("testGrid");
                        Store store = X.GetCmp<Store>("testStore");
                        
                       
                                foreach (DataRow row in myDt.Rows)
    	                        {
                                    
                                    for (int j = 0; j < myDt.Columns.Count; j++)
                                    {
                                        if (myDt.Columns[j].ColumnName == "UserDetail")
                                        {
                                            string[] splitColData = row[myDt.Columns[j].ColumnName].ToString().Split('_');
                                            if (splitColData.Count() > 0)
                                            {
                                                string userName = splitColData[0];
                                                DateTime JoinedOn = Convert.ToDateTime(splitColData[1]);
                                                
                                                ModelField fieldJoinedOn = new ModelField("Joined On", ModelFieldType.Date);
                                                store.AddField(fieldJoinedOn);
                                                
    
                                                Column gridCol = new Column();
                                                gridCol.Text = userName;
                                                
    
                                                ComponentColumn columnJoinedOn = new ComponentColumn();
                                                columnJoinedOn.Text = "Completed On";
                                                columnJoinedOn.DataIndex = completedOnFieldName;
                                                columnJoinedOn.Editor = true;
                                                DateField dtJoinedOn = new DateField();
                                                dtJoinedOn.Value = completedOn;
                                                columnCompletedOn.Component.Add(dtJoinedOn);
    
    
                                                
                                                gridCol.Columns.Add(columnJoinedOn);
    
                                                grid.AddColumn(gridCol);
    
                                                
                                            }
    
                                        }
                                        
                                    }
    	                        }
    
                        
                        var result = finalData;
                        return this.Direct(result);
                    }
                    else
                    {
                        var result = "Error";
                        return this.Direct(result);
                    }
                }
    
    
            }
    Thanks
    Last edited by fabricio.murta; Mar 04, 2016 at 11:54 AM.
  2. #2
    can anybody please reply to this post
  3. #3
    Hello, I can't run your example here, there are several missing artifacts required to run it by our side, like the methods to load data.

    Please, when providing test case, ensure it does not include any foreign artifact. You can base test cases from examples on our MVC Examples Explorer.

    That said, all I can do is try to read the code you provided and make a few guesses. I'm basing the guess from this example: Columns model ajax operation

    1. You probably need to reload the data in order to have the store to correctly bind the column's data to its just-added field.
    2. You seem to be adding a component column inside a column. Don't you want just to create a ComponentColumn directly?

    I see:
    ...
    Column gridCol = new Column();
    ...
    gridCol.Columns.Add(columnJoinedOn);
    grid.AddColumn(gridCol);
    You probably want to get rid of gridCol and just add columnJoinedOn to the grid instead.

    Sorry for the delay replying your question, and sorry if the reply does not shed a light into fixing your issue. If you still can't figure out what's wrong, please provide a runnable test case, and then we'd be able to provide you proper advice.

    Please refer to the Columns model ajax operation example if you want to see a case where a column is added to a GridPanel. In the example the column has also an editor ibued to its logic. Your case seems to be a ComponentColumn instead of a plain Column, and without any editor code.

    I hope this helps!
    Fabrício Murta
    Developer & Support Expert
  4. #4
    Thanks @fabricio.murta for your response, but nothing worked for me

    I am trying to add some more logic to my previous post, and see if it helps to get the problem.

    I have added code to code behind file, and I think js and view code doesn't need any changes and will remain the same

    code behind :

    
    public List<result> GetJoinees(string[] testData)
    {
    return new List<result>(){
    new result() {Id = "1", JoiningDate="03/02/2015", UserDetail="John, Travis_01/01/2016"},
    new result() {Id = "2", JoiningDate="02/24/2015", UserDetail="Crow, John_09/14/2016"},
    new result() {Id = "3", JoiningDate="01/12/2015", UserDetail="Taylor, Ross_09/14/2016"},
    };
    
    }
    
    public ActionResult AddGridColumn(string[] testData)
            {
              
                using (var uow = _uow.Create())
                {
                    var finalData = GetJoinees(testData);
                    if (finalData .Count() > 0)
                    {
                        DataTable myDt = ConverDataToDatatable(finalData);
                        
                        GridPanel grid = X.GetCmp<GridPanel>("testGrid");
                        Store store = X.GetCmp<Store>("testStore");
                        
                       
                                foreach (DataRow row in myDt.Rows)
    	                        {
                                    
                                    for (int j = 0; j < myDt.Columns.Count; j++)
                                    {
                                        if (myDt.Columns[j].ColumnName == "UserDetail")
                                        {
                                            string[] splitColData = row[myDt.Columns[j].ColumnName].ToString().Split('_');
                                            if (splitColData.Count() > 0)
                                            {
                                                string userName = splitColData[0];
                                                DateTime JoinedOn = Convert.ToDateTime(splitColData[1]);
                                                
                                                ModelField fieldJoinedOn = new ModelField("Joined On", ModelFieldType.Date);
                                                store.AddField(fieldJoinedOn);
                                                
    
                                                Column gridCol = new Column();
                                                gridCol.Text = userName;
                                                
    
                                                ComponentColumn columnJoinedOn = new ComponentColumn();
                                                columnJoinedOn.Text = "Completed On";
                                                columnJoinedOn.DataIndex = completedOnFieldName;
                                                columnJoinedOn.Editor = true;
                                                DateField dtJoinedOn = new DateField();
                                                dtJoinedOn.Value = completedOn;
                                                columnCompletedOn.Component.Add(dtJoinedOn);
    
    
                                                
                                                gridCol.Columns.Add(columnJoinedOn);
    
                                                grid.AddColumn(gridCol);
    
                                                
                                            }
    
                                        }
                                        
                                    }
    	                        }
    
                        
                        var result = finalData;
                        return this.Direct(result);
                    }
                    else
                    {
                        var result = "Error";
                        return this.Direct(result);
                    }
                }
    
    
            }
    
    private DataTable ConverDataToDatatable<T>(IList<T> data)
            {
                PropertyDescriptorCollection properties = TypeDescriptor.GetProperties(typeof(T));
                DataTable table = new DataTable();
    
                foreach (PropertyDescriptor prop in properties)
                {
                    table.Columns.Add(prop.Name.Replace('_', ' '), Nullable.GetUnderlyingType(prop.PropertyType) ?? prop.PropertyType);
                }
    
                if (data != null)
                {
                    foreach (T item in data)
                    {
                        DataRow row = table.NewRow();
                        foreach (PropertyDescriptor prop in properties)
                        {
                            row[prop.Name.Replace('_', ' ')] = prop.GetValue(item) ?? DBNull.Value;
                        }
    
                        table.Rows.Add(row);
                    }
                }
                return table;
            }
  5. #5
    this is really bad, no one in the forum team cares to help solve our problem

Similar Threads

  1. [CLOSED] GridPanel with Dynamic Fields and Columns
    By Argenta in forum 3.x Legacy Premium Help
    Replies: 6
    Last Post: Dec 31, 2015, 12:57 PM
  2. Replies: 0
    Last Post: Sep 30, 2011, 7:43 AM
  3. Icons not showing in GridPanel Command Columns
    By Groovepoets in forum 1.x Help
    Replies: 3
    Last Post: Oct 20, 2010, 3:52 PM
  4. [CLOSED] [1.0] Problem with Dynamic Columns in gridpanel
    By juane66 in forum 1.x Legacy Premium Help
    Replies: 6
    Last Post: May 24, 2010, 3:33 PM
  5. [CLOSED] GridPanel + Dynamic Columns + Count
    By Zarzand in forum 1.x Legacy Premium Help
    Replies: 6
    Last Post: Jul 10, 2009, 4:46 PM

Tags for this Thread

Posting Permissions