Databases
StackOverflow2013
Postsdbo
POEmber.js handling jQuery location changes
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POEmber.js handling jQuery location changes
    text
    copied!<p>Quick question. I found handling site navigation (not the routing aprt, just a simple nav bar) with ember.js a little complex. So I thought I will just code this aprt with jQuery, push history into location url and hope that Ember.js will detect this change and the router take action.</p> <p>Scenario :</p> <p>1) ember.js will use a DIV for rootElement and the navbar is declared in the body. </p> <pre><code>&lt;body&gt; &lt;div id="nav"&gt; &lt;ul&gt;&lt;li&gt;&lt;a&gt;Item1&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt; &lt;/div&gt; &lt;div id="rootEmberApp"&gt;&lt;/div&gt; &lt;/body&gt; </code></pre> <p>2) then a jQuery script will be bound to the links (item1) of the nav div and push changes to the URL but preventing default action without stopping the propgation (I didn't want to reload all the scripts). Something like : </p> <pre><code>$(document).ready(function(){ $("#navigation a").click(function(event){ App.router.location.setURL('/ember/listItems'); event.preventDefault(); }); </code></pre> <p>3) I was hoping that Ember.js will fire at this time and take action.</p> <p>I didn't succeed. Is it silly ? Any idea how to do that ?</p> <p>Thanks a lot.</p> <p><strong>Update 1 :</strong> thanks for the answer. Yes you're right. I was just not fully pleased with the solutions I tried or found about a nav bar. I will look again the todoMVC example and its use of the CollectionView. From a beginner point of view, the CollectionView seems a good way to describe (declare) the View and at the same times it's not easy to read (it's easier when the view is written with pure html and the js is bound to it ala jQuery). Thanks again</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload