Send ajax request on click event in backbone js

Question

Here's the code

This is model

 var TodoItem = Backbone.Model.extend({
     url: 'list.php',
     DeleteTabItem: function (child, parent) {
         jQuery.ajax({
             url: 'delete.php',
         });
     }
 });

This is view

var TodoView = Backbone.View.extend({
    el: '.entry-title',
    template: _.template(''),
    KeyPressEvent: function () {
        this.model.DeleteTabItem();
    }
});

Is this correct way of sending ajax request.

Thanks in Advance

Roy M J · Accepted Answer · 2013-08-20T13:44:39.487

2

In backbone model, instead of url,

use : urlRoot: "yoururl",

Backbone.Model.extend({
    urlRoot: 'list.php' 
});

url would be used in collections

For sending data through view :

this.model.save(sendData, { success, error });

where sendData = { data preferably in json }

You will have to bind the model with your view like :

var todoView = var TodoView(model:TodoItem);

edited Aug 20 '13 at 13:44

answered Aug 20 '13 at 12:01

Roy M J

6,926
7
51
78

Thanks for the reply Roy. How to send values through GET or POST Sorry i dont have enough reputation to upvote your answer – Vijaykumar K Aug 20 '13 at 13:11
Thanks Roy it helped me out to get the solution – Vijaykumar K Aug 21 '13 at 04:11
Is it possible to use anothe urlRoot within the same model? – Vijaykumar K Aug 21 '13 at 07:44
No.. But why is that? if you need to have multiple ajax requests sent, you should take a look at how collections(more than 1 models) work.. Or you write another model and instead of this.model.save(), use newmodelname.save(). Declare the new model jsut before this call.. :).. – Roy M J Aug 21 '13 at 08:39
Thanks Roy I didn't read about collections so i was doing like that.Now i will learn collection – Vijaykumar K Aug 21 '13 at 12:42

score 1 · Answer 2 · answered Aug 20 '13 at 13:43

In Backbone world, we usually use multiple models and collection instead of handle data directly via JQuery AJAX function.

So you just need to persist your values into model or collections, and execute correspond actions, like fetch(), save(), destroy()...They have default request type.

As for your code, you still can use new function "DeleteTabItem", but inside, the better way is call some model or collection's destroy action.

Send ajax request on click event in backbone js

2 Answers2