How to replace the contents of an array?

0

I have a div (mosaic of users) that inside it has a array (javascript) with photos of users (data coming from the bank). The number of user photos must be less than or equal to 15. If array has less than 15 users (photos), it must be filled with an icon or image representing that it is without a user.

Can anyone help me?

Below is an example:

html += '<div class="mosaico-user wrap">'
        +   '<div class="liderGrupo"></div>';

var iconePadrao = '<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover"><i class="fa fa-user fa-3x semUsuario" aria-hidden="true"></i></a>';
var demoParticipantes = ['<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover" data-original-title="" title=""><img src="/resources/img/teste1.jpg" class="fotousuario"></a>',
                        '<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover" data-original-title="" title=""><img src="/resources/img/teste.jpg" class="fotousuario"></a>',
                        '<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover" data-original-title="" title=""><img src="/resources/img/4.jpg" class="fotousuario"></a>',
                        '<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover" data-original-title="" title=""><img src="/resources/img/teste1.jpg" class="fotousuario"></a>',
                        '<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover" data-original-title="" title=""><img src="/resources/img/teste.jpg" class="fotousuario"></a>',
                        '<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover" data-original-title="" title=""><img src="/resources/img/4.jpg" class="fotousuario"></a>',
                        '<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover" data-original-title="" title=""><img src="/resources/img/teste1.jpg" class="fotousuario"></a>',
                        '<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover" data-original-title="" title=""><img src="/resources/img/teste.jpg" class="fotousuario"></a>',
                        '<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover" data-original-title="" title=""><img src="/resources/img/4.jpg" class="fotousuario"></a>',
                        '<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover"><i class="fa fa-user fa-3x usuarioSemFoto" aria-hidden="true"></i></a>',
                        '<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover"><i class="fa fa-user fa-3x usuarioSemFoto" aria-hidden="true"></i></a>',
                        '<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover"><i class="fa fa-user fa-3x usuarioSemFoto" aria-hidden="true"></i></a>',
                        '<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover"><i class="fa fa-user fa-3x usuarioSemFoto" aria-hidden="true"></i></a>',
                        '<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover"><i class="fa fa-user fa-3x semUsuario" aria-hidden="true"></i></a>',
                        '<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover"><i class="fa fa-user fa-3x semUsuario" aria-hidden="true"></i></a>',
                        '<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover"><i class="fa fa-user fa-3x semUsuario" aria-hidden="true"></i></a>',
                        '<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover"><i class="fa fa-user fa-3x semUsuario" aria-hidden="true"></i></a>',
                        '<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover"><i class="fa fa-user fa-3x semUsuario" aria-hidden="true"></i></a>',
                        '<a class="linkUsuario" rel="popover" href="#" data-popover-content="#infoUser" data-toggle="popover"><i class="fa fa-user fa-3x semUsuario" aria-hidden="true"></i></a>'
                        ];
var conteudo = "";
var i;

for (i = 0; i < 15; i++) {
    conteudo = demoParticipantes[i];
    html += conteudo;
} 
    
asked by anonymous 01.11.2016 / 14:31

1 answer

1

Try the following before your for that inserts the content in the variable html .

while(demoParticipantes.length < 15) {
    demoParticipantes.push(iconePadrao);
}
    
01.11.2016 / 14:59