If I save my code..
attrs =
attr1: 1
attr2: 2
attr3: 3
#question.save(attrs)
I have this in my backbone model:
url: '/questions'
paramRoot: 'question'
It will send to my server these params :
{question: {attr1: 1, attr2: 2} } # Note how it skips attr3
I am very specifically trying to update attributes that both do not exist in my original model but can be saved as such, and equally not save other attributes that are already instantiated with the object.
In javascript, you'd do something like:
var QuestionModel = Backbone.Model.extend({
urlRoot = "/questions"
});
question = new QuestionModel();
question.set('attr1', 1);
question.set('attr2', 2);
question.set('attr3', 3);
question.save();
Or you can save and add the attributes at once:
question.save({
attr1: 1,
attr2: 2,
attr3: 3
});
Related
The backbone getByCid is not working when i viewed in console.log it showing the error as TypeError: test.getByCid is not a function. By using at(0).cid it shows the output as 'c1' why its not working.
var test=new Backbone.Collection([
{name:'gowtham',age:10}
]);
console.log(test.at(0).cid); // output as c1
console.log(JSON.stringify(test.getByCid('c1'))); //TypeError: test.getByCid is not a function
the Backbone.Collection does not have method getByCid, thats why you are getting this error.
But a collection has get method for getting a model.
it accepts one argument: model | id | cid
So if you want to get a model by cid, you can do it like this collection.get(cidValue)
let collection = new Backbone.Collection();
let test1 = new Backbone.Model({ id: 1, value: 'first' });
let test2 = new Backbone.Model({ id: 2, value: 'second' });
collection.add([test1, test2]);
console.log(collection.get(2));
// find test2 by id
console.log(collection.get('c2'));
// find test2 by cid
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.3.3/backbone.js"></script>
i have created angular directive which replace string value
applabel directive:
app.directive('applabel',function(){
return{
templateurl:'label.html',
restrict: 'E',
replace: true,
scope:{
'key' : '#',
'default' : '#'
},
link : function(scope,elem,attr){
var data = [{key: Id , value:"ID"},
{ key: name, value: "Name"},
{ key: sts, value: "status"} ];
var keyVal = scope.key;
for(var i = 0;i < data.length ; i++)
{
if(keyVal = data.length[i].key)
{
scope.value = data.length[i].value;
}
else {
scope.value = scope.default;
}
}
}
}
});
my html code is
<applabel key="name" default="Default Name">
</applabel>
label.html
<label>{{value}}</label>
output will be: Name
this code works properly
but the problem i don't want for loop in my code because in data array there is too much data and i am using multiple times this 'applabel' directive in my page so that it takes to much time
any solution that without looping my value is replaced
thanks in advance
If you have data as array the only way to find some data is iterate over, if you want to not iterate you could keep data as hash map( JS Object)
I find underscorejs to be a very useful library to include in my projects. With it you can use one of a few functions to get what you are looking for. One would be _.find
var result = _.find(data, function(x){ return x.key === scope.key; });
scope.value = result.value;
If you can modify the data, you can use an object instead of an array. This way accessing a value is done in constant time
app.directive('applabel',function(){
return{
templateurl:'label.html',
restrict: 'E',
replace: true,
scope:{
'key' : '#',
'default' : '#'
},
link : function(scope,elem,attr){
var data = {Id:{value:"ID"},
name: {value: "Name"},
sts:{ value: "status"} };
var keyVal = scope.key;
scope.value=typeof data[keyVal] !=="undefined" ? data[keyVal].value : scope.default;
}
}
}
});
If you don't need to add more informations to the object you can do
var data = {Id:"ID", name:"Name", sts:"status"};
var keyVal = scope.key;
scope.value=typeof data[keyVal] !=="undefined" ? data[keyVal] : scope.default
This code has several errors, but I guess this is irrelevant.
Instead of using an array of objects each having a key and value fields, use a single object:
{
Id: 'ID',
name: 'Name',
sts: 'status
}
and then simply use
scope.value = data[scope.key] || scope.default;
Another thing that you should do is define the data out of the link function: there is no way to recreate a whole new array/object every time the directive is used.
I have an employee model who has address model with 1-1 relationship. I would like to let Employee model know if some change occurs in Address which in turn is being listened by view.
var Employee = Backbone.AssociatedModel.extend({
relations: [
{
type: Backbone.One, //nature of the relationship
key: 'manager', // attribute of Employee
relatedModel: 'Manager' //AssociatedModel for attribute key
}
],
defaults: {
age : 0,
fname : "",
lname : "",
manager : null
}
});
var Manager = Backbone.AssociatedModel.extend({
});
var EmployeeView = Backbone.View.extend({
initialize: function(){
this.model = new Employee();
this.listenTo(this.model, 'nested-change', this.render);
}
});
'nested-change' does not work when some change happens to Manager. Please help.
Try to set Backbone.Associations.EVENTS_NC = true;
They have changed the default behavior in version 0.6.0
I am using Ext JS 3.2. I have a grid. Now I want to customize my existing grid. I want to add hardcoded value as row0, But its not working
Below is my code
My store
var store = new Ext.data.Store({
id : 'user',
proxy : proxy,
reader : reader,
writer : writer, // <-- plug a DataWriter into the store
url: 'cat/view.action?catid='+catid_para+'&teaid='+teaid_para+'&flag='+0,
remoteSort: true,
remoteSort: true,
autoSave : false,
// <-- false would delay executing create, update, destroy
// requests until specifically told to do so with some [save]
// buton.
});
var record = new SiteUtility({
id:'0',
fname:'4',
lname:'3444',
attandance: 'G',
});
var parent_grid=Ext.getCmp('org_grid');
parent_grid.getStore().insert(0,record);
// store.save();
//parent_grid.getView().refresh();
store.load({params:{start:0, limit:10}});
Thanks
try this:
store.load({params:{start:0, limit:10}, callback: function(){
var record = new SiteUtility({
id:'0',
fname:'4',
lname:'3444',
attandance: 'G'
});
store.insert(0,record);
}});
Here you can see how to do that. You need to get the recordType first and create new Record:
var recordType = store.recordType;
var nullRecord = new recordType({
id: '1',
name: "4",
lname: "4",
age: "2",
remarks:"Remarks"
}, null);
store.insert(0, nullRecord);
You can take a look at the Ext Docs.
I wish to create a combobox that loads a store, but also want to add a few predefined data on it. Is it possible?
I think this is what you need:
Ext.define('App.widget.MyCombo', {
extend : 'Ext.form.field.ComboBox',
displayField: '...',
valueField : '...',
name : '...',
alias : 'widget.mycombo',
fieldLabel : 'My Custom combo',
initComponent: function() {
var me = this;
me.store = Ext.create('Ext.data.Store', {
model : '...',
proxy : {
type : '...',
reader: '...'
}
});
/*After data is loaded append some predefined records.*/
me.store.on('load', function() {
/*Indicates that data must be appended to already loaded data.*/
var append = true;
me.store.loadData([{id : -1, value : 'Default'},
{id: -2, value: 'Second Default'}], append);
});
me.callParent();
}
});
If your store is a list, then you can simply append your items to the list after it is generated at the index you specify.
You can also get the store from the combobox, and then use add() at the index your specify.
As Brian Said, you can "insert" it at the index you specify. When you use "add", it basically appends it to the end of the store.
Here is the signature of the insert function:
insert( Number index, Ext.data.Model[] records )