jashkenas / jashkenas/backbone

Backbone navigate - url encode in different language with diacritics

Open
#4,085 7 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

question
Dominant language
JavaScript
Stars
28.1k
Forks
5.3k
PR merge metrics
No merged PRs in 30d

Description

I have a search form that redirects the user to `search/thetermusersearched` where `thetermusersearched` is the exact value he entered. All this with the navigate function provided by Backbone.

This is all fine when I use strings in English (masa de calcat), but when I add diacritics in the input (masă de călcat) I get the route function fired twice.

The problem I have is in Firefox and Safari (the later in Mac and iOS)

I tried using `encodeURI` and `encodeURIComponent` when I use the `navigate`, but no success.

---

HTML

```


One alert
Two alerts

```

---

JS

```
var R = Backbone.Router.extend({
routes: {
'results/:query': 'results'
},
results: function(query) {
alert('Route triggered: ' + decodeURIComponent(query));
}
});
var myR = new R;
Backbone.history.start();

$(function(){
$('a').on('click', function(e){
e.preventDefault();
var href = $(this).data('string');
href = 'results/' + encodeURIComponent(href);
console.log(href);
myR.navigate(href, {trigger: true});
})
})
```

---

See fiddle here: http://jsfiddle.net/adyz/qcged76e/4/

Any thoughts on this?

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the provided fiddle in Firefox and Safari, then trace Backbone.Router, Backbone.history.start, and myR.navigate with the diacritic-containing route. Determine why the results callback fires twice; done means the encoded query triggers the route once and still displays the decoded search term.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.