Simple jquery code working sometimes when refreshing page

Simple jquery code working sometimes when refreshing page

Guys I am really going totally crazy.

I load a list with data coming from my database.

I have decided to let the user change the year to he can see a detailed list regarding that year.

As soon as I've thrown this new function my page started working random.

One refresh it's working and the other not.

I've understood that it was because the variable year (anno in Italian) was undefined so I've prepared a little code to define it if undefined.

If I run this code sometimes it works and sometimes not.

The php page behind it works steady as a rock if I test it (e.g. http://pitto.homeip.net/mobile/php/getpagati.php?anno=2013)

I really can't think how to solve the riddle since I've just began programming...

Can you please be so kind to lend a hand?

Here I paste my index.js and you can find the not working page at:

http://pitto.homeip.net/mobile

Thanks a lot!
























  1. var serviceURL = "http://pitto.homeip.net/mobile/php/";

  3. var clienti;
  4. var pagamenti;
  5. var mesi = {"GEN":"GEN", "FEB":"FEB", "MAR":"MAR", "APR":"APR", "MAG":"MAG", "GIU":"GIU", "LUG":"LUG", "AGO":"AGO", "SET":"SET", "OTT":"OTT", "NOV":"NOV", "DIC":"DIC"}
  6. var anno;

  8. $(document).bind('pageshow', '#lista_clienti', function(){
  9.         getListaClientiKo();
  10.         pulisciRicerca();
  11. });

  13. function getListaClientiKo() {
  14.         if(typeof anno != 'undefined')
  15.         {
  16.         console.log("anno definito / year defined");
  17.         $.getJSON(serviceURL + 'getpagati.php?anno=' + anno, function(dati) {
  18.                 pagamenti = dati.items;
  19.         });

  21.         $.getJSON(serviceURL + 'getclienti.php', function(data)
  22.                 {
  23.                 $('.listaClientiKo li').remove();
  24.                 clienti = data.items;
  25. console.log (clienti);
  26. console.log (pagamenti);

  28. $.each(clienti, function(i, item) { // For each client
  29. item.pays = [];
  30. $.each(pagamenti, function(i, pay) { // Check each payment
  31. if (item.id_cliente == pay.id_cliente) { // If matching ID
  32. item.pays.push(pay); // Add it to this client
  33.                 }
  34.         });
  35. });
  36. // La funzione sottostante trasforma il testo tutto maiuscolo in testo con solo la prima lettera maiuscola
  37.         $.each(clienti, function(index, clienti) {
  38.                 var mesipagati = (clienti.pays);
  39.                 var totmesipagati = Object.keys(mesipagati).length;
  40.                 var data = new Date();
  41.                 var mese = data.getMonth()+1;
  42.                 var len = Math.abs(totmesipagati - mese);
  43.                 if (len<0)
  44.                 {
  45.                 len = 0;
  46.                 }
  47.                 var strnick = (clienti.nick);
  48.                 strnick = strnick.toLowerCase().replace(/\b[a-z]/g, function(letter) {
  49.                 return letter.toUpperCase();
  50.                 });
  51.                 var strnome = (clienti.nome);
  52.                 strnome = strnome.toLowerCase().replace(/\b[a-z]/g, function(letter) {
  53.                 return letter.toUpperCase();
  54.                 });
  55.                 var strgruppo = (clienti.gruppo);
  56.                 strgruppo = strgruppo.toLowerCase().replace(/\b[a-z]/g, function(letter) {
  57.                 return letter.toUpperCase();
  58.                 });
  59. // La funzione sottostante crea dinamicamente la lista dei clienti
  60. $('.listaClientiKo').append('<li><a href="dettagli_cliente.html?id=' + clienti.id_cliente + '&anno='+ anno +'" data-transition="slidefade">' +
  61.         '<table cellspacing="0" style="margin-top: 10px;">' +
  62.                 '<tbody>' +
  63.                         '<tr>' +
  64.                                 '<td><p>Nick:</p></td>'+
  65.                                 '<td><p style="padding-left: 8px;"><strong>' + strnick + '</strong></p></td>' +
  66.                         '</tr>' +
  67.                         '<tr>' +
  68.                                 '<td><p>Nome:</p></td>'+
  69.                                 '<td><p style="padding-left: 8px;"><strong>' + strnome + '</strong></p></td>' +
  70.                         '</tr>' +
  71.                         '<tr>' +
  72.                                 '<td><p>Gruppo:</p></td>'+
  73.                                 '<td><p style="padding-left: 8px;"><strong>' + strgruppo + '</strong></p></td>' +
  74.                         '</tr>' +
  75.                                 '<span class="ui-li-count">' + len + '</span></a></li>');
  76. $('.listaClientiKo li a').addClass( "cliente" );
  77. });
  78. $('.listaClientiKo').listview('refresh');
  79. });
  80.         }
  81.         else
  82.         {
  83.         console.log("anno non definito / year undefined");
  84.         var dataAnno = new Date();
  85.         var dataAnnoCorrente = dataAnno.getFullYear();
  86.         annoCorrente = dataAnnoCorrente
  87.         anno = annoCorrente
  88.         console.log("l'anno: "+anno);
  89.         $.getJSON(serviceURL + 'getpagati.php?anno=' + anno, function(dati) {
  90.                 pagamenti = dati.items;
  91.         });

  93.         $.getJSON(serviceURL + 'getclienti.php', function(data)
  94.                 {
  95.                 $('.listaClientiKo li').remove();
  96.                 clienti = data.items;
  97. console.log (clienti);
  98. console.log (pagamenti);

  100. $.each(clienti, function(i, item) { // For each client
  101. item.pays = [];
  102. $.each(pagamenti, function(i, pay) { // Check each payment
  103. if (item.id_cliente == pay.id_cliente) { // If matching ID
  104. item.pays.push(pay); // Add it to this client
  105.                 }
  106.         });
  107. });

  109. // La funzione sottostante trasforma il testo tutto maiuscolo in testo con solo la prima lettera maiuscola
  110.         $.each(clienti, function(index, clienti) {
  111.                 var mesipagati = (clienti.pays);
  112.                 var totmesipagati = Object.keys(mesipagati).length;
  113.                 var data = new Date();
  114.                 var mese = data.getMonth()+1;
  115.                 var len = Math.abs(totmesipagati - mese);
  116.                 if (len<0)
  117.                 {
  118.                 len = 0;
  119.                 }
  120.                 var strnick = (clienti.nick);
  121.                 strnick = strnick.toLowerCase().replace(/\b[a-z]/g, function(letter) {
  122.                 return letter.toUpperCase();
  123.                 });
  124.                 var strnome = (clienti.nome);
  125.                 strnome = strnome.toLowerCase().replace(/\b[a-z]/g, function(letter) {
  126.                 return letter.toUpperCase();
  127.                 });
  128.                 var strgruppo = (clienti.gruppo);
  129.                 strgruppo = strgruppo.toLowerCase().replace(/\b[a-z]/g, function(letter) {
  130.                 return letter.toUpperCase();
  131.                 });
  132. // La funzione sottostante crea dinamicamente la lista dei clienti
  133. $('.listaClientiKo').append('<li><a href="dettagli_cliente.html?id=' + clienti.id_cliente + '&anno='+ anno +'" data-transition="slidefade">' +
  134.         '<table cellspacing="0" style="margin-top: 10px;">' +
  135.                 '<tbody>' +
  136.                         '<tr>' +
  137.                                 '<td><p>Nick:</p></td>'+
  138.                                 '<td><p style="padding-left: 8px;"><strong>' + strnick + '</strong></p></td>' +
  139.                         '</tr>' +
  140.                         '<tr>' +
  141.                                 '<td><p>Nome:</p></td>'+
  142.                                 '<td><p style="padding-left: 8px;"><strong>' + strnome + '</strong></p></td>' +
  143.                         '</tr>' +
  144.                         '<tr>' +
  145.                                 '<td><p>Gruppo:</p></td>'+
  146.                                 '<td><p style="padding-left: 8px;"><strong>' + strgruppo + '</strong></p></td>' +
  147.                         '</tr>' +
  148.                                 '<span class="ui-li-count">' + len + '</span></a></li>');
  149. $('.listaClientiKo li a').addClass( "cliente" );
  150. });
  151. $('.listaClientiKo').listview('refresh');
  152. });
  153.         }
  154. }

  156. function pulisciRicerca() {
  157.         $('input[data-type="search"]').val("");
  158. }