I need to update the form field value using javascript as below:
var frmRec = App.frmEdit.getRecord();
frmRec.set('CallingName', 'Tesing calling name');
When I check the form data via the console, I can see the calling name field is updated:
console.log('rec: ', App.frmEdit.getRecord());
But the textfield in the form is not updated, old values still show up in the form. How can I "refresh" the value of the TextField in this case ?
Thanks in advance
If your data binding is setup correctly there is no need to refresh anything. The Extjs form supports two-way binding change to the record would be reflected in the text field and any change to the text field would be updated in the record.
two way binding example
The kitchen sink examples have lots of data binding examples.
Related
I have the need to create the custom form field which need to works like TemplateColumn in gridPanel.
This custom form field will render multiple field in data model using the provided template just like TemplateColumn.
Since i only want to display data using this custom form field in the form panel so i try to extend the display field, but it only accept 1 data field in the model.
How could I make the custom form field accept value from 2 or more data field in model.
Thanks in advance.
you can bind to several fields and also included text
bind: {
value: "{rec.field1} - static text -> {rec.field2}"
}
feel free to add a fiddle to show what you want to do if this is not correct.
I'm using a property grid with editors set in sourceConfig. I want only some rows to be editable and not all. Returning false in beforeedit disables all. The reason is, I have a button in a grid. When I click the button, the grid turns to a textfield! Any way to do this?
The beforeedit event should provide you with the editor and the editing context. Lets say your callback function looks like this:
function(editor,context) { ... }
Using the context you will get the record which get edited by accessing context.record while the editor can provide you with the editor form from where you have access to all rendered fields within that form. To get the form you have to get the editor first and after that you can fetch the form
var form = editor.getEditor().getForm()
This way you can be sure that the editor has been set up. To get a field within that form simply call
form.findField('fieldname') // fieldname is the dataIndex of the column
You can now do nearly anything based on your conditions.
In addition the record is also loaded into this form an can be accessed by calling form.getRecord()
We have a rowediting plugin on grid where a button of one trigger field changes some other values of the record (we are loading some remote data which get applied to the record). The values that get changed in background are most commonly not editable, so they are just rendered. Basically the remote loading of the data works fine, meaning the record get changed and all data get save but we have the following problems:
1.The rowediting plugin does not show the changes that where applied to the record fields
2.Setting the changes via record.set() cause the store to sync immediately and not on clicking the "save" button of the editor.
So how can we make the editor to show the changes applied in the background and how can we apply these changes in a way so that they get saved along with the other edited fields.
Thanks in advance for any help!
This should not be that complicated, you just need a reference to your active editor instance. You can then either
reload the record into the form by calling loadRecord() again. But note that this may overwrite any changes that where made by now within the editor
or (for the second way I expecting the values to be exactly the same as in the record in manner of key:value definition - short: no special mapping is required)
apply the new data to the record by calling either set (note that this will trigger sync if you have autoSync turned on) or by using Ext.apply(recinstance.data,newvalues) and editorinstance.getForm().setValues(newValues)
I have an LOV added to my view object which updates 6 fields - done all through the LOV wizard in JDeveloper. It works perfectly fine when test running the application module - all fields update with the proper values after selecting a value from the LOV. However in my JSPX form, the only the field that gets updated is the one that the LOV is attached or is initiated on.
On my form, i only display 2 out of the 6 fields - the field which initiates the LOV and another editable field that the LOV is supposed to update. The part where this gets interesting is that the 4 other fields in my view object that i dont put in my form, are updated successfully by the LOV! But the one additional editable field that i left in my form, isnt updated.
Why is that?
I could just write a method in my View object Row Implementation class to update that editable field manually, but i feel like theres something more straight forward via declarative approach.
Thank you!
Fixed!
I needed to update two settings on my 2nd field of the form.
Removed the default bindings on the "Required" attribute and set it to "false".
Set "ShowRequired" to true
After that, I saved my changes and re-ran my application and the field updated properly!
I hope others find this helpful!
I have a requirement to create a custom form field that is basically an extjs grid. The user should be able to click a result in the grid. This clicked result should then become the fields value. Also, this field needs to extend Ext.form.field. Here's what I got:
Ext.define('MyApp.field.Grid', {
alias: 'widget.GriedField',
extend: 'Ext.form.field.Base',
I'm a lot of confused on how to add a grid to form field base. Looks like form field base's template expects HTML. How do I get it accept a component?
If you just need to select a value from a list of items. Why not use a combobox?
If you need to select multiple items. There is an example of how to use the MultiSelect ux component in the documentation examples.
http://docs.sencha.com/ext-js/4-1/#!/example/multiselect/multiselect-demo.html
If you really must use a grid. Then I wouldn't bother with trying to create a field type and cause yourself grief.
Add a listener to your grids selectionchange event and update a hidden field in your form with the value you want from the grid. Job done.
I ended up putting the grid on a form indirectly through creation of dependencies on my model.
My model has master-detail, which the detail is just a store reference. I found that using associations did not work for me.
So, in adding a field to a form, I have something that manages changed events for the model (master record) and the detail stores.