Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

Javascript: correctly display arrays data in the same row

Posted on 2013-10-26
4
Medium Priority
?
363 Views
Last Modified: 2013-10-27
I have two arrays that look like this:

var payments = {"items":[{"id_decoder":"1","mesi_pagati":"2"},{"id_decoder":"2","mesi_pagati":"1"}]}

var decoders = {"items":[{"id_decoder":"1","decoder":"decoder1","id_cliente":"1","username":"decoder1","password":"decoder1","note":"decoder1"},{"id_decoder":"2","decoder":"decoder2","id_cliente":"2","username":"decoder2","password":"decoder2","note":"decoder2"},{"id_decoder":"3","decoder":"decoder3","id_cliente":"3","username":"decoder3","password":"decoder3","note":"decoder3"},{"id_decoder":"4","decoder":"decoder4","id_cliente":"4","username":"decoder4","password":"decoder4","note":"decoder4"},{"id_decoder":"5","decoder":"decoder5","id_cliente":"5","username":"decoder5","password":"decoder5","note":"decoder5"},{"id_decoder":"6","decoder":"decoder6","id_cliente":"5","username":"decoder6","password":"decoder6","note":"decoder6"}]}

Open in new window


They are results coming from my database.
The 1st one is from payments table and the second one is from decoders table.

I want to write a row with all the following information in it:

all data coming from decoders and the total months that were not paid.

For this I can simply display in the right <span> the current month number (debts are calculated on a yearly base). If the id_decoder has payments then I want to subtract the payment number from the span number.

I've tried various approaches but I am not able to obtain the result I want.

The thing that came closer is:

function caricaUtentiGestioneUtenti() {
    var decoder;
    var pagamenti;

    $.getJSON(serviceURL + 'getdecoder.php', function (dati_decoder) {
        decoder = dati_decoder
        $.getJSON(serviceURL + 'getpagamenti.php', function (dati_pagamenti) {
            pagamenti = dati_pagamenti

            $.each(decoder, function (i, item) { // For each client
                console.log(decoder.items);

                item.pays = [];
                $.each(pagamenti, function (i, pay) { // Check each payment

                    /* COMMENTED SINCE THE DATA IS NOT YET OK
                $('#autocomplete_debitori').append('<li><a href="#popupPagamento" data-rel="popup" data-position-to="window" data-transition="flip">' +
                                '<p class="username">Username: <strong>'+ gruppi.username  +'</strong></p>'+
                                '<p class="password">Password: <strong>'+ gruppi.password  +'</strong></p>'+
                                '<p class="nome" id="'+ gruppi.nome  +'">Nome: <strong>'+ gruppi.nome  +'</strong></p>'+
                                '<p class="cognome" id="'+ gruppi.cognome  +'">Cognome: <strong>'+ gruppi.cognome  +'</strong></p>'+
                                '<p class="id_decoder" id="'+ gruppi.id_decoder +'">Decoder: <strong>'+ gruppi.nome_decoder  +'</strong></p>'+
                                '<p class="nome_gruppo">Gruppo: <strong>'+ gruppi.nome_gruppo  +'</strong></p>'+
                                '<p class="note">Note: <strong>'+ gruppi.note +'</strong></p>'+
                                '<span class="ui-li-count ui-li-count-f">'+ gruppi.MesiNonPagati +'</span>'+
                               '<a href="modifica_cliente.html"></a></a></li>');

        $('#autocomplete_debitori').trigger('create');
        $('#autocomplete_debitori').listview('refresh');
*/

                    if (item.id_decoder == pay.id_decoder) { // If matching ID
                        item.pays.push(pay); // Add it to this client
                    }

                });
            });
        });

    });
}

Open in new window


I'd appreciate hints and suggestions about how to do this properly (maybe I should just study better queries or enhance my for and while skills?): I am learning to program and every suggestion is very very welcome.

Thanks a lot to everyone for your time and patience.
0
Comment
Question by:ltpitt
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
4 Comments
 
LVL 44

Expert Comment

by:Chris Stanyon
ID: 39602761
Going to need some more explanation here. You talk about total months, yearly payments, month numbers etc, but your data doesn't resemble that. Your decode array contains items in this format:

"id_decoder": "1",
"decoder": "decoder1",
"id_cliente": "1",
"username": "decoder1",
"password": "decoder1",
"note": "decoder1"

and your payments array contains items in this format:

"id_decoder": "2",
"mesi_pagati": "1"

I don't see anything about months, years or payments!
0
 
LVL 1

Author Comment

by:ltpitt
ID: 39602862
I am sorry (my head is a mess after fighting with it for hours).

In the array coming from payments query you find id_decoder and number of total paid months :)
0
 
LVL 44

Accepted Solution

by:
Chris Stanyon earned 2000 total points
ID: 39603057
Still not entirely sure how your data relates to each other (is it one-to-one?), but have a look at this. Load it into a page, read the comments and then examine the console:

var newDecoders = new Object;
var newPayments = new Object;		

$.getJSON('decoders.json', function (decoders) {
	$.getJSON('payments.json', function (payments) {
		//we now have both files
		
		//loop through the 'items' in payments
		$(payments.items).each(function(i,e) {
			//add the payment info to the newPayments object, keyed on id_decoder
			newPayments[e.id_decoder] = e;
		});
		
		//loop through the 'items' in decoders
		$(decoders.items).each(function(i,e) {
			//add the payment info to the newDecoders object, keyed on id_decoder
			newDecoders[e.id_decoder] = e;
		});
		
		//now loop through the newDecoders 
		$.each(newDecoders, function(key, e) {
			//and check if the key exists in newPayments
			if (key in newPayments) {
				//if it does, log some info
				console.log(e.decoder + " has some payment info. Months Paid: " + newPayments[key].mesi_pagati);
			} else {
				//and if it doesn't, let the console know 
				console.log(e.decoder + " has no payment info");
			}
		});
	});
});

Open in new window

0
 
LVL 1

Author Closing Comment

by:ltpitt
ID: 39604263
Perfect, brilliant, well commented.

Anything else?

Thanks.
0

Featured Post

Build and deliver software with DevOps

A digital transformation requires faster time to market, shorter software development lifecycles, and the ability to adapt rapidly to changing customer demands. DevOps provides the solution.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

PROBLEM: The other day I was working on adding an ajax request to a webpage that already had a dialog box on the page.  The dialog box was using relative positioning to be positioned next to a form field I had on the page.  Everything was working…
In this blog, we’ll look at how improvements to Percona XtraDB Cluster improved IST performance.
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses

715 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question