Canonical Voices

Posts tagged with 'jquery'

mandel

I have been playing around with jquery a little lately and I found that it is not very well documented how to add an input field like a checkbox inside the header of an accordion so that you can click on the header and the accordeon works as expected and the checkbox can be clicked. I’m not an expert in this things but I found the way to work around the issue:

The HTML:

1
2
3
4
5
6
7
8
9
10
11
12
<div id="accordion">
    <div>
        <h3 id='example'>
            <a href='#'>
                <label>Title<input class='header-checkbox' type='checkbox' /></label>
            </a>
        </h3>
        <div>
            <p></p>
        </div>
    </div>
</div>

The Javascript:

$('#example').find('input').click(
    function(e){
        e.stopPropagation();
    }
);

I’m sure this is very easy for any advance js guy, but since I googled and did not find it I though I would be a nice guy and post it here for the next guy.

Read more
Michael

I had a few hours recently to try updating my Open Goal Tracker javascript client prototype to use jQuery Mobile for the UI… and wow – it is so nice, as a developer with an idea, not having to think about certain UI issues (such as a touch interface, or just basic widget design). I can see now how ugly my previous play-prototype looked. Here’s a brief demo of the jQueryMobile version (sorry for the mumbling):

 

That’s using jQuery Mobile 1.01 for the UI and YUI 3.5.0PR2 for the MVC client-side framework, although I’m tempted to move over to backbone.js (which is what the YUI application framework is based on, it seems). Backbone.js has beautifully annotated source and a book – Developing backbone applications - which so far seems like very worthwhile reading material.

The prototype can be played with at http://opengoaltracker.org/prototype_fun/


Filed under: javascript, jquery, open-goal-tracker, yui

Read more