[CLOSED] Set RowSelectionModel on a inserted row.

Page 2 of 2 FirstFirst 12
  1. #11
    Hi,

    Following is my cshtml

    @{
        ViewBag.Title = "Test";
        var X = Html.X();   
        Layout = null;
    }
    <html>
    <head>
        <title>test</title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
        <script>
            function Save() {
                alert(App.TestGrid.getSelectionModel().getCount());
                for (var i = 0; i < changedRows.length; i++) {
                    alert("PKColValue : " + changedRows[i].PKColValue + "          Field : " + changedRows[i].Field + "     New Value : " + changedRows[i].NewValue);
                }
            }
            var addedRecords = [];
            var changedRows = [];
            var fieldname = null;
            var pageNo = 0;
            var cellEdit = function (editor, e) {
                for (var i = 0; i < changedRows.length; i++) {
                    if (changedRows[i].IsEdited == false) {
                        changedRows.splice(i, 1);
                    }
                }
                fieldname = e.field;
                pageNo = $('#PageBar').find('input[type="text"]').val();
                var rowIndex = e.rowIdx;//App.TestGrid.getSelectionModel().selected.items[0].index;//Get the selected row index
                //var pageSize = '@Convert.ToInt32(PriceRight.Settings.PropertyReader.GetProperty("GRID_PAGE_SIZE"))'
                    var pageSize = 3;
                    if (pageNo > 1) {
                        rowIndex = rowIndex - ((pageNo - 1) * pageSize);
                    }
                    changedRows.push({ "IsEdited": false, "Field": e.field, "PageIndex": pageNo - 1, "RowIndex": rowIndex, "PKColValue": e.view.store.data.items[rowIndex].data.IdCol, "NewValue": "" });
                    return true;
                }
    
                var cellBlur = function (object) {
                    changedRows[changedRows.length - 1].NewValue = object.lastValue;
                    changedRows[changedRows.length - 1].IsEdited = true;
    
                }
    
                var cellTxtBlur = function (object) {
                    changedRows[changedRows.length - 1].NewValue = object.lastValue;
                    changedRows[changedRows.length - 1].IsEdited = true;
    
                }
    
                var storeLoad = function () {
                    for (var i = 0; i < App.TestGrid.store.getCount() ; i++) {
                        for (var j = 0; j < changedRows.length; j++) {
                            if (App.TestGrid.store.getAt(i).get('IdCol') == changedRows[j].PKColValue) {
                                App.TestGrid.store.getAt(i).set(changedRows[j].Field, changedRows[j].NewValue);
                            }
                        }
    
                    }
                    var pageNo = $('#PageBar').find('input[type="text"]').val();
                    var storeSt = Ext.getStore('Store1');
                    for (var i = 0; i < addedRecords.length; i++) {
                        if (addedRecords[i].PageNo == pageNo) {
                            storeSt.insert(addedRecords[i].rowIndex, addedRecords[i].record);
                        }
                    }
                }
    
    
    
                var rowindex = null;
                var paras = new Array();
                var storeData = null;
                var originalRecord = null;
    
                // opens application specific context menu
                var onContextMenu = function (e, currentRecord, index, priceEntryMenu) {
                    rowindex = index;
                    e.preventDefault();
                    var rec = currentRecord;
                    originalRecord = currentRecord.data;
                    storeData = JSON.parse(JSON.stringify(currentRecord.data));
                    priceEntryMenu.dataRecord = rec.data;
                    priceEntryMenu.showAt(e.getXY());
                };
    
                // On Selecting a option from application specific contextmenu Adds a new row to price entry grid , Deletes a row respectively
                var onClick = function (grid, text) {
                    if (text == "Add Row") {
                        storeData.IsAddedRow = true;
                        var r = Ext.create('TestGridModel', storeData);
                        r.data.IdCol = parseInt(Math.floor((Math.random() * (1000 - 100) + 100) + 1));
                        var storeSt = Ext.getStore('Store1');
                        storeSt.insert(rowindex + 1, r);
                        pageNo = $('#PageBar').find('input[type="text"]').val();
                @*var rowIndex = App.TestGrid.getSelectionModel().selected.items[0].index;                *@
                var pageSize = 3;
                if (pageNo > 1) {
                    rowIndex = rowIndex - ((pageNo - 1) * pageSize);
                }
                addedRecords.push({ "PageNo": pageNo, "rowIndex": rowindex + 1, "record": r });
                App.TestGrid.getSelectionModel().select(App.TestGrid.store.getAt(rowindex + 1))
                App.TestGrid.editingPlugin.startEditByPosition({ row: rowindex, column: 0 });
                return false;
            }
        };
        </script>
    </head>
    <body>
    
        @(Html.X().ResourceManager(ViewBag.ManagerConfig as MvcResourceManagerConfig))
        <h2>Test</h2>
    
    
    
        @(
     Html.X().FormPanel().ID("FRM").Items(
        Html.X().GridPanel().ID("TestGrid")
                .Title("Editable GridPanel")
                .Width(600)
                .Height(350)
                .Store(Html.X().Store().PageSize(3).Listeners(ls => ls.Load.Fn = "storeLoad")
                    .ID("Store1")
                     .Proxy(Html.X().AjaxProxy()
                    .Url(Url.Action("GetData"))
                    .Reader(Html.X().JsonReader().Root("data"))
                    )
                    .Model(Html.X().Model().IDProperty("IdCol").Name("TestGridModel")
                        .IDProperty("IdCol")
                        .Fields(
                              new ModelField("IdCol", ModelFieldType.Int),
                    new ModelField("NameCol", ModelFieldType.String),
                    new ModelField("AgeCol", ModelFieldType.Int)
                        )
                    )
    
                )
                .ColumnModel(
                    Html.X().Column()
                        .Text("IdCol")
                        .DataIndex("IdCol")
                        .Flex(1),
                    Html.X().Column()
                        .Text("NameCol")
                        .DataIndex("NameCol")
                        .Editor(Html.X().TextField().Listeners(ls => ls.Blur.Fn = "cellTxtBlur")),
                    Html.X().Column()
                        .Text("AgeCol")
                        .DataIndex("AgeCol")
                        .Editor(Html.X().NumberField().Listeners(ls => ls.Blur.Fn = "cellBlur"))
                )
                .SelectionModel(Html.X().RowSelectionModel().ID("TestGridRowSelectionModel"))
                .Plugins(
                    Html.X().CellEditing().Listeners(ls => ls.BeforeEdit.Fn = "cellEdit")
                )
                .BottomBar(Html.X().PagingToolbar().ID("PageBar").HideRefresh(true)
                  .FirstText("First")
                                                    .PrevText("Previous")
                                                    .NextText("Next")
                                                    .LastText("Last").AfterPageText("of {0}").BeforePageText("Page")
    
                )
                .Listeners(l => l.ItemContextMenu.Handler = "onContextMenu(e,this.store.getAt(index),index,#{GridPriceEntryContextMenu})")
    
             .Features
            (
                Html.X().RowWrap())
            ))
        @(
     X.Container(
                    ).ID("cntButton").Items(X.Button().ID("btnSave").Text("Save").Type(ButtonType.Submit).Handler("Save")
        ))
        @(X.Menu().ID("GridPriceEntryContextMenu").Width(100).MaxHeight(50)
                                                    .Items(X.MenuItem()
                                                            .Text("Add Row")
                                                            .Listeners(l => l.Click.Handler = "onClick(this,'Add Row')")
                                                          ))
    </body>
    </html>
    Following are my controller Action methods

    
            public ActionResult Test()
            {
                return View();
            }
    
            
            public ActionResult GetData(StoreRequestParameters parameters)
            {                 
                return this.Store(Paging(parameters));
            }
    
            private Paging<DummyData> Paging(StoreRequestParameters parameters)
            {
                return Paging(parameters.Start, parameters.Limit, parameters.SimpleSort, parameters.SimpleSortDirection, null);
            }
    
            private Paging<DummyData> Paging(int start, int limit, string sort, SortDirection dir, string filter)
            {
             
            List<DummyData> data = new List<DummyData>();
                data.Add(new DummyData() { IdCol = 1, NameCol = "First", AgeCol = 25 });
                data.Add(new DummyData() { IdCol = 2, NameCol = "Second", AgeCol = 35 });
                data.Add(new DummyData() { IdCol = 3, NameCol = "Third", AgeCol = 30 });
                data.Add(new DummyData() { IdCol = 4, NameCol = "Fourth", AgeCol = 25 });
                data.Add(new DummyData() { IdCol = 5, NameCol = "Fifth", AgeCol = 35 });
                data.Add(new DummyData() { IdCol = 6, NameCol = "Sixth", AgeCol = 30 });
                
                if (!string.IsNullOrEmpty(filter) && filter != "*")
                {
                    //data.RemoveAll(plant => !plant.Common.ToLower().StartsWith(filter.ToLower()));
                }
    
                if (!string.IsNullOrEmpty(sort))
                {
                    data.Sort(delegate(DummyData x, DummyData y)
                    {
                        object a;
                        object b;
    
                        int direction = dir == SortDirection.DESC ? -1 : 1;
    
                        a = x.GetType().GetProperty(sort).GetValue(x, null);
                        b = y.GetType().GetProperty(sort).GetValue(y, null);
    
                        return CaseInsensitiveComparer.Default.Compare(a, b) * direction;
                    });
                }
    
                if ((start + limit) > data.Count)
                {
                    limit = data.Count - start;
                }
    
                List<DummyData> rangePlants = (start < 0 || limit < 0) ? data : data.GetRange(start, limit);
    
                return new Paging<DummyData>(rangePlants, data.Count);
            }

    Following is my ViewModel class

     public class DummyData
        {
            public int IdCol { get; set; }
            public string NameCol { get; set; }
            public int AgeCol { get; set; }
        }
    I am facing an issue;
    Following are the steps to reproduce issue.
    1) right click on any of the gridpanel rows . You will get context menu with "Add Row" option.
    2) Click on "Add Row" - it will insert a copy of current row below.
    3) Double click the Name or Age column cell(s).

    Expected : added row cell should turn into a editable field.
    Actual : the original row cell turning into a editable field.

    Am I missing something.
  2. #12
    You should provide a unique value before creating a record instance.
    storeData.IdCol = parseInt(Math.floor((Math.random() * (1000 - 100) + 100) + 1));
    var r = Ext.create('TestGridModel', storeData);
    Please note that a random call cannot guarantee a unique value.
Page 2 of 2 FirstFirst 12

Similar Threads

  1. [CLOSED] gridpanel - Apply css to inserted row / record
    By PriceRightHTML5team in forum 2.x Legacy Premium Help
    Replies: 6
    Last Post: Aug 21, 2013, 10:12 AM
  2. Replies: 2
    Last Post: Oct 13, 2011, 5:02 PM
  3. Replies: 7
    Last Post: Oct 06, 2010, 6:44 PM
  4. [CLOSED] GridPanel select and scroll to inserted row
    By smart+ in forum 1.x Legacy Premium Help
    Replies: 11
    Last Post: Sep 29, 2010, 11:40 AM
  5. [CLOSED] I can not edit inserted record in a grid.
    By flormariafr in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Aug 03, 2010, 8:20 PM

Tags for this Thread

Posting Permissions