Databases
StackOverflow2013
Postsdbo
PO
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>A good practice is to have code that is required by all pages in one file and to have specific javascript files for pages that require specific functionality. It sounds as though this is what you are doing anyway, so we have a good basis to build upon.</p> <p>There are numerous ways in which you could build in what pages need what files, but remember that in normal circumstances, javascript files are cached by the browser such that those files need only downloading once.</p> <p>In light of this comment</p> <blockquote> <p>Yes, but what if you have multiple pages with the same DOM elements? For example, my validator() plugin is set up like $('form').validate(), but sometimes I don't want it to act on all the forms on the page, only some of them. What do I do in this case?</p> </blockquote> <p>I suggest coming up with a convention by which to label elements common across pages that require certain jQuery plugins "attached" to them. For example, if you have a <code>&lt;form&gt;</code> element on a number of different pages that requires a <code>validator()</code> plugin, but there is more than one <code>&lt;form&gt;</code> element on any one particular page (and not all <code>&lt;form&gt;</code> elements should have the <code>validator()</code> plugin), then I suggest using a CSS class to distinguish the <code>&lt;form&gt;</code> elements that do need the plugin. </p> <pre><code>&lt;!-- HTML --&gt; &lt;!-- need to apply plugin to this --&gt; &lt;form class="validator"&gt; ... &lt;/form&gt; &lt;!-- but not to this --&gt; &lt;form&gt; ... &lt;/form&gt; &lt;script type="text/javascript"&gt; // jQuery Code (in a separate file) $(function() { $('form.validator').validator(); }); &lt;/script&gt; </code></pre> <p>That way, the plugin will be applied only to those <code>&lt;form&gt;</code> elements matching the selector.</p> <p><strong>EDIT:</strong></p> <p>I'm not sure how the helpers in rails work, but you can pass data to an event handler in jQuery using the <code>data</code> parameter of the <a href="http://docs.jquery.com/Events/bind" rel="nofollow noreferrer"><code>bind()</code></a> method for any data that is not directly part of an <code>&lt;a&gt;</code> element itself (such as an attribute like <code>href</code>). If some of the links require AJAX, then it may make sense to label those with a CSS class and store the URL in the <code>href</code> for the element. Then in your jQuery code that can be used on any pages that have links that make requests through AJAX, you could do something like</p> <pre><code>&lt;a class="ajax-link" href="/get/someData.php"&gt;Data retrieved through AJAX&lt;/a&gt; &lt;a href="/normalLink.php"&gt;Standard link with no AJAX&lt;/a&gt; &lt;script type="text/javascript"&gt; $('a.ajax-link').bind('click',ajaxRequest); function ajaxRequest(e) { e.preventDefault(); $.get(e.target.href, function(data) { $('#loadDiv').html(data); }); } &lt;/script&gt; </code></pre> <p>the link will work as per a normal link when a user has JavaScript disabled, but will make an AJAX request for data when JavaScript is enabled. I've used a named function here, <code>ajaxRequest</code> as it can make it easier to debug the script (and perhaps also reuse), but you could use an anonymous function if you prefer.</p>
    singulars
    1. This table or related slice is empty.
    1. POWhat is the best way to organize unobtrusive JavaScript across multiple pages?
      singulars
      1. PTQuestion
    1. PTAnswer
    1. USRuss Cam
    1. USRuss Cam
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. POWhat is the best way to organize unobtrusive JavaScript across multiple pages?
      singulars
      1. PTQuestion
    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. VTAcceptedByOriginator
    1. COExcellent insight. In my case there is a specific (very large) form that doesn't need the validator() plugin, so I will probably use a "NOT" selector to exclude it. Something like $('form:not(.no-validate)').validate(); ...
      singulars
      1. PO
      1. USRichard Hurt
    2. COCertainly, if you need to apply the plugin to all but one `<form>` element then using a `:not` selector would perhaps be better than applying a CSS class to all the elements that do need the plugin. It may be slightly faster to just grab all the `<form>` elements and then use `filter()` to remove the one not needed rather than using a complex selector string.
      singulars
      1. PO
      1. USRuss Cam
 

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