Updating dojox.grid.DataGrid - datagrid

I have a dojox.grid.DataGrid configured and I want to populate a data grid with different values when a user clicks a button.
I have tried the following code but it does not work:
var employees2 = [
{name:"Jane", department:"engineering"},
{name:"Mary", department:"engineering"},
{name:"Julie", department:"sales"}
];
console.info("grid is "+grid.toString());
employeeStore2 = new dojo.store.Memory({data:employees2, idProperty: "name"});
grid.setStore(employeeStore2);
employeeStore2.close();
I have setup the example here: http://jsfiddle.net/nonie/kx72T/
Any help would be great.

In your example, the event onclick button doesn't work....
I think in showList2 method, you should write something like this
**employeeStore2 = new dojo.store.Memory({
data: employees2,
idProperty: "name"
});
grid.setStore(dojo.data.ObjectStore({objectStore: employeeStore2}));
grid.update();**

Related

Firebase dynamic object key

So I want the key in my firebase database to be dynamically generated.
At the moment, I have something like this
whatever.$add({
title: $scope.formData.title
})
UPDATE: The whatever is actually a $firebaseArray, and yes, returns an id.
Actually, in the above example, I wanted to do something like:
whatever.$add({
$scope.formData.type: $scope.formData.title
})
I basically want the key set to something that'll come from a form. Any way?
I'm supposing that whatever is actually a $firebaseArray and if i'm right your $add will always result in a new child with random id.
If you want to create a new child with a custom id you should be working with .child().set():
var ref = new Firebase(yourFirebaseUrl);
ref.child(customId).set({
type: $scope.formData.title
});
Update:
To have the $scope.formData.title as the id you should do:
var ref = new Firebase(yourFirebaseUrl);
ref.child($scope.formData.title).set({
type: $scope.formData.title
anotherData: $scope.formData.anotherFormData
});

firebaseObject $save() replaces the content of reference

