Page 2 of 2 FirstFirst 12
Results 11 to 13 of 13

Thread: Problem with passing multiple parameters in url with Sencha-touch MVC routing

  1. #11
    Ext JS Premium Member
    Join Date
    Apr 2010
    Vote Rating


    I am pretty sure any pattern will work as well, although I do normally use generic routing for everything but the root route.

    Any additional parameters are shoved into 'rest' as a string, so I used
    to parse the additional parameters. You could use something simpler [maybe parseuri.js] without pulling in jQuery, but I have jQuery around to fix DOM issues 'concisely' and for some useful widgets, so I just used a method available.

    I ultimately ended up not caring about more complex URLs on the client side, so I definitely have not verified the extra parameters work with history. The code doesn't get in the way of history for me, but I could certainly imagine some other quirk in the code base that did when extra parameters were introduced... although that would be

    If you care, I now just send the extra parameters to the server on first application hit (potentially even the deep link hit) and they stay active for the entire session. Not as nice as just turning a flag on/off, better sub-page control, or a deep-linked sort adjustment, but I don't need the extra right now.

  2. #12
    Sencha Premium Member
    Join Date
    Sep 2008
    Vote Rating


    Thanks @parseroo for the response.

    Actually, I combined both your's and @gcallaghan's input into a very workable solution that handles parameter passing, deep linking, and history support in a very acceptable manner. I tend to agree more with @gcallaghan when it comes to the URL structure using a true URL pathing scheme for the parameters b/c in my opinion it is much more intuitive to the user (or client) to look at and work with. I also agree with him when it comes to using Ext.override when it comes to altering the core functionality as it keeps your original source code intact and lets you upgrade without having to search through all the code and rewrite it again in a new version.

    With that said, your override is still needed to fix the oversight (bug) in the router functionality so that the parameters following the action don't get shaved off. I had to add "\\-" to account for dashes in the productId, but your code made that trival.

    So, here's what I ended up with for my overrides that included your code:
    Ext.override(Ext.util.Route, {
        createMatcherRegex: function (url) {
            var paramsInMatchString = this.paramsInMatchString,
                    length = paramsInMatchString.length,
                    i, cond, matcher;
            for (i = 0; i < length; i++) {
                cond = this.conditions[paramsInMatchString[i]];
                if (i == length - 1) {
                    matcher = Ext.util.Format.format("({0})", cond || "[%a-zA-Z0-9\\_\\s,\\&\\=\\-]+");
                } else {
                    matcher = Ext.util.Format.format("({0})", cond || "[%a-zA-Z0-9\\_\\s,]+");
                url = url.replace(new RegExp(paramsInMatchString[i]), matcher);
            return new RegExp("^" + url + "$");

    My routes.js file looks like this:
    Ext.Router.draw(function (map) {
        // HomeController
        map.connect("home/index", { controller: 'HomeController', action: 'index' });
        // ProductsController
        map.connect("products/list/:method/:category/:term", { controller: 'ProductController', action: 'list' });
        map.connect("products/show/:productId", { controller: 'ProductController', action: 'show' });
    My Dispatch commands do two things, they build the historyUrl in accordance with the above routes, and they also pass the parameters as properties of the options config object. Doing this seems to ensure that the necessary parameters are included in the options object whether I am using the dispatch command, directly pathing to a page (deep linking), or using the history object (by using the browser forward and back buttons). It also allows me to use history.go(-1) for any back button (like on the toolbar) to return to the previous page very easily.

    Here's the dispatch code for the Product List action:
                controller: 'ProductController',
                action: 'list',
                historyUrl: 'products/list/' + method + '/' + category + '/' + term,
                parentView: 'Index',
                method: method,
                category: category,
                term: term
    As I stated, with the above code, I get parameter passing, deep linking, and history support in an easy to use, intuitive thanks for your help!

  3. #13
    Sencha User
    Join Date
    Oct 2012
    Vote Rating

    Default What is this?

    great to all,
    I don't read all of the article but i wrote my controller like this:
    } ,

    and called it like this:

    it works perfectly.

Page 2 of 2 FirstFirst 12

Similar Threads

  1. Sencha Touch + MVC?
    By Bucs in forum Sencha Touch 1.x: Discussion
    Replies: 16
    Last Post: 2 Jul 2011, 12:19 PM
  2. Using Sencha Touch with ASP .Net MVC
    By atulbahl in forum Sencha Touch 1.x: Discussion
    Replies: 8
    Last Post: 24 Mar 2011, 12:33 PM
  3. Sencha Touch's MVC
    By Steffen Hiller in forum Sencha Touch 1.x: Discussion
    Replies: 4
    Last Post: 27 Nov 2010, 8:24 PM
  4. Sencha Touch MVC
    By crysfel in forum Sencha Touch 1.x: Discussion
    Replies: 2
    Last Post: 25 Nov 2010, 12:36 AM
  5. change store URL or passing parameters
    By Brendan in forum Ext 2.x: Help & Discussion
    Replies: 4
    Last Post: 28 Jan 2009, 6:04 PM

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts