How can I use appframework UI with jQuery and jQuery.Validate?

Jim_A_1 — Sun, 26 Apr 2015 07:11:06 GMT

Dear XDK experts,

I created a AppFramework project with intel XDK (ver. 1912), and created one button with click event via the app designer. The following js code is created in the index_user_scripts.js file. The code works fine. When I click the button, the alert pops up. However, when I uncommented the initValidation() in the event_handlers(), the click event won't work and I will get error messages saying jquery is not defined. I doubled checked the include path and verified the jquery js file is in the js folder (I downloaded and saved in the js folder). I have shown the index_user_scripts.js, the header of the index.html file and the error message below. Any help will be greatly appreciated. I have searched online and some said jquery and appframework UI cannot be used together. Is it still true?

BTW, does appFramework has built-in ability to do form validation? Is jquery.validate the best for form validate? If not, which one is the best for a xdk project? Thanks!

//===== Content of the index_user_scripts.js file =====//

(function()
{
"use strict";
/*
hook up event handlers
*/
function register_event_handlers()
{
initValidation();

/* button Button */
$(document).on("click", ".uib_w_2", function(evt)
{
/* your code goes here */
alert("Button is clicked.");
});

}
document.addEventListener("app.Ready", register_event_handlers, false);
})();

function initValidation()
{

$("#loginForm").validate

(

{

rules:
{
txt_login_email:
{
required: true,
email: true
}
}
,messages:
{
txt_login_email: "Please enter a valid email address"
}

}

);
}

//======= index.html header =========//

.........

.........

//====== Error messages after include the jquery.js ======//

Uncaught ReferenceError: jQuery is not defined jquery.validate.min.js:4
Failed to load resource: the server responded with a status of 404 (Not Found) http://127.0.0.1:58889/http-services/ui-builder/web/unit_tests/utils/test_styleparsing.css

You can´t use appframework.js

Hamilton_Tenório_da_ — Sun, 26 Apr 2015 12:51:39 GMT

You can´t use appframework.js and jquery.js.

You need to change the order of the lines and the name of the second one. I use:

And it works well.

Thanks! I tried to include js

Jim_A_1 — Mon, 27 Apr 2015 02:14:35 GMT

Thanks! I tried to include js/jq.appframework.min.js and js/appframework.ui.js after I downloaded them from github, but it still does not work. However, after I use the jquery-2.1.3 instead of 1.1.1, it works perfectly! Thanks so much for your help!

topic Thanks! I tried to include js in Software Archive

How can I use appframework UI with jQuery and jQuery.Validate?

You can´t use appframework.js

Thanks! I tried to include js