Error in Jquery pro PHP parameter crossing

Question

I’m making a modal that has its content according to the link clicked.

As the content is loaded from BD, inside the modal opening Jquery I made a call in Ajax to a PHP. In this PHP I will access the database and return a table with the data. This table will be the content of the modal.

But I am unable to recover the parameter passed by Ajax in PHP.

Error:

Notice: Undefined index: idCategoria in C:\xampp\htdocs\canaa\gerarTabelaProduto.php on line 5

Notice: Undefined property: mysqli::$num_rows in C:\xampp\htdocs\canaa\gerarTabelaProduto.php on line 9

Jquery / Ajax:

$.ajax({
                    url: "gerarTabelaProduto.php",
                    type: "POST",
                    data: {
                        idCategoria: id
                    },
                    contentType: false,
                    cache: false,
                    processData:false,
                    success: function(data)
                    {
                        $("#conteudoModalProduto").html(data);
                    }
                });

PHP:

<?php

require_once "admin/conexao.php";

$idCategoria = $_POST["idCategoria"];
$nomeCategoria = "";

$categoria = $conexao->query("SELECT * FROM categoria WHERE idCategoria =".$idCategoria);
if($conexao->num_rows <> 0){
   $nomeCategoria = $categoria['nome'];
}

echo $nomeCategoria;
?>

Answer 1

The problem is that you are passing an empty variable.

data: {idCategoria: id } // Esse id ta vindo de onde??? Ele não foi declarado

The correct is to take the value of this ID of some input or attribute of some html tag, for example: you said you have a modal that will open with different content according to the link, so you can put like this:

<a href="#modal" class="btn-modal" id="<?php echo $id_categoria ?>">Abrir Modal</a> <!-- Acredito que você gere esses links dinamicamente. -->

Ai lah no ajax you take this value as follows:

 $(document).ready(function(){
    $('.btn-modal').click(function(){
        var id = $(this).attr('id'); // Agora sim a variável ID tem um valor

        $.ajax({
            url: "gerarTabelaProduto.php",
            type: "POST",
            data: {
                'idCategoria': id
            },
            contentType: false,
            cache: false,
            processData:false,
            success: function(data)
            {
                $("#conteudoModalProduto").html(data);
            }
        });
    });
});

Answer 2

Try to pass as string.

Another tip is to see the request by the browser. In the case of Chrome or Firefox has the tab network that you can see the request and the parameters being passed.

$.ajax({
                    url: "gerarTabelaProduto.php",
                    type: "POST",
                    data: {
                        'idCategoria': id
                    },
                    contentType: false,
                    cache: false,
                    processData:false,
                    success: function(data)
                    {
                        $("#conteudoModalProduto").html(data);
                    }
                });

Answer 3

Set the processData option to true:

$.ajax({
                    url: "gerarTabelaProduto.php",
                    type: "POST",
                    data: {
                        idCategoria: id
                    },
                    cache: false,
                    processData: true,
                    success: function(data)
                    {
                        $("#conteudoModalProduto").html(data);
                    }
                });