Backbone.js fetch() is not changing URL

Question

I have this code in Backbone.js where I am trying to create dynamically a URL and call a function from the controller which returns a JSON data. For some reason when doing the fetch() method at the end the URL in my browser does not change. I have put a console.log in my getdata() function just to see if the call is happening, and it does. Also i have tried to console.log the new build URL with the parameter at the end, and also this is build successfully. Any ideas why the URL in not changing in the browser?

Thank you

getUrl: function(celebname){ 
        var urlstr = "http://localhost/Codeigniter/index.php/testcontroller/getdatabasedata?searchvalue="+celebname; 
        return urlstr; 
        },

        events: {
            "click #submitbtn" : "getdata",

          },
          getdata: function (event) { 
            var celebname = $('#celebname').val(); 
            this.model.url = this.getUrl(celebname);
            this.model.fetch();
          },

Answer 1

Backbone will always try to use the collection url, so if you want to fetch or save you should explicitly save the model with a new url.

Try overriding the url in the model like so:

var newUrl = this.getUrl(celebname);
this.model.save({}, { url: newUrl});

Instead of just setting this.model.url = this.getUrl(celebname);