Results 1 to 4 of 4

Thread: Auto select newly added record in grid

  1. #1
    Sencha User
    Join Date
    May 2012
    Posts
    3

    Default Auto select newly added record in grid

    I am trying to create a kind of todo items by using grid and storing data in MySQL database.
    I have created a toolbar button 'Add New' which will prompt to enter text. On submit, it will be sent to php program to create new todo item. After that, program will load the store (which renders the grid automatically). I want the newly created todo item should be selected by default.

    Here is my code:
    Code:
    items: [{region: 'west', 
    		xtype: 'grid', id:'TodoGrid', itemId:'TodoGrid', bodyStyle: 'border-bottom:0px',
    		store: TodoStore,layout:'fit',
    		columns: [
    			{ xtype: 'rownumberer', width: 30, sortable: false },
    			{ text: 'ID', width: 30, sortable : false, hide:false, dataIndex: 'id' },
    			{ text: 'Topic', flex:1, sortable : true, dataIndex: 'topic' }
    		],
    		tbar:[{
    			text:'New Todo', 
    			tooltip:'',
    			iconCls:'add',
    			handler: function(grid, rowIndex, colIndex) {
    				
    				Ext.Msg.prompt('Todo', "Enter Todo title:", function(btn, text, cfg) {
    					if(btn == 'ok' && !Ext.isEmpty(text)) {						
    						Ext.Ajax.request({
    							url: 'Todo-create.php',   
    							params: { topic:text },
    							success: function (result) { 								
    								Ext.getCmp('status').setText(arr[1]);
    								if (result.responseText>0) { 
    									iSelectedRecordID=result.responseText;
    									TodoStore.load();
    								}
    							}
    						});
    					}
    				});
    			}
    		}],	
    		listeners: {			
    			selectionchange: function(sm, selections) { 	
    				if (selections.length==0 && iSelectedRecordID!=0) {
    					var x=TodoStore.find('id', iSelectedRecordID); 
    					if (x>=0) { 
    						Ext.getCmp("TodoGrid").getSelectionModel().select(x);
    						iSelectedRecord = TodoStore.getAt(x);
    						iSelectedRecordID = iSelectedRecord.get('id');
    					}
    				}
    			}
    		},
    		width:300,
    		minWidth: 250,split: true
    	}
    TodoStore.find('id', iSelectedRecordID) is not finding the newly added record. Always returns '-1'. Although the grid displays the newly added record.

    Please help.

  2. #2
    Sencha User jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    DC Area =)
    Posts
    16,364
    Answers
    102

    Default

    Pyramids of code like this really is not maintainable! I highly suggest against developing this way. Also, it seems that you're doing things in a way that uses globals. Don't do it.

    If you're adding one item, don't do a full store load! Just perform an add action on the server side, have that result return the object that represents a record, add that to the store and select it.

  3. #3
    Sencha User
    Join Date
    May 2012
    Posts
    3

    Default

    My grid is sorted on a column. So, adding a new record at 0 position or last might not user-friendly.
    Also, the grid has paging bar. So if I add record to the grid manually (without load), it does not update the count of records or pagination on the paging bar.

  4. #4
    Sencha User
    Join Date
    May 2012
    Posts
    3

    Default

    No suggestions so far.

    Finally I go that working with the use of Callback from store.load()

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •