I've been working on a school project for my state exam and I've encountered some problems with getting data from the database with a php file.
HTML:
<!DOCTYPE html>
<html class="no-js" lang="en-US">
    <head>
        <title>Programma Scolastico</title>
        <link rel="icon" href="Immagini/icon.png">
        <link rel="stylesheet" href="Css/CssSitoWeb.css">
        <link rel="stylesheet" href="Css/animate.min.css">
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    </head>
    <body>
        <script src="https/ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
        <script src="Js/jquery.lettering.js"></script>
        <script src="Js/jquery.textillate.js"></script>
        <script src="Js/app.js"></script>
        <div id="background">
            <div id="in-back">
                <span class="title">Programma 5AIA</span>
                </br><button id="column-opener">Vade</button>
            </div>
        </div>
        <div id="paragraph-column">
        </div>
    </body>
</html>
Here's the php file which gives problem ( Undefined index: idMateria -- line 5)
ElencoArgomentiByMaterie.php:
<?php
    include 'CredenzialiAccesso.php';
    $conn = new PDO ($str, $user, $pwd);
    $stmt = $conn -> prepare("SELECT * FROM Argomento WHERE Materia_idMateria = :idMat")
    $stmt -> bindValue(':idMat', $_GET["idMateria"]);
    if ($stmt -> execute())
    {
        echo json_encode($stmt -> fetchAll());
    }
?>
Here's the function which create the buttons used to trigger onClick event:
$( document ).ready(function()
{
    $(function ()
    {
        $('.title').textillate(
        {
            in: {effect: 'rollIn'}
        });
    })
$("#column-opener").click(function()
    {
        $("#background").animate({left: '272px'});
        $("#in-back").animate({right: '125px'});
        $("#column-opener").hide();
        $.getJSON( "Php/ElencoMaterie.php", function(res)
        {
            var form = $('<form></form>');
            $.each(res, function(k, v)
            {
                var input = $('<input type="button" onclick="ArgomentoByMateria('+v['idMateria']+')" value="'+ v['nomeMateria'] +'" id="buttonMateria"/>');
                //var input = $('<input type="button" value="' + v['nomeMateria'] + '" id="buttonMateria" />');
                form.append(input);
            });
            $("#paragraph-column").empty().append(form);
        });
    });
});
Here's the function triggered while clicking:
function ArgomentoByMateria(idMat)
{
    $.getJSON("Php/ElencoArgomentiByMaterie.php", {'idMateria':idMat}, function(res)
    {
        $("#in-back").animate({right: '50px'});
        $("#in-back").css("margin", "130px 100px 50px 250px");
        $("#in-back").animate({top: '30px'});
        //$("#in-back").css("margin-top" , "50px");
        $("span").css("font-size" , "50px");
        if (res.length > 0)
        {
            $.each(res, function(k, v)
            {
                var row = $('<span>'+v['descrizione']+'</span> <button onclick="SottoArgomentoByArgomento('+v['idArgomento']+')" value="+"/></ br>');
                //var row = $('<span>'+v['descrizione']+'</span></ br>');
            });
            $("#in-back").append(row);
        }
    });
}
ElencoMaterie.php:
<?php
    include 'CredenzialiAccesso.php';
    $conn = new PDO ($str, $user, $pwd);
    $stmt = $conn -> prepare("SELECT nomeMateria FROM Materia");
    if ($stmt -> execute())
    {
        echo json_encode($stmt -> fetchAll());
    }
?>
PS: Sorry for bad english.