I can't make $save() work (i'm using firebaseObject)
var user = new Firebase("URL");
user.name = 'mark';
user.$save();
After this my user's all records are simply replaced by a single
name: mark
The data isn't loaded yet in your example. You'll have to wait by hooking into the firebase .on or (as it seems you're using angularfire) you can look into working with $loaded based on the reference.
var user = $firebaseObject(new Firebase("URL"));
user.$loaded().then(function(){
user.name = 'mark';
user.$save();
});
Actually, i missed the $firebaseObject in code sample above.
The problem was that my firebaseObject was not loaded yet. $loaded() fixed it. Here is the final working code:
var user = $firebaseObject(new Firebase("URL"));
user.$loaded().then(function(){
user.name = 'mark';
user.$save();
});

rebind properties in model, emberjs

I have just started to use ember.js. I have two models in my application. One that holds data and one that holds this data edited by user. I bind them using one-way binding.
App.ViewModel = Ember.Object.create({
title:'title',
text:'text',
)};
App.EditModel = Ember.Object.create({
titleBinding: Ember.Binding.oneWay('App.ViewModel.title'),
textBinding: Ember.Binding.oneWay('App.ViewModel.text'),
)};
I let a user edit the data in EditModel model. But if the user discard the changes I want to be able to set the values back to the state before editing, ie. to the values in ViewModel.
Is there a way to rebind those properties? Or to manualy rise change event on properties in ViewModel so EditModel gets updated? Or any other approach to my problem?
You could create a custom Mixin which handles the reset for a model, see http://jsfiddle.net/pangratz666/CjB4S/
App.Editable = Ember.Mixin.create({
startEditing: function() {
var propertyNames = this.get('propertyNames');
var props = this.getProperties.apply(this, propertyNames);
this.set('origProps', props);
},
reset: function() {
var props = this.get('origProps');
Ember.setProperties(this, props);
}
});
App.myModel = Ember.Object.create(App.Editable, {
propertyNames: ['title', 'text'],
title: 'le title',
text: 'le text'
});
And later in the views you just invoke the startEditing when you want to take a snapshot of the current values and reset when you want to reset to the previous snapshot of the values.

ASPxGridview - 'interrupting' row insert events

Hoping someone can point me in the right direction
Using DevExpress ASPxGridView and the Edit form.
I need to 'interrupt' the RowInserting events to warn the user if there's already a record matching their information and allow them to continue or cancel.
I've added the check (and a cancel) to the OnRowInserting event and am using customJSProperties to trigger the popup on the callback.
But I'm stuck on how to get the popups 'yes' button to resume (or restart) the Row Insert.
Is there a way of triggering the editform update event again from client side code?
Or do I need a completely different approach?
First of all, I found this article Use "yes" / "no" in edit mode for boolean value
Second of all, I hope your all rows has a unique value like ID. If so, I sugget a way like this;
Use OnRowInserting function of ASPxGridview. (Find here code examples etc.)
Check your inserting ID is already in your data store or not. (With running a query)
If in your data store or not, use XtraMessageBox like;
XtraMessageBox.Show(“Content”, “Title”, MessageBoxButtons.YesNo);
before that, add DevExpress.XtraEditors namespace. Then you can use it like;
DialogResult myDialogResult;
myDialogResult = XtraMessageBox.Show("Content", "Title", MessageBoxButtons.YesNo);
if (myDialogResult == DialogResult.Yes)
{
//yes was clicked
}
if (myDialogResult == DialogResult.No)
{
//no was clicked
}
Hope it gives you an idea. And If you have Devexpress Licence, you can ask in Devexpress Support. They are really quick and helpful.
You can solve this with custom HttpHandler. Something like this:
press Save button on your edit form
Save initiates httphandler call (from javascript) with data needed for validation (tablename, id). With jquery you can call http handler like this:
if handler returns true continue with save, otherwise show alert with OK/Cancel
if user chooses OK continue with Save
Javascript call with http handler would look like this:
$.ajax({
async: false,
cache: false,
url: 'YourHttpHandler.ashx',
data: { tableName: "your table name", record_id: your_id },
success:
function (data, textStatus, xmlHttpRequest)
{
if(data.result==true)
if(confirm('Continue?'))
{
// continue with save
}
}
});

Using JQuery to set 'dirty' elements back to original values

I have a Javascript object that basically represents a Row in an .NET GridView.
When a user clicks on any row in the grid, all the input elements in that row are 'enabled'.(ie 'Edit' mode).
I run this code depending on which row is selected
$(":input", this._row).attr('disabled', true);
or
$(":input", this._row).removeAttr('disabled');
So far so good. Now, I want to keep track of the values in that row before a user enters the 'Edit Mode', so i can restore the original values if they decide to click out of that row without saving any changes that they made.
So i capture the original values in an array by doing this:
var $inputs = $(":input", this._row);
var values = {};
$inputs.each(function(i, el) { values[el.name] = $(el).val(); });
the 'values' array now looks like this:
ctl00$ContentPlaceHolder1$resultsGrid$ctl04$COMPONENT1 "56"
ctl00$ContentPlaceHolder1$resultsGrid$ctl04$COMPONENT2 "98"
ctl00$ContentPlaceHolder1$resultsGrid$ctl04$COMPONENT3 "08"
ctl00$ContentPlaceHolder1$resultsGrid$ctl04$COMPONENT4 "200"
Great so far. The user may then modify these values, but decide not to save the changes.
So i need to restore this row back to it's orignal values from the 'values' array.
Can someone tell me the best way to do this? Im hoping it's something simple, but i'm no jquery expert, yet..
thanks
You can use the 'data method' (http://docs.jquery.com/Internals/jQuery.data) to store relevant data along with the element.
Something like:
//Call this function for each row after the page has loaded.
function storeOriginalData(row)
{
var $inputs = $(":input", row);
//For each input element inside the table row, we store it's original value
//using the 'data' method of jQuery.
$inputs.each(function(i, el) { $(el).data('oldValue', el.val()); });
}
//Call this function from the reset button code.
function resetOriginalData(row)
{
var $inputs = $(":input", row);
//Now we get the original value using the data method and store it in the input element.
$inputs.each(function(i, el) { $(el).val($el.data('oldValue'));
};
This way, you will avoid the maintenance of the 'values' object for each row.
EDIT:
Modified code with more details and how it works.
I haven't had the time to set up a test, but off of the top of my head I would try:
$inputs.each(function(i, el){ $(el).val(values[el.name]); });
Assuming you have already checked that values have been stored.
Could you not copy the row html and store it, and then if they changed there mind you could just restore the original row?

Resources