Uncaught Typeerror: Cannot read Property 'toLowerCase' of Undefined

Asked

Viewed 4,074 times

0

I try to take the values of a table and filter them, but for some reason the rescued values are in Undefined and I have no idea how to solve

<?php

include_once("conexao.php");

if (isset($_GET["id"])) {

    $id = $_GET["id"];

    $sql = "SELECT * FROM acesso WHERE id = ?";

    $stmt = $conexao->prepare($sql);
    $stmt->bindParam(1, $id);
    $stmt->execute();

    if($obj = $stmt->fetch(PDO::FETCH_OBJ)){
        $marca = $obj->marca;
        $modelo = $obj->modelo;
        $cor = $obj->cor;
    }

} else {
    $id=0;
    $marca="";
    $modelo="";
    $cor="";
}

?>

<html>
<head>
    <title>PHP</title>
    <meta charset="utf-8"/>
    <link href="css/bootstrap.css" rel="stylesheet"/>
    <script src="js/jquery-3.3.1.js"></script>
    <script src="js/bootstrap.js"></script>
</head>
<body style="background-color: #191919; color: white;">
    <div class="container">
        <form onsubmit="return validar();" action="bemvindo.php" method="POST" ">
            <fieldset>
                <legend>Formulário</legend>
                <div class="form-group">
                    <label for="marca">Marca: </label>
                    <input type="text" name="marca" id="marca" placeholder="Exemplo: Toyota" value="<?=$marca?>" class="form-control"/>
                </div>

                <div class="form-group">
                    <label for="modelo">Modelo: </label>
                    <input type="text" name="modelo" id="modelo" placeholder="Exemplo: Golf 2016" value="<?=$modelo?>" class="form-control"/>
                </div>

                <div class="form-group">
                    <label for="cor"">Cor: </label>
                    <input type="text" name="cor" id="cor" placeholder="Exemplo: Preto" value="<?=$cor?>" class="form-control"/>
                </div>
                <!-- Marca, Modelo, Cor -->
                <div class="form-group">
                    <input type="hidden" name="id" value="<?=$id?>"/>
                    <button type="submit" class="btn btn-dark">Enviar</button>
                </div>
            </fieldset>
        </form>
        <legend>Carros:</legend>
        <div class="form-group">
            <input type="text" id="pesquisar" name="pesquisar" placeholder="Pesquisar" class="form-control"/>
        </div>
        <table class=" table table-dark" id="tabelaCarros">
            <thead>
                <tr>
                    <th>Marca</th>
                    <th>Modelo</th>
                    <th>Cor</th>
                    <th>Editar</th>
                    <th>Excluir</th>
                </tr>
            </thead>
            <tbody>        


                <?php

                    $sql = "SELECT * FROM acesso";

                    $stmt = $conexao->prepare($sql);
                    $stmt->execute();

                    while ($obj = $stmt->fetch(PDO::FETCH_OBJ)) {

                ?>
                    <tr>
                        <td><?=$obj->marca?></td>
                        <td><?=$obj->modelo?></td>
                        <td><?=$obj->cor?></td>
                        <td>
                            <a href="index.php?id=<?=$obj->id?>">
                                Editar
                            </a>
                        </td>
                        <td>
                            <a href="excluir.php?id=<?=$obj->id?>
                            "onclick="return confirm('Deseja realmente excluir?');">
                                Excluir
                            </a>
                        </td>
                    </tr>
                <?php

                    }

                ?>
            </tbody>
        </table>
    </div>
</body>

<script>
    $("#pesquisar").keyup(function() {
        var pesquisar = $(this).val().toLowerCase();

        $("#tabelaCarros tbody tr").each(function() {

            data = $(this).data("pesquisar").toLowerCase();

            if(data.includes(pesquisar)) {
                $(this).show();
            } else {
                $(this).hide();
            }
        })
    });

    function validar(){
        if($("#marca").val() == ""){
            alert("Marca não preenchida. Preencha todos os campos.");
            return false;
        }
        if($("#modelo").val() == ""){
            alert("Modelo não preenchido. Preencha todos os campos.");
            return false;
        }
        if($("#cor").val() == ""){
            alert("Cor não preenchida. Preencha todos os campos.");
            return false;
        }
    }
</script>

1 answer

1


Are you checking first if the $(this).data("pesquisar") is returning some value and not undefined? In your table do not see and attribute "date-search" set, will give error.

Try to use the toLowerCase() at a value null or undefined error, simulated your error below:

$("#pesquisar").keyup(function() {
   console.log('valor = "' + $(this).val() + '"');
   var pesquisar = $(this).val().toLowerCase();
   console.log(pesquisar);
   
   $("#tabelaCarros tbody tr").each(function() {
        var d = $(this).data("pesquisar");
  
        if (d == undefined)
           console.log("d=undefined, vai dar erro");
        else {
           data = $(this).data("pesquisar").toLowerCase();
           console.log("data=" + data);
        }
    });
 });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<p>
<input type="text" id="pesquisar"/>
</p>
<table class=" table table-dark" id="tabelaCarros">
            <thead>
                <tr>
                    <th>Marca</th>
                    <th>Modelo</th>
                    <th>Cor</th>
                    <th>Editar</th>
                    <th>Excluir</th>
                </tr>
            </thead>
            <tbody>        
                    <tr>
                        <td>Marca 1</td>
                        <td>Modelo X></td>
                        <td>Branco</td>
                        <td>
                            <a href="index.php?id=<?=$obj->id?>">
                                Editar
                            </a>
                        </td>
                        <td>
                            <a href="excluir.php?id=<?=$obj->id?>
                            "onclick="return confirm('Deseja realmente excluir?');">
                                Excluir
                            </a>
                        </td>
                    </tr>
                    <tr data-pesquisar="sim">
                        <td>Marca 1</td>
                        <td>Modelo X></td>
                        <td>Branco</td>
                        <td>
                            <a href="index.php?id=<?=$obj->id?>">
                                Editar
                            </a>
                        </td>
                        <td>
                            <a href="excluir.php?id=<?=$obj->id?>
                            "onclick="return confirm('Deseja realmente excluir?');">
                                Excluir
                            </a>
                        </td>
                    </tr>
                
            </tbody>
        </table>

See that on Monday tr added the attribute "date-search" and no error.

  • OK, I understood what you meant and yes the error doesn’t happen anymore but even so now he just from Undefined, I must have missed something in the code but as I’m kind of Noob on this yet, I’m not seeing where I went wrong, or trying to read the values of the bank in the wrong way and he’s picking up Undefined values, because in the other code that I did q search the bank it works perfectly, so it must be me doing stupid msm, only q do not know how to proceed from here because I do not know why he is taking Undefined values, it was supposed to be only tuples of the bank

  • Let’s go in pieces... first, I think this code is strange: var d = $(this).data("pesquisar");. This will take a "data-search" attribute that is not set in your code, you should have something like <tr data-pesquisar=<?=$obj->algumacoisa?>>, but other than that you need to understand what you want to research. That would research something on the whole line, is that right? Or you want to search the columns of each row (brand, template and color) for example?

  • 1

    well after you showed my mistake, I thought of another way to do it and it worked, vlw

Browser other questions tagged

You are not signed in. Login or sign up in order to post.