I have been using extjs for only 3 days now so I am very new and am trying to get used to some of the concepts.
I have a view called GroupListView which contains multiple GroupViews. Each group view needs to instantiate a ContactStore and invoke an ajax call with the groupId to get all the contacts in that group. So, I thought I can put a var contactStore = Ext.Create('MyApp.store.ContactStore'); in to the initComponent of the GroupView component (remember I don't want a singleton - each group has its own contact data).
It throws an "Uncaught TypeError: Cannot read property 'apply' of undefined" error when I do that. If you remove that line things are fine but obviously I have no contact data.
https://fiddle.sencha.com/#fiddle/5gv
What am I doing wrong? And once I get this working, what is the best practice to get the groupId from the GroupView in the example (so I can pass it in the ajax call to the restful service)? Is it to set a local property, like I do, called groupData in the GroupStore load loop I have? Is there a better way to automatically create a GroupView components for all the items in the GroupStore, like a repeater kind of thing, rather than my manual loop?
If you can kindly just give me a general "yes - you're on the right path" or "no you're doing things not the extjs way" I'd appreciate it. Yes - I realize I am missing controllers :)
Thanks
Related
Just started out using angular.js and implemented a directive that reads from a property in the scope that's defined only when a button is clicked. The UI looks fine also because the directive part is only shown when the button is clicked. However in the console when the page is first loaded there is an error message saying "Cannot read property someProperty of undefined".
I must be violating some angular principles but I'm not sure how to fix it. Thanks for the help!
Note: Didn't do a fiddle because this is a general question.
Generally speaking, if you have code patten like
$scope.myObject.property
then you could see the error when myObject is undefined.
One possible way to eliminate the error the code work is make sure the object is always initialized when any property is intended to be referred.
You can put this line before the property is referred.
$scope.myObject = {};
Or do
if($scope.myObject !== undefined){
...
}
There is no rocket science here.
I am on way to learning backbonejs.
I am working with the popular todo list tutorial.
I have certain questions about which i am a bit confused:
In one the models i found this function:
toggle: function() { this.save({completed: !this.get(’completed’)});}
The thing that i don't understand is this.save function. How does it work? What does it actually saves and where. And what does the code inside this function means: completed: !this.get and so on.
In one of the views i found this line of code:
this.input = this.$(’#new-todo’);
Now what does this.input means? And i also don't understand the sytnax this.$('#new-todo');
Let me know if more code is needed for comprehension. Also if anyone could point me to great learning resources for backbone, it will be awesome. Currently i am learning from 'Backbone Fundamentals' by addyosmani.
Backbone Model and Collection both have url properties.
When set properly backbone will make a HTTP POST request with the model as a payload to the url when saved for the first time (id property has not peen set). I you call save and the models id has been already set, backbone will by default make PUT request to the url. Models fetch function generates a GET request and delete a DELETE request.
This is how backbone is made to work with RESTfull JSON interfaces.
When saving a model you can define the actual model to save like it's done in the example.
Read the Backbone.js documentation. It's ok!
http://backbonejs.org/#View-dollar
this.$('#new-todo') // this.$el.find('#new-todo')
toggle: function() { this.save({completed: !this.get(’completed’)});}
Its basically saving inverse value to "completed" attribute of model. so if model's current attribute is true, it would save it to false !
regarding this.input = this.$(’#new-todo’);
Its basically saving/caching DOM with id "new-todo" from current VIEW's 'el' to view instance's 'input' property. so that we do not have to call jQuery methods for getting the same element when we need in future.
hope this helps.
:)
I too am a backbone newbie and i had been in search of good tutorials that gave good insights into the basics and i found after around 3-4 days of searching. Go through backbonetutorials.com and there is a video compiled which gives exactly what we need to know about Routers, Collections, Views and Models.
The sample working can be found at : http://backbonetutorials.com/videos/beginner/
Although this tutorial is a very basic one, you need to have basic jquery, javascript knowledge. Keep http://www.jquery.com opened in another tab as well when you go through the sample codes. Documentation is extremely useful.
Once you have good knowledge of jquery then if you go through the tutorials, you will understand and pick it up a lot better. And once you get hold of the MV* pattern of backbone you'll love it.
p.s : Do not copy paste codes or functions if you need to learn, type them.!!..
Cheers
Roy
toggle: function() { this.save({completed: !this.get(’completed’)});}
Backbone Model have a url property, when you set a property backbone makes a HTTP request to that url to save that value to the data source.
Here it is setting the value of "completed" attribute with inverse of earlier "completed" value, which will be saved to the data source
I am currently working in a controller called Content. In this controller, I have a function that will be called when someone goes on to the homepage, and most of the data will be pulled from the Content model.
However, I want to display data from another model called Phones. When I type this code:
$phones = $this->Phone->find('all');
I get the following error:
Fatal error: Call to a member function find() on a non-object
When I change the Phone part of the PHP code to Content it works fine. So I'm guessing that I can't, at the moment, access the Phone model from inside the Content controller.
Is there a way to achieve a way of accessing a model externally from a controller?
$this->loadModel('Phone'); # Important: singular!!!
$this->set('phones', $this->Phone->find('all'));
try with below
$this->loadModel('Phone');
$this->set('phones', $this->Phone->find('all'));
cheers
The following function in MerryParent model returns $merry_parent_id or empty string if it is not able to find any. If it is going to return an empty string, i want to stop that and display an error message in the model itself instead of creating an if then else stmt in controller and displaying the error message there. How can I do that?
I don't know on how to display error msgs in model function. In controller I know that I can use $this->Session->setFlash('my error msg'). But that doesn't work here.
By the way, i'm trying to abide by 'fat model thin controller approach'. :)
class MerryParent extends AppModel{
//relationships are displayed here
//form field validations are displayed here
function getMerryParentId($email){
$merry_parent_id=$this->field('id',array('MerryParent.email'=>$email));
return $merry_parent_id;
/*instead as return $merry_parent_id, I want
if ($merry_parent_id!='')
return $merry_parent_id;
else
//display error message here.
}
}
thank you.
You shouldn't be displaying errors via the model. If you want to display something just for testing purposes, you can debug() it in the model...etc, but in general, you should use the normal MVC structure, and use the model to retrieve the data, use the controller to process it, and the view to display it.
The "Fat model / Skinny controller" thing is great to follow as a guideline, but when you follow it too far and stop following the more-important MVC structure, it's not a good thing. It's not meant to be "Fat model / Empty controller". :)
My model has a url property defined.
However, when I try to call fetch or save on it, I get the error:
TypeError: Cannot call method 'ajax' of undefined
Any solutions are appreciated.
My backend is only a simple RESTful interface.
You have forgoten to add jquery or zepto.js to your side. Backbone tries to call $.ajax(params); and $ is undefined.
You can do this by including jquery or zepto, but you must remember to include one of these before backbone. The other solution that doesn't force your files to be ordered is to call setDomLibrary at document ready:
Backbone.setDomLibrary(jQuery);
This will bind Backbone to the dom library of your choice.