Databases
StackOverflow2013
Postsdbo
PO
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>nah don't make a bunch of headers :) </p> <p>jqm <em>is</em> known to make it hard to dynamically update data attributes, but it's not that bad.</p> <p>here's a hack in case any one is interested - as long as you are willing to drop the ui-btn-active class and work with themes (which you can of course customize), then you can get this up and running in about 2 minutes.</p> <p>required reading: <a href="http://jquerymobile.com/test/docs/buttons/buttons-options.html" rel="nofollow">http://jquerymobile.com/test/docs/buttons/buttons-options.html</a></p> <p>obviously you need to include yr header template/markup as a static page above yr dynamic content for this to work - i am assuming from your question this is what you want to do, rather than have a php include for non-dynamic content, in which the case the solution would be a more obvious server-side solution. </p> <p>anywayyys</p> <p>html markup for sample navbar link</p> <pre><code>&lt;li&gt;&lt;a href="javascript:;" id="nav_billing" class="panes" rel="#billing" data-role="button" data-theme="b" data-icon="minus" data-iconpos="right"&gt;Billing Info&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="javascript:;" id="nav_shipping" class="panes" rel="#shipping" data-icon="minus" data-role="button" data-iconpos="right"&gt;Shipping Info&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="javascript:;" id="nav_payment" class="panes" rel="#checkout" data-icon="minus" data-role="button" data-iconpos="right"&gt;Payment Info&lt;/a&gt;&lt;/li&gt; </code></pre> <p>the important thing here to see is that instead of assigning an active class i.e. ui-btn-active, you'll assign a data-theme to the active class, and just to be sure i am adding data-role="button" to each link as well :)</p> <hr> <p>now for the part that's at the end of the doc:</p> <pre><code>$( document ).bind( "mobileinit", function(){ $.mobile.button.prototype.options.initSelector = ".panes"; }); </code></pre> <p>yup all we're doing here is automatically initializing these buttons so we can use something like this : </p> <pre><code>$('a').buttonMarkup({ theme: "a" }); </code></pre> <p>the rest is just putting together the clicker (note the on.click function) :</p> <pre><code>// 100% untested and sure to not work as is $(".panes").on('click', function () { // turn our clicked link into theme b aka active $(this).buttonMarkup({ theme: "b" }); // works nice with icons too $(this).buttonMarkup({ icon: "check" }); // grab all sibling links and turn them to theme a // this probably won't work without accounting for the actual markup :) $(this).siblings().buttonMarkup({ theme: "a" }); }); </code></pre>
    singulars
    1. This table or related slice is empty.
    1. POjQuery Mobile: Dynamically generated navbar buttons not persisting their active state
      singulars
      1. PTQuestion
    1. PTAnswer
    1. USweather
    1. USweather
    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
    1. COSlick workaround, thanks! Nothing personal, but I am hesitant to mark this as the answer because I think there would still be the issue of the navbar not behaving correctly (content being rendered behind it) but nonetheless I have learned a cool technique that will no doubt come in handy in other areas of development!
      singulars
      1. PO
      1. USShoeless
    2. COlol no prob. what do you mean by "content being rendered behind it"? if yr dynamic content is 'underneath' (on a z-scale) the header, that's more of a markup issue - unrelated to active states of the nav.
      singulars
      1. PO
      1. USweather
    3. COOrdinarily, (and on the initial load of my page) when the navbar is "fixed", it is rendered at the top of the page, and any additional page content is rendered below it (on the y axis). But in my situation, when the page reloads via ajax the navbar kind of floats above the page content, which is rendered underneath the navbar (on the z axis)... that's why I needed to include <br> tags at the top of the page content. It's like the "fixed" attribute only partially works.
      singulars
      1. PO
      1. USShoeless
 

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