3

I cant seem to find a work around for this problem.

In a SPA app, I have different routes. #/search #/other #/search/child . I parse the hashtag and show/hide an element that contains the attribute data-route.

When path is composed by one part #/search everything works fine. Jquery is doing $('[data-route=search]').

When I add a second part #/search/child, I escape the selector into "search\/child" but Jquery fails to run the selector with the following error msg: 

Uncaught Error: Syntax error, unrecognized expression: [data-route=search\\/child] jquery.js:1850Sizzle.error jquery.js:1850tokenize jquery.js:2460select jquery.js:2847Sizzle jquery.js:1289jQuery.fn.extend.find jquery.js:5730jQuery.fn.jQuery.init jquery.js:197jQuery jquery.js:63allroutes MainView.js:21apply director.js:511_every director.js:308Router.invoke director.js:516updateAndInvoke director.js:474Router.dispatch director.js:482handler director.js:203onchange director.js:76

If I open the console and execute the same selector, it works just fine.

var route = window.location.hash.slice(2);
route =  route.replace('/','\\\\/');
var sections = $('[data-route]');
var selector = "[data-route=" + route + "]";
var section = $(selector);

if (section.length) {
    sections.hide(250);
    section.show(250);
}
sesteva
  • 1,716
  • 2
  • 16
  • 17

1 Answers1

5

Try using quotes.

var selector = "[data-route=\"" + route + "\"]";

You don't even need to escape the / then.

amphetamachine
  • 27,620
  • 12
  • 60
  • 72