Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Already on GitHub? Sign in to your account

Added a default value for options and support for swipe up/down #394

wants to merge 3 commits into


None yet
5 participants

I kept getting errors when calling var jQT = new $.jQTouch();, but not when running var jQT = new $.jQTouch({}); so I have set a default value for the options argument.

@davidkaneda davidkaneda was assigned Mar 15, 2012

ns-1m commented Mar 20, 2012


I got this error in porting this app.


ReferenceError: Can't find variable: jQuery JQTouch/src/jqtouch.js:
763TypeError: Result of expression 'options' [undefined] is not an object.

Try downloading this and see if you can make it working.


Can you provide a reduced case for this error please? Possibly in http://jsfiddle.net/

ns-1m commented Mar 20, 2012

I don't know how to setup a jQTouch framework in http://jsfiddle.net/

Setup a jQTouch (this version) in jsfiddle.net and I will edit it to include the code found the the URL that I mentioned.


The instructions for the index.html file are wrong if you want to use jquery. You still need this file:

/jqtouch.min.js" type="text/javascript" charset="utf-8"

Without this file you will received the error of missing $

ns-1m commented Mar 24, 2012

I could not see any jqtouch.min.js in JQTouch.

These are only jqtouch_._ that I could find:

  • jtouch.js
  • jtouch-jquery.js

While the jquery are:

  • jquery-1.7.js
  • jquery-1.7.min.js

Probably meant jquery.min.js (i.e. jquery-1.7.min.js in this case).

In this new b4, if you want to use jQuery do, we need to include the following (below) in order for AJAX to work (e.g. jQTouch file)?

  • jtouch.js
  • jtouch-jquery.js
  • jquery-1.7.min.js

ns-1m commented Mar 25, 2012

I just check my project again.

I got this line in the project.

   <script src="./jqtouch/jquery.1.3.2.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="./jqtouch/jqtouch.min.js" type="application/x-javascript" charset="utf-8"></script>

Yet the could not still get the AJAX call, in this example.

ns-1m commented Mar 28, 2012

OK. Sorted this jqtouch.min.js" type="text/javascript" charset="utf-8"

However, I still got the $ error and page is blank.

The code is this:

div id="recipe4" class="recipe">
div class="toolbar">
h1>Recipe of the Day
a class="back" href="#">Back

  • At request time the recipe will be populated here -->

And I will load the JSON file (i.e. sample.json).

       [ { "title" : "Doggie Delight", "ingredients" :  ["1 cup dry kibble", "1 pound butter",
            "1 beef bouillon cube", "2 tbsp oregano" ], "instructions": "Combine all ingredients in bowl. Season to
          taste.  Serve immediately." }]

This is the sample.js.

      /* Initialize jQTouch on startup. 

           This code comes directly from jQTouch.
     var jQT = new $.jQTouch({
      icon: 'jqtouch.png',
      addGlossToIcon: false,
     startupScreen: 'jqt_startup.png',
     statusBar: 'black',

preloadImages: [

// Any methods for onload go here.
jQuery(document).ready(function () {

// If online, show all online-only resources
if (window.navigator.onLine) {

// Query for the recipe-of-the-day if the user selects the menu item
jQuery('#recipe4').bind('pageAnimationStart', function () {

// This routine should only populate the DOM once, so check if we have loaded before
if (!$(this).data('loaded')) {
  jQuery.ajax({ url: "sample.json",
              success: function (data) {

                // Set the recipe title
                jQuery('#recipe4 h1').text(data[0].title);

                // Create a UL and add each recipe item to it
                var ul = jQuery('<ul class="rounded">');
                jQuery.each(data[0].ingredients, function (index, item) {

                // Add the ingredients list and the recipe instructions
              error: function (e, e2, e3) {
                // Error-handling
              dataType: 'json'
  $(this).data('loaded', true);


I have changed the default folders but the files are the same:

<style type="text/css" media="screen">@import "themes/jqt/jqtouch.css";</style>
<style type="text/css" media="screen">@import "css/imicas.css";</style>
<script src="jqtouch/lib/jquery-1.7.js" type="text/javascript" charset="utf-8"></script>
<script src="jqtouch/jqtouch.js" type="text/javascript" charset="utf-8"></script>
<script src="jqtouch/jqtouch-jquery.js" type="application/x-javascript" charset="utf-8"></script>

ns-1m commented Mar 28, 2012

Yes, I mentioned I sort that out.

<script type="text/javascript" charset="utf-8" src="cordova-1.5.0.js"></script>
<script type="text/javascript" charset="utf-8" src="NativeControls.js"></script>
    <link rel="stylesheet" href="./themes/css/apple.css" title="jQTouch">
    <!-- Uncomment the following two lines (and comment out the previous two) to use jQuery instead of Zepto. -->
    <script src="./src/lib/jquery-1.7.min.js" type="application/x-javascript" charset="utf-8"></script> 
    <script src="./src/jqtouch-jquery.min.js" type="application/x-javascript" charset="utf-8"></script>

    <script src="./src/jqtouch.min.js" type="text/javascript" charset="utf-8"></script>

thomasyip commented Dec 18, 2012

We have refactored related code since. Swipeup / down were added (by bringing in touch.js from Zepto). undefined error was fixed in jquery-jqtouch2.js.

I am closing this. Let me know if I missed anything.

@thomasyip thomasyip closed this Dec 18, 2012

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment