How to set a background with Jquery

0

I am modifying a very old panel of the system and I need to add a new div and set a color according to the ajax return.

    setInterval('carregarProximo()', 3000);

function carregarProximo(){
       //$("#id_chamada").load(baseUrl+"/chamada/buscar-chamadas/");
       var som = new Audio(baseUrl+'/public/sounds/dingdong.wav');
       $.ajax({
           url: baseUrl+"/chamada/buscar-chamadas/",
           type: "GET",
           success:function(txt){
               for(var i in txt){
                    if(i == 0){
                        if(txt[i].cha_status == "C"){
                               /* $.ajax({
                                        url: baseUrl+"/chamada/ler",
                                        type: "POST",
                                        data: {
                                                usu_nome: "teste"
                                        },
                                        success: function(txt){
                                            alert(txt);
                                            var sound = $("<embed id='sound' type='audio/mpeg' />");
                                            sound.attr('src', txt);
                                            sound.attr('loop', false);
                                            sound.attr('hidden', true);
                                            sound.attr('autostart', true);
                                            $('body').append(sound);      

                                       }
                                });*/
                            som.play();
                            alteraStatus(txt[i].age_codigo);
                        }
                       var conteudo =   "<div id=\"div_superior\">"+
                                            "<b>"+txt[i].age_paciente+"</b>"+
                                          "</div>"+
                                          "<div id=\"div_setor\">"+
                                            "<b>"+txt[i].set_nome+"</b>"+
                                          "</div>"+
                                          "<div>"+
                                          +"</div>"
                                        "<div >"+
                                    "</div>";

                    }else {
                      switch(txt[i].cor){
                        case "red":
                             $("#cor").css('background-color', 'red');
                          break;

                        case "GoldenRod":
                             $("#cor").css('background-color', "GoldenRod");
                          break;

                        case "yellow":
                             $("#cor").css('background-color', "yellow");
                          break;

                        case "green":
                             $("#cor").css('background-color', "green");
                          break;

                        case "blue":
                             $("#cor").css('background-color', "blue");
                          break;   
                      }
                       conteudo += "<div class=\"anterior_1\">"+
                                    "<br/>"+
                                    //<?=$this->abreviaNome($chamada[age_paciente],24)?>

                                    txt[i].age_paciente+
                                    "<br/>"+

                                    "<div id=\"cor\" style='width: 100px'>"+

                                    "</div>"+

                                    "<br/>"+
                                   "<font color=\"red\"><b>"+txt[i].set_nome+"</b></font>"+
                                   "</div>";
                    }
                    //echo $this->action("altera-status", "chamada", "default", array("age_codigo" =>  $chamada[age_codigo]));
                                      // txt[i].cor+
               }
              //alert(conteudo);
              $("#id_chamada").html(conteudo);

           }
       });

}


function alteraStatus(age_codigo){

     $.ajax({
           url: baseUrl+"/chamada/altera-status/",
           data: {
               age_codigo:age_codigo},
           type: "GET",
           success:function(txt){

           }
     });
}

Then as shown in the code I created a div, gave its name as a color and tried to assign a backgrond with Jquery. I do not know if my clause is wrong or the code syntax itself. I even tested this "txt. [I] .cor" and it returned correctly.

Ajax Function:

public function buscarChamadas($uni_codigo=FALSE){
            $where = $this->select()
                          ->setIntegrityCheck(FALSE)
                          ->from(array("cha"=>"chamada"),array("age_codigo","cha_status","cha_codigo"))
                          ->join(array("age"=>"agendamento"),"age.age_codigo=cha.age_codigo","age_paciente")
                         ->join(array("log"=>"logon"),"log.id_login=cha.usr_codigo","")
                          ->join(array("set"=>"setor"),"set.set_codigo=log.cod_setor","set_nome")
                          ->joinLeft(array("pre"=>"pre_consulta"),"pre.age_codigo=age.age_codigo",array("cor"=>"(CASE WHEN pc_clas_risco=1 THEN 'red' WHEN pc_clas_risco=2 THEN 'GoldenRod' WHEN pc_clas_risco=3 THEN 'yellow' WHEN pc_clas_risco=4 THEN 'green' WHEN pc_clas_risco=5 THEN 'blue' END)"))
                          ->where("age.uni_codigo =?",$uni_codigo)
                          ->order("cha_status")
                          ->order("cha.cha_codigo DESC")
                          ->limit(6);
             // die($where);
            // $sql = $where;
            // die($sql);
            return $this->fetchAll($where);
        }

Aconsole.logwasplacedaftertheElse"console.log (txt [i] .cor)" switch ... And also a b tag inside the div given as color.For content submission.

    
asked by anonymous 03.10.2018 / 16:02

1 answer

0

I believe the problem is in its HTML structure. The id of an HTML component should be unique, and in the case it seems like you use multiple div's with the "color" id.

In this case you should use some kind of dynamic id such as color-1 , color-2 , and so on ...

When you add the color div to the content, insert a dynamic id and already place the background color inside the style:

"<div id='cor-"+i+"' class='cor' style='width: 100px; background-color: "+txt[i].cor+";'>"+

In addition, you were trying to select the $ element before even inserting the variable " content " (with your html and divs color) in the document.

    
03.10.2018 / 16:58