Search string in an array with jquery

0

Personally I have a problem with the code.

function escreveNoticias() {

    var table_body = $("#lista-noticias tbody");
    table_body.empty();

    for (var i = 0; i<noticias.length; i++) {
        noticia = noticias[i];
        if (categorias.indexOf(noticia.categoria)>=0) {
            if (categorias.indexOf(procura)>=0) {
                var linha = "<tr class=\"realce\"><td>" + "<span>Titulo:</span>" + noticia.titulo + "&nbsp" + "&nbsp" + "&nbsp" + "&nbsp" + "<br><br>" + "<span>Categoria:</span>" + noticia.categoria + "&nbsp" + "&nbsp" + "&nbsp" + "&nbsp" + "<br><br>" + "<span>Data:</span>" + noticia.data  +  "<br><br>" + "<span>Subtitulo</span>" + noticia.subtitulo +  "<br><br>" + "<span>Artigo:</span>" + noticia.artigo +  "<br><br>" + "</td><tr>";
                table_body.append(linha);
            }
        }
    }
}

Well, my problem is the following, when I run this part: if(categorias.indexOf(noticia.categoria)>=0) I want to see if the category of the news exists in arrray categories and so far everything works fine, only the news with the category that is selected through the problem comes in the following line, when doing this: if(categorias.indexOf(procura)>=0) what I was supposed to do was to get a string stored in the search variable and check if there is any category with the string name but this part does not work and I do not know because ... The search variable is populated here.

function procurar() {
    $("#Procurar").click(function(){
        procura = ($("#TEXTO").val());
        escreveNoticias();
    });
}

I even made a alert to see if the string arrived at escreveNoticias and then my problem is actually at indexOf ...

Can someone help me?!?!

    
asked by anonymous 28.03.2015 / 00:59

1 answer

1

I'll highlight some issues:

  • If you declare a table in HTML with no elements in it, a tbody will not be generated automatically.
  • The escreveNoticias method should be receiving the variables as an argument, not as global objects (this is very important in the medium and long term, for the maintainability of the program)
  • The association of the click event with the #Procurar element occurs within a function, which does not appear to be called, and whose name ( procurar ) does not indicate that it will be called with purpose of registering events
  • The logic of if s is strange, you select the news according to check boxes (categories), until then ok ... but then only let the news be listed if the user types in a box text the name of one of the categories checked (for what?)

    You'll have to decide whether you want the user to select the categories through the checkbox or a text that he types.

  • Problems 1 through 3 are resolved in the snippet below. The 4, is already a problem of logic, and there will have to think a little more about the actual behavior desired.

    $(function() {
      var categorias = ["Esporte", "Lazer"];
      var noticias = [
        {titulo:"O time ganhou",categoria:"Esporte",data:"",subtitulo:"",artigo:""},
        {titulo:"Resort bom bonito e barato",categoria:"Lazer",data:"",subtitulo:"",artigo:""},
        {titulo:"O outro time perdeu",categoria:"Esporte",data:"",subtitulo:"",artigo:""},
        {titulo:"Viagens à lua não são mais sonho",categoria:"Lazer",data:"",subtitulo:"",artigo:""},
        {titulo:"O filme do momento",categoria:"Cinema",data:"",subtitulo:"",artigo:""}
      ];
    
      function escreveNoticias(procura, categorias, noticias) {
    
        var table_body = $("#lista-noticias tbody");
        table_body.empty();
    
        for (var i = 0; i < noticias.length; i++) {
          var noticia = noticias[i];
          if (categorias.indexOf(noticia.categoria) >= 0) {
            if (categorias.indexOf(procura) >= 0) {
              var linha = "<tr class=\"realce\"><td>" +
                "<span>Titulo:</span>" + noticia.titulo + "&nbsp" + "&nbsp" + "&nbsp" + "&nbsp" + "<br><br>" +
                "<span>Categoria:</span>" + noticia.categoria + "&nbsp" + "&nbsp" + "&nbsp" + "&nbsp" + "<br><br>" +
                "<span>Data:</span>" + noticia.data + "<br><br>" +
                "<span>Subtitulo</span>" + noticia.subtitulo + "<br><br>" +
                "<span>Artigo:</span>" + noticia.artigo + "<br><br>" + "</td><tr>";
              table_body.append(linha);
            }
          }
        }
      }
    
      $("#Procurar").click(function() {
        var procura = ($("#TEXTO").val());
        escreveNoticias(procura, categorias, noticias);
      });
    });
    td {
      border: 1px solid black;
    }
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><p>Suponhaqueestãochecadasascategorias:"Esporte" e "Lazer"</p>
    <input id="TEXTO" />
    <button id="Procurar">Procurar</button>
    <p>Lista de notícias</p>
    <table id="lista-noticias">
      <tbody></tbody>
    </table>
        
    28.03.2015 / 02:40