PDA

View Full Version : How to get TextField value from the Grid



pokarjm@gmail.com
3 Sep 2012, 8:57 PM
I have one one Grid which contain 4 column and somewhere column contain TextField and somewhere ComboBox, I achieved this by calling renderer for particular ColumnConfig.
Each row is haveing one button with name "Save".

User can even make the changes to the content of textField and I want that textField content now, how to get it.

I am not able to get the textfield itself.
When I try to get the textfield using store.getAt(0), at that time it gives me the content of TextField which was initially and not one which user modified now.


Server Code
List<AccountResult> results = new ArrayList<AccountResult>();



for (int i = 0; i < listAccounts.size(); i++) {

Account account = listAccounts.get(i);

AccountResult accountResult=new AccountResult();
accountResult.setActionId(account.getId());
accountResult.setAccountName(account.getAccountName());
accountResult.setEmailId(account.getAccountEmail());
accountResult.setMobileNo(account.getAccountcontactNum());
accountResult.setAccountDescription(account.getAccountDesc());

results.add(accountResult);
}

Client code

ListStore<AccountResult> store = new ListStore<AccountResult>();
store.add(response.getAccountDetails());


List<ColumnConfig> configs = new ArrayList<ColumnConfig>();


ColumnConfig accountNameColumn = new ColumnConfig();
accountNameColumn.setId(AccountResult.ACCOUNT_NAME);
accountNameColumn.setHeader(Constants.VA_ACCOUNT_NAME);
accountNameColumn.setWidth(110);
accountNameColumn.setRenderer(getTextAndViewRenderer());
configs.add(accountNameColumn);




In getTextAndViewRenderer() function

accountNameTextField = getTextField(null, data, 80, Constants.VA_ACCOUNT_NAME_ID+rowIndex, Constants.VA_ACCOUNT_NAME_ID, false, false);
hp.add(accountNameTextField);


In My handleEvent for Button what should I write to get the TextField or content of it

private Listener<ButtonEvent> getActionListener(final Action action, final AccountResult result, final ListStore<AccountResult> store, final Grid<AccountResult> grid, final String property,final ColumnData config, final int rowIndex) {
return new Listener<ButtonEvent>() {


public void handleEvent(ButtonEvent be) {


}
};
}


Please help me .....Thanks

fschaeffer
3 Sep 2012, 9:09 PM
Hello,

store.getAt(0) won't give you the value of the text field, as you're requesting the *store*-Value. As the store won't be updated by using your method, this value will never change.

But anyway, you really shouldn't clutter the grid with hardcoding text fields or input areas. Please have a look at row editor [1], this will give you everything you need (storing values to store, if you're using a proper configured proxy the changes will also be automagically sent to your server) and the grid will look much better.

Also your save-buttons should be replaced by an action column [2] which also looks better..

[1] http://docs.sencha.com/ext-js/4-1/#!/api/Ext.grid.plugin.RowEditing
(http://docs.sencha.com/ext-js/4-1/#!/api/Ext.grid.plugin.RowEditing)[2] http://docs.sencha.com/ext-js/4-1/#!/api/Ext.grid.column.Action
(http://docs.sencha.com/ext-js/4-1/#!/api/Ext.grid.column.Action)
HTH

pokarjm@gmail.com
3 Sep 2012, 9:34 PM
Hi fschaeffer,

Ya, you are right, I was not aware of the feature you mention.

Let me check that.

Thanks a lot for help.

pokarjm@gmail.com
4 Sep 2012, 10:01 PM
why for column Light, data is not displayed initially, After clicking on combobox and then when I select something at that time only it starts displaying, I mean it should display like data is displayed for Role Column.

Also, I am not able to understand why data is not displayed for Account Name column, instead it is displaying some object address.

can someone please explain me the problem...


final SimpleComboBox<String> comv = new SimpleComboBox<String>();
comv.setSimpleValue("Shade");
comv.setForceSelection(true);
comv.setTriggerAction(TriggerAction.ALL);
comv.add("Shade");
comv.add("Mostly Shady");
comv.add("Sun or Shade");
comv.add("Mostly Sunny");
comv.add("Sunny");


CellEditor editor1 = new CellEditor(comv) {
@Override
public Object preProcessValue(Object value) {
if (value == null) {
return value;
}
return comv.findModel(value.toString());
}


@Override
public Object postProcessValue(Object value) {
if (value == null) {
return value;
}
return ((ModelData) value).get("value");
}
};


ColumnConfig column1 = new ColumnConfig();
column1.setId("light");
column1.setHeader("Light");
column1.setWidth(130);
column1.setEditor(editor1);
configs.add(column1);




List<RoleDTO> listRoleDto = response.getListRoleDto();
List<String> listOfRoleName = new ArrayList<String>();

for (int i = 0; i < listRoleDto.size(); i++) {
RoleDTO roleDto=listRoleDto.get(i);
listOfRoleName.add(roleDto.getRoleName());
}


final SimpleComboBox<String> combo = new SimpleComboBox<String>();
combo.setForceSelection(true);
combo.setTriggerAction(TriggerAction.ALL);
combo.add(listOfRoleName);

CellEditor editor2 = new CellEditor(combo) {
@Override
public Object preProcessValue(Object value) {

System.out.println(".preProcessValue()" +value);
if (value == null) {
return value;
}
return combo.findModel(value.toString());
}


@Override
public Object postProcessValue(Object value) {
System.out.println(".postProcessValue() "+value);
if (value == null) {
return value;
}
System.out.println(((ModelData) value).get(UserResult.ROLE_NAME));
return ((ModelData) value).get("value");
}
};


ColumnConfig statusColumn = new ColumnConfig();
statusColumn.setId(UserResult.ROLE_NAME);
// statusColumn.setRenderer(getRoleNameRenderer());
statusColumn.setEditor(editor2);
statusColumn.setWidth(140);
statusColumn.setHeader(Constants.VU_ROLE);
configs.add(statusColumn);



List<AccountDTO> listAccountDto = response.getListOfAccountDto();


List<ModelData> listModeldata=getModelData(listAccountDto);
List<String> listOfAccountName = new ArrayList<String>();

for (int i = 0; i < listAccountDto.size(); i++) {
AccountDTO accountDto=listAccountDto.get(i);
listOfAccountName.add(accountDto.getAccountName());
}


MultiSelectComboBox multiSelectComboBox = getMultiSelectComboBox(null, "123", 150, "label", listModeldata);

CellEditor editor3 = new CellEditor(multiSelectComboBox) {
@Override
public Object preProcessValue(Object value) {

System.out.println(".preProcessValue()" +value);
if (value == null) {
return value;
}
return combo.findModel(value.toString());
}


@Override
public Object postProcessValue(Object value) {
System.out.println(".postProcessValue() "+value);
if (value == null) {
return value;
}
return ((ModelData) value).get("value");
}
};




ColumnConfig typeColumn = new ColumnConfig();
typeColumn.setId(UserResult.ACCOUNT_NAME);
typeColumn.setHeader(Constants.VU_ACCOUNT_NAME);
typeColumn.setWidth(150);
typeColumn.setEditor(editor3);
// typeColumn.setRenderer(getAccountNameRenderer());
typeColumn.setAlignment(HorizontalAlignment.LEFT);
configs.add(typeColumn);