I am trying to edit and save the PreliminaryEstimate Value of a portfolio item through Estimation Board but it reset it back to the original value. I am using PreliminaryEstimateValue in the board but when the card is moved, i reset the PreliminaryEstimate to new column value.
var store = Ext.create('Rally.data.wsapi.Store', {
model: 'PreliminaryEstimate',
fetch: ['ObjectID','ObjectUUID','VersionId','Description','Name','Value','CreationDate','Subscription','Workspace','RevisionHistory'],
autoLoad: false,
limit: Infinity,
disableMetaChangeEvent: true
});
beforecarddroppedsave: function (scope, card, type, sourceColumn, eOpts) {
card.record.data.PreliminaryEstimate = _.omit(_.filter(this.preliminaryEstimateStore.getRange(), function (pe) { return pe.data.Value === card.record.data.PreliminaryEstimateValue })[0]
.data, ['Summary', 'creatable', 'deletable', 'updatable', '_CreatedAt', '_objectVersion', '_uuidRef']);
the options also has the new value. It saves succesfully but the old value does not change to new
handleBeforeCardDroppedSave: function (options) {
options.record.save({})
Thanks!
If you inspect the network traffic is it actually sending that value over the wire? I'd try using the setter method rather than directly manipulating the data object. My guess is that the record does not think it has any changes to save with the way your current code is written.
card.record.set('PreliminaryEstimate', '/preliminaryestimatevalue/12345');
Related
While creating a Vue.js application I have become stuck at a weird problem. I want to be able to manipulate an input field (think increment and decrement buttons and erasing a zero value on focus, so the user doesn't have to) and up until a user writes to the input field, everything is fine. After that, however, further changes in the data are no longer represented in the input field.
As I was sure I could not be the only one with this particular problem, I searched extensively, but had no luck. What baffles me the most is that everything works until the field is written to, since I can not really imagine why this would remove the data binding.
The following code should show the same behavior. It is an input field component, which is initialized with a zero value. On focus the zero gets removed. This works, until a user manually writes to the field after which zero values will no longer be removed, even though the focus method fires, the if-condition is met and the data in the amount-variable is changed.
Vue.component('item', {
data: function () {
return {
amount: 0
}
},
render: function (createElement) {
var self = this;
return createElement('input', {
attrs: {
//bind data to field
value: self.amount,
type: 'number'
},
on: {
//update data on input
input: function (event) {
self.amount = event.target.value;
},
//remove a zero value on focus for user convenience
focus: function (event) {
if (self.amount == 0 || self.amount == "0") {
self.amount = '';
}
}
}
})
}
})
I think you need to use domProps instead of attrs to make it reactive. But I would suggest you use vue's template syntax or if you insist on using the render function I would also suggest you to use JSX.
I've got some form data that I display using a readonly input that is styled to look like plain text. When users click an edit button, they can then edit the inputs and either save or cancel.
My issue is obviously that when a user clicks cancel, the data they entered into the input remains (even though it isn't saved to the DB). I'm trying to figure out a way to reset the input to its initial data. I'm aware of this answer, but it doesn't seem to work because the data is fetched on creation.
This fiddle is similar except for the fact that the data in the real app comes from an axios call. The equivalent call is essentially:
fetch() {
axios.get(this.endpoint)
.then(({data}) => {
this.name = data.data;
});
}
Annoyingly, the fiddle actually works. However in my actual implementation it doesn't. The only difference with the app is that the data is an array.
How can I make this work?
This fiddle represents what my code actually does.
In the code:
data: () => ({
endpoint: 'https://reqres.in/api/users',
users: [],
initialData: []
}),
//...
edit: function(index) {
this.users[index].disabled = false
this.initialData = this.users
},
reset: function(index) {
this.users[index].disabled = true
this.users = this.initialData
}
Since users and initialData are arrays, you must use index when you access them.
So, at first sight, the change would be from:
this.initialData = this.users
To
this.initialData[index] = this.users[index]
But this won't work. Since this.users[index] is an object, whenever you change it, it will change what this.initialData[index] holds, since they are both just pointing to the same object. Another problem is that when you set it like that, the initialData won't be reactive, so you must use Vue.set().
Another thing, since you just want to reset the first_name property (the one you use at <input v-model="user.first_name" >), you should then assign user[].first_name to initialData[index].
Considering those changes to edit(), in the reset() method, the addition of [index] and of the .first_name field are enough. Final code:
edit: function(index) {
this.users[index].disabled = false
Vue.set(this.initialData, index, this.users[index].first_name);
},
reset: function(index) {
this.users[index].disabled = true
this.users[index].first_name = this.initialData[index]
}
JSFiddle: https://jsfiddle.net/acdcjunior/z60etaqf/28/
Note: If you want to back up the whole user (not just first_name) you will have to clone it. An change the order of the disabled property:
edit: function(index) {
Vue.set(this.initialData, index, {...this.users[index]});
this.users[index].disabled = false
},
reset: function(index) {
Vue.set(this.users, index, this.initialData[index]);
}
JSFiddle here. In the example above the clone is created using the spread syntax.
Input is immediately updating the model. If you want to do something like edit and save you have to take a copy and edit that. I use lodash clone to copy objects then update the fields back when save is clicked. (of course sending message to server.)
I have a Dojo combobox declaratively created using a standard HTML select. There is an onChange event on a separate textbox that invokes a function to get data from a server via XHR and elements of the response data become new options for the drop down.
I've been trying examples across the internet but nothing so far has worked. This is the code I'm currently trying with no errors. In fact, when I look at the contents of the store after the put, the data is in there.
When I click on the drop down after the data has been set, I get the error "_AutoCompleterMixin.js.uncompressed.js:557 Uncaught TypeError: Cannot read property 'toString' of undefined":
var newOptions = new Array();
for (var i = 0; i < jsonData.length; i++) {
newOptions[i] = { value: jsonData[i].dataID,
label: jsonData[i].dataName,
selected: i == 0};
}
var select = registry.byId("combobox");
select.store.put(newOptions, { overwrite: true });
And also "select.store.data = newOptions;".
And also moving the code around so "select.store.add(option)" is within the loop.
Though the combobox store is being populated in all three cases, I continue get the same error. There are no null values in the data. There are no blank values in the data.
What am I missing? No example anywhere, within the DOJO docs or anywhere else has this problem, even working jsFiddle examples.
I simply cannot see what the difference is other than the fact I'm adding more than one or two hard-coded values.
It takes:
newOptions[i] = { id: jsonData[i].dataID,
name: jsonData[i].dataName,
selected: i == 0};
not
newOptions[i] = { value: jsonData[i].dataID,
label: jsonData[i].dataName,
selected: i == 0};
I am using extjs 4.1.1a for developing some application.
I had a form consisting of two combo-boxes and an item-selector.
Based on the value selected in first combo-box , the itemselector will load its data from database. This is working fine.
My problem is, if i reselect the first combo-box the new data will be displayed in itemselector along with previous data displayed in itemseletor .That is previous data displayed in itemselector will remain there itself.
for example: name "test1" consists of ids 801,2088,5000. on selecting test1 in firstcombobox itemselector must show output as below.
and if "test2" consists of ids 6090,5040. on selecting test2 in firstcombobox itemselector must show output as below.
problem is. for first time if i select "test1" from firstcombobox , output will come as expected. if i reselect "test2" from firstcombobox , output will come as below.
as you can see, previous data displayed (marked in red rectagle) remains there itself with new data displayed (marked with green rectangle).
I want for every reselection of first combobox, previously displayed data in itemselector to be erased before printing new data on itemselector.
How can I reset the itemselector for every reselection of first combobox?
You should remove all items from the store of the itemselector by the removeAll command. After that you should load the store of the itemselector.
itemselector.store.removeAll();
itemselector.store.load();
Any solutions above solve my problem.
i found solution from Sencha Forum.
https://www.sencha.com/forum/showthread.php?142276-closed-Ext-JS-4.0.2a-itemselector-not-reloading-the-store
in the itemselector.js file, change the line marked below.
populateFromStore: function(store) {
var fromStore = this.fromField.store;
// Flag set when the fromStore has been loaded
this.fromStorePopulated = true;
// THIS LINE BELOW MUST BE CHANGED!!!!!!!!!!!!
fromStore.loadData(store.getRange()); //fromStore.add(store.getRange());
// setValue waits for the from Store to be loaded
fromStore.fireEvent('load', fromStore);
},
You need to insert...
this.reset();
at the head of the function that is inserting the data.
As an example...
Ext.override( Ext.ux.ItemSelector, {
setValue: function(val) {
this.reset();
if (!val) return;
val = val instanceof Array ? val : val.split(this.delimiter);
var rec, i, id;
for (i = 0; i < val.length; i++) {
var vf = this.fromMultiselect.valueField;
id = val[i];
idx = this.toMultiselect.view.store.findBy(function(record){
return record.data[vf] == id;
});
if (idx != -1) continue;
idx = this.fromMultiselect.view.store.findBy(function(record){
return record.data[vf] == id;
});
rec = this.fromMultiselect.view.store.getAt(idx);
if (rec) {
this.toMultiselect.view.store.add(rec);
this.fromMultiselect.view.store.remove(rec);
}
}
}
});
are u got it?
when u select that combobox frist stoe of item selector is null after store load with ur pass the para meters
for example
store.load(null),
store.proxey.url='jso.php?id='+combobox.getrawvalue(),
store.load();
like that so when ur select a value in ur combobox that time ur used a listeners to ur combobox in that listners ur used above code , select ur some value in combobox that time frist store is get null after ur pass some values to json.php then store load with responce so that time old data is remove and new data load in that store
if u post ur code i will give correct code
I ran into the same issue with ExtJS 4.2.1. I got it to work by calling reload() on the data store and then setValue() with an empty string on the item selector in the data store's reload() callback.
Ext.create("Ext.form.field.ComboBox", {
// Other properties removed for brevity
listeners: {
change: function(field, newValue, oldValue, eOpts) {
Ext.getStore("ExampleStore").reload({
callback: function() {
Ext.getCmp("ExampleItemSelector").setValue("");
}
});
}
}
});
Ext.create("Ext.data.Store", {
storeId: "ExampleStore",
// Other properties removed for brevity
});
Ext.create("Ext.form.FormPanel", {
// Other properties removed for brevity
items:[{
xtype: "itemselector",
id: "ExampleItemSelector",
// Other properties removed for brevity
}]
});
For any folks that are curious, I'm fairly convinced there's a bug in the item selector's populateFromStore() function. When the function is called, it blindly adds all of the values from the bound store (store) to the internal store (fromStore). I suspect there should be a call to fromStore.removeAll() prior to the call to fromStore.add(). Here's the relevant code from ItemSelector.js.
populateFromStore: function(store) {
var fromStore = this.fromField.store;
// Flag set when the fromStore has been loaded
this.fromStorePopulated = true;
fromStore.add(store.getRange());
// setValue waits for the from Store to be loaded
fromStore.fireEvent('load', fromStore);
},
EDIT 12/18/2013
If you've configured any callback events on the item selector (e.g. change), you may want to disable the events temporarily when you call setValue(""). For example:
var selector = Ext.getCmp("ExampleItemSelector");
selector.suspendEvents();
selector.setValue("");
selector.resumeEvents();
I had the same problem and finally I decided to modify the extjs source code, not considering it a big issue as extjs itself its saying in the start of the file
Note that this control will most likely remain as an example, and not as a core Ext form
control. However, the API will be changing in a future release and so should not yet be
treated as a final, stable API at this time.
Based on that, as jstricker guessed (and sadly I didn't read and took me a while to arrive to the same conclusion), adding fromStore.removeAll() before fromStore.add() solves the problem.
Outside of the problem (but I think it can be interesting as well), additionally, I also added listConfig: me.listConfig in the MultiSelect configuration (inside createList), that way it's possible to format each item additional options (such as images, etc.) setting in the 'itemselector' the option listConfig as it's explained in the (irrealistic) documentation.
Need to reset the store used in ItemSelector that can be done by setting Empty object like below. Also need to call clearValue() method of ItemSelector component.
store.setData({});
ItemSelectorComponent.clearValue();
I have FilteringSelect using a MemoryStore. When a user types a value that is not in the store, they are prompted, asking if they would like to add the new value to the store.
If they do, we call the server, create the new item, and on the response, we publish an event.
The topic subscriber is notified that a new item was created and added to the MemoryStore, which adds the option to the filteringselect.
At this point, the filtering select still has the same displayValue, and the option exists in the select. FilteringSelect.get("value") still returns "".
If you were to type a space, then hit backspace, (ending up with the same value), FilteringSelect.get("value") would return the correct item id.
FilteringSelect.set("value", data[0].id) doesn't do anything, no exception thrown, no affect.
Here's the code, contains some of the random calls I tried.
require(["dojo/store/Memory", "dojo/_base/array", "dojo/topic"],
lang.hitch(this, function(Memory, array, topic) {
this.liftStore = new Memory({
data: []
});
array.forEach(data, lang.hitch(this, function(entry, i) {
this.liftStore.data.push({
name: entry.Name,
id: entry.ID,
identifier: entry.ID
});
}));
this.lift.set("store", this.liftStore);
topic.subscribe("LiftLog/NewLift", lang.hitch(this, function(data) {
debugger;
data[0].selected = true;
data[0].identifier = data[0].id;
this.liftStore.data.push(data[0]);
this.lift.reset();
this.lift.set("value", data[0].id);
this.lift.set("value", data[0].id.toString());
}));
}));
Have you tried setting the item (i.e. filteringSelect.set("item", newItem) instead of setting the value? Note that you should give it the whole item, not just the id or the displayed value.
So, push the item into the store, and then set the item on the FilteringSelect:
this.liftStore.data.push(newItem);
this.lift.set("item", newItem);