Databases
StackOverflow2013
Postsdbo
PO
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>I would be interested in knowing other's view on this, but what I did so organize and execute the correct set of JS code for each page, is to have a kind of routing engine as the basis of my js app where I add a 'controller' list that each section adds it self to and the routing engine calls the controller.init() method based on the url.</p> <pre><code>myApp = {}; (function(app, $) { var defaultController = "Default"; var routes = []; routes["Default"] = defaultController; var currentControllerFromUrl = function() { // match urls in the form ../mvc/controllerName.mvc/... var re = new RegExp(/\/(\w*)/i); var m = re.exec(document.location); if (m == null) { return null; } else { return m[1]; } }; var currentActionFromUrl = function() { // match urls in the form ../mvc/controllerName.mvc/action/ var re = new RegExp(/\/mvc\/\w*.mvc\/(\w*)(\/|\b)/i); var m = re.exec(document.location); if (m == null) { return null; } else { return m[1].toLowerCase(); } }; var currentWebPageFromUrl = function() { var re = new RegExp(/\/(\w*).html/i); var m = re.exec(document.location); if (m == null) { return null; } else { return m[1]; } }; var populateControllerRoutes = function(app) { for (var ctl in app.controllers) { routes[ctl] = ctl; } }; var theApp = { controllers: {}, run: function() { this.initController(); }, initController: function() { var urlController = currentWebPageFromUrl(); // populate routes populateControllerRoutes(this); if (urlController &amp;&amp; routes[urlController]) { // load the correct controller into the activeController this.controller = new this.controllers[routes[urlController]](); this.controller.init(); var action = currentActionFromUrl() || "index"; if (action &amp;&amp; this.controller[action + "Action"] !== undefined) this.controller[action + "Action"](); } } }; window.myApp = $.extend(app, theApp); })(myApp || {}, jQuery); // and somewhere else (function($) { myApp.controllers.default = function() { this.init = function() { }; this.indexAction = function() { // index action init $("#res").text("hi there!"); } } })(jQuery); $(function() { myApp.run(); }); </code></pre> <p>With this approach, the controller functions don't need to be in one file, so during development you can keep your controller functions in separate files nicely organized and as part of the build/deploy, combine them and minimize them all into one JS file. </p>
    singulars
    1. This table or related slice is empty.
    1. POIs there a better way to organise javascript in a single file with specific code for multiple pages?
      singulars
      1. PTQuestion
    1. PTAnswer
    1. USJaime
    1. USJaime
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTUpMod
    1. COThanks for the link. I didn't think about including routing for xhr calls, but could be interesting, although most/all of the ajax calls would be originated inside a controller action with their own handlers, right? I guess if all the app is ajax based then you really get a nice routing though the global ajax handlers
      singulars
      1. PO
      1. USJaime
    2. COI like this, I do a similar thing based of this article from Paul Irish http://paulirish.com/2009/markup-based-unobtrusive-comprehensive-dom-ready-execution/. Each controller has a separate .js file and they have init/ajaxInit funcions that are invoked by looking at the url of the loaded page (full page load or xhr call) - All forms are hooked up generically using the global jquery ajax handlers, it is a cool mvc layer in js. I also use the pubsub plugin to respond to actions. Any new controllers/actions require very little markup to fit into the pattern.
      singulars
      1. PO
      1. USredsquare
    3. CO@Jamie - No all new form content (either html partials or generated template markup) are hooked up in the common namespace using the global ajax handlers. Each action can have a validation function that I try to call in the beforeSubmit, they can also have complete/success/error events if they need special handling that the common handlers cannot deal with. The common handlers do their stuff then try to call the method on the namespace for that url.
      singulars
      1. PO
      1. USredsquare
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

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