На моей странице test.html я использую pageinit, который вызывает функции из exem.js, отображается предупреждение в начале функций, я хочу сказать, что функции хорошо называются, но вызов ajax не работает !! Также, если я тестирую вызов ajax в test.html без Pageinit и exem.js, код работает, я имею в виду, что эти две функции верны. Это мой код:
test.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery Mobile: Demos and Documentation</title>
<link rel="stylesheet" href="jquery.mobile-1.0.1.min.css" />
<link rel="stylesheet" href="jqm-docs.css" />
<script src="jquery.js"></script>
<script src="jquery.mobile.themeswitcher.js"></script>
<script src="jqm-docs.js"></script>
<script src="jquery.mobile-1.0.1.min.js"></script>
<script src="exem.js"></script>
<script>
$('#myPage').live('pageinit', function(event) {
alert("pageinit working");
jQuery.noConflict();
getCategories ();
getnameCategories ();
});
</script>
</head>
<body>
<div id="myPage" data-role="page">
<!-- L'entete du page -->
<div data-role="header">
<h1>Identifiez-vous</h1>
<a href="#search" data-role="button" data-theme="e">Config</a>
<a href="acceul.html" data-role="button" data-theme="e">Accueil</a>
</div>
<!-- Le contenu du page -->
<div data-role="content" id="li">
<ul data-role="listview" data-inset="true" data-theme="e">
<li id="a1" ><img src='img1' alt="Categ" class="ui-li-icon"/><a id="im1" href="AuthentificationCreation.html"></a></li>
<li id="a2"><img src='img2' alt="Categ" class="ui-li-icon"/><a id="im2" href="AuthentificationCreation.html"></a></li>
<li id="a3"><img src='img3' alt="Categ" class="ui-li-icon"/><a id="im3" href="AuthentificationCreation.html"></a></li>
<li id="a4"><img src='img4' alt="Categ" class="ui-li-icon"/><a id="im4" href="AuthentificationCreation.html"></a></li>
<li id="a5"><img src='img5' alt="Categ" class="ui-li-icon"/><a id="im5" href="AuthentificationCreation.html"></a></li>
<li id="a6"><img src='img6' alt="Categ" class="ui-li-icon"/><a id="im6" href="AuthentificationCreation.html"></a></li>
</ul>
</div>
<!-- Le pied du page -->
<div class="ui-bar-a">
<div data-role="footer" data-position="fixed" data-theme="a">
<div data-role="navbar" >
<ul>
<li><a href="#search" data-icon="delete">Catégories</a></li>
<li><a href="#" data-icon="delete">Compte</a></li>
<li><a href="#" data-icon="delete">Panier</a></li>
</ul>
</div><!-- /navbar -->
</div><!-- /footer -->
</div>
</div>
</body>
</html>
exem.js:
var idCategories = new Array();
var nameCategories = new Array();
var ws_key="my_key";
var PHP_AUTH_USER="";
function getCategories ()
{ alert("fn1");
jQuery.ajax({
type: "GET",
async: false,
url: "http://my_site/api/categories?ws_key="+ws_key+"&PHP_AUTH_USER="+PHP_AUTH_USER,
dataType: "xml",
success: parseXml
});
function parseXml(xml) {var i=0;
jQuery(xml).find("category").each(function() {
idCategories[i]= jQuery(this).attr('id');
alert("studentName="+idCategories[i]);
i=i+1;
});
}
}
function getnameCategories ()
{alert("fn2");
for(i=1;i<idCategories.length;i++)
{
jQuery.ajax({
type: "GET",
async: false,
url: "http://my_site/api/categories/"+idCategories[i]+"?ws_key="+ws_key+"&PHP_AUTH_USER="+PHP_AUTH_USER,
dataType: "xml",
success: parseXml
});
function parseXml(xml) {alert("success");
jQuery(xml).find("name").each(function() {
nameCategories[i]= jQuery(this).find('language')[0].firstChild.data;
alert("aaa="+i+"aa"+nameCategories[i]);
});
}
jQuery('#im'+i).html(nameCategories[i]);
}
}