Before beginning this article, I must say that I’m not a javascript expert. In fact, I’m a newbie javascript developer, so these tips I’m giving are not going be the best one. Thus, if someone wants to tell me that something is not correct or could be done in a better way, you could always tell me and we all will learn more .
So, first of all, why am I doing this? I’m developing a simple webapp to sell cars. It’s the simplest projects among all that I’m involved now, but it has some interesting things. I hope, when the project is released, I’ll be open-sourcing some of its components.
One of the things I had to do was to reuse some lists but with a different item layout. For example, when displaying cars to all the viewers, they’ll have some data, and when it’s displayed to the admin, it must contains some buttons to edit, delete or send emails for the clients.
I decided to use Backbone.js because It’s one of the best javascript MVC frameworks out there. You can find some good tutorials here and here to get started with Backbone.
What’s the difference between the two lists? Both will use tables to display the data, but one of them will have a different layout and will display a header… the other no. Furthermore, the non-admin view will show a filter view, which is not working now.
Now, it’s time to see some code. To declare all the Backbone.js variables I will use the following structure in the file cars.js:
Now that you know which structure we’ll use, we’ll define the two item views. First, let’s define the regular item view:
Interesting idea,
I too, would use templating engines for the html part,
but I like the implementation of the other parts
I will definitely try this out.
Hi, greetings from Malaga. It’s nice to meet someone so ‘physically’ near me writing about backbone
I’ve read your article. It’s very nice. But I have a doubt:
- You write this.$el.html(this.template(this.model));
- Shoudn’t it be this.model.toJSON()?
Thanks! I hope you’ve enjoyed the article, and answering your doubt: I haven’t test it but I think they’re both valid. In fact, a JSON object it’s just a “string” representation of a Javascript Object.
Before answering you I would have told you that I’m not a Javacript expert. I just use it one I have to, but I hope this helps, and you can try it and tell me if that’s correct!
.
CoffeeScript heredocs provide a really nice way to embed templates in your Views, if that’s what you want to do.
There is a an example about 1/3 of the way through this tutorial: http://www.scriptybooks.com/books/backbone-coffeescript/chapters/quick-tour
Interesting idea,
I too, would use templating engines for the html part,
but I like the implementation of the other parts
I will definitely try this out.
thanks
Thanks! and I hope you visit this blog anytime soon!!
Hi, greetings from Malaga. It’s nice to meet someone so ‘physically’ near me writing about backbone
I’ve read your article. It’s very nice. But I have a doubt:
- You write this.$el.html(this.template(this.model));
- Shoudn’t it be this.model.toJSON()?
Thanks again
Hi! nice to see someone from Spain!
Thanks! I hope you’ve enjoyed the article, and answering your doubt: I haven’t test it but I think they’re both valid. In fact, a JSON object it’s just a “string” representation of a Javascript Object.
Before answering you I would have told you that I’m not a Javacript expert. I just use it one I have to, but I hope this helps, and you can try it and tell me if that’s correct!
Thanks! And I hope you visit my blog again! =)