title: Using $.ajax to fetch static html files in phonegap and Windows Phone 7
body: <p>We're using Phonegap/Cordova 2.3.0 to deploy an app to Windows Phone 7. The application uses Require.js to dynamically load all modules. One module is called 'router' and is responsible for fetching static html from local files and loading their contents into a <code>&lt;div&gt;</code>. This works on iPhone, iPad, and Windows Phone 8. But there's something strange happening in WP7. </p>
  
  <p>Sample code from <code>router.js</code>: </p>
  
  <pre><code>//path that works with WP8
  var path = "www/views/";
  $.ajax({ url: path + "test3.html" })
                  .done(function(html) {
                      alert(html); //result from Windows Phone 8
                  }).fail(function(error) {
                      alert(error); //result from Windows Phone 7
                  });
  </code></pre>
  
  <p>The error that's given when testing on WP7 is a 404 Not Found. </p>
  
  <p>I say "there's something strange happening" because I can copy the exact code above to the <code>main.js</code> (require.js entry point) or the <code>index.html</code> and it will run without error. But when I put that code in my <code>router.js</code>, it returns the error. </p>
  
  <p>Some observations:</p>
  
  <ul>
  <li><code>router.js</code> is in the same folder (<code>/www/js</code>) as <code>main.js</code>.</li>
  <li><code>index.html</code> is in the <code>/www</code> folder.</li>
  <li>I've tried about every path combination I could think of hoping to stumble across one that worked. <code>/app/www/views</code>, <code>app/www/views</code>, <code>/www/views</code>, <code>www/views</code>, <code>/views</code>, <code>views</code>, and even <code>x-wmapp0:/app/www/views</code> and <code>x-wmapp1:/app/www/views</code>.</li>
  <li>Obviously, I have provided a super simplified example. If you need more, just tell me.</li>
  </ul>