Untitled

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>

<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<!--<link rel="stylesheet" type="text/css" href="material/css/materialize.min.css">-->
<!--<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">-->
<!--<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>-->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>

<title>Asesorias</title>
<link type="text/css" rel="stylesheet" href="materialize/css/materialize.min.css"  media="screen,projection"/>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="materialize/js/materialize.min.js"></script>
<link type="text/css" rel="stylesheet" href="tooltip.css"/>
    <script type="text/javascript" src="asesorias.js"></script>


<?php
    $bd = "tasesorias";
    $server = "localhost";
    $user = "root";
    $pass = "";

    $conexion = @mysqli_connect($server, $user, $pass, $bd);
    if( !$conexion) die( "error de conexion".mysqli_connect_error());

    $query = "SELECT * FROM lista";
    // $res = mysql_query($query);
    $res = mysqli_query($conexion, $query);

?>

<div class="card-panel teal lighten-2 z-depth-5">
    <center><h5>Asesorias</h5></center>
</div>

<form id="asesoria" role="form"><!--action="guardar.php" method="POST" name="form"  -->
    <div class="row">

        <div class="input-field col s8 offset-s2">
            <input type="text" id="nombreAsesor" name="nombreAsesor" class="validate" data-length="50">
            <label>Nombre del (a) asesor (a):</label>
        </div>
        <div class="input-field col s8 offset-s2">
            <input type="text" id="programaAcademico" name="programaAcademico" class="validate" data-length="70">
            <label>Programa académico al que está inscrito: </label>
        </div>

        <!--Regresar valores de la BD con ajax porque soy la verga XD-->
        <!-- <div class="input-field col s6 offset-s2">
            <input type="text" id="alumno" name="alumno" class="validate" data-length="50">
            <label>Nombre del alumno: </label>
        </div> -->


        <div class="input-field col s6 offset-s2" >
    <select>
            <!-- <option value="" disabled selected id="lista_nombre" name="lista_nombre" >Elige una opción</option>
            <option></option> -->
        </select>

    <label>Nombre del alumno: </label>
</div>


        <!-- <div class="input-field col s2">
            <input type="text" id="matricula" onkeypress="return valida(event)"  name="matricula" class="validate" data-length="6">
            <label>Matricula: </label>
        </div> -->

        <!-- select matricula -->
        <div class="input-field col s2">
<select>
  <!-- <option value="" disabled selected>Choose your option</option>
  <option value="1">Option 1</option>
  <option value="2">Option 2</option>
  <option value="3">Option 3</option> -->
</select>
<label>Matricula</label>

<div class="input-field col s8 offset-s2 page-header">
            <h3>
                <select id="getAlumnos">
                <option value="showAll" selected="selected">Show All Products</option>
                    <?php while ($row=mysql_fetch_array($res)){ ?>
                        <option value="<?php echo $row['nombre']?>"><?php echo $row['nombre']; ?> </option>
                    <?php } ?>
                </select>
            </h3>
        </div>

        <!--onkeyup="return ValNumero(this);"-->
        <div class="input-field col s6 offset-s2">
            <input type="text" id="tema" name="tema" class="validate" data-length="150">
            <label>Tema: </label>
        </div>
        <div class="col s2">
            <select name="tipo" id="tipo">
                <option value="" disabled selected>Elige una opción</option>
                <option value="Individual">Individual</option>
                <option value="Grupal">Grupal</option>
            </select>
            <label>Asesorias</label>
        </div>
        <div class="input-field col s8 offset-s2">
            <input type="text" id="acuerdos" name="acuerdos" class="validate" data-length="170">
            <label>Acuerdos: </label>
        </div>
        <div class="input-field col s6 offset-s2">
            <input type="date" id="fecha" name="fecha" class="fecha">
        </div>
        <div class="input-field col s2">
            <input type="text" id="duracion" name="duracion" class="validate" data-length="20">
            <label>Duración</label>
        </div>
        <div class="col s2 offset-s10 tooltip">
            <button class="btn waves-effect waves-light pulse" type="submit" onclick="enviar()">Guardar
                <i class="material-icons right">send</i>
                <!--<a href="mostrar.php"></a>   name="action"para el boton-->
            </button>
            <span class="tooltiptext">Guardar en la base de datos</span>
        </div>
    </div>
</form>
<!--<div class="tooltip">Hover over me
    <span class="tooltiptext">Tooltip text</span>
</div>-->


<script type="text/javascript">
    function valida(e){
        tecla = (document.all) ? e.keyCode : e.which;
        //Tecla de retroceso para borrar, siempre la permite
        if (tecla==8){
            return true;
        }
        // Patron de entrada, en este caso solo acepta numeros
        patron =/[0-9]/;
        tecla_final = String.fromCharCode(tecla);
        return patron.test(tecla_final);
    }


    //valida solo numero y al ingresar una letra la borra...
    /*function Solo_Numerico(variable){
        Numer=parseInt(variable);
        if (isNaN(Numer)){
            return "";
        }
        return Numer;
    }
    function ValNumero(Control){
        Control.value=Solo_Numerico(Control.value);
    }*/

    function enviar(){
        var varasesor = document.getElementById("nombreAsesor").value;
        var varpacademico = document.getElementById("programaAcademico").value;
        var varalumno = document.getElementById("alumno").value;
        var varmatricula = document.getElementById("matricula").value;
        var vartema = document.getElementById("tema").value;
        var vartipo = document.getElementById("tipo").value;
        var varacuerdos = document.getElementById("acuerdos").value;
        var varfecha = document.getElementById("fecha").value;
        var varduracion = document.getElementById("duracion").value;
        //alert(n1 + " " + n2 + " " + n3 + " " + n4);

        if (varasesor=="" || varpacademico=="" || varalumno=="" || varmatricula=="" || vartema=="" || vartipo=="" || varacuerdos=="" || varfecha=="" || varduracion=="") {
            alert("Campos vacios, por favor ingrese datos en todos los campos");
        }else{
            var frm = $("#asesoria").serialize();
            console.log( frm );
            //pasar parametros de archivos al servidor
            $.ajax({
                type: "POST",
                url: "guardar.php",
                data: frm
            }).done(function(info){//trae informacion desde el servidor
                console.log ( info );
            });
        }
    }

    /*$("#enviar").on("click",function(e){
        e.preventDefault();
        var frm = $("#asesoria").serialize();
        console.log( frm );
        //pasar parametros de archivos al servidor
        $.ajax({
            type: "POST",
            url: "guardar.php",
            data: frm
        }).done(function(info){//trae informacion desde el servidor
            console.log ( info );
        });
    });*/


    $('.fecha').pickadate({
        selectMonths: true, // Creates a dropdown to control month
        selectYears: 15, // Creates a dropdown of 15 years to control year,
        today: 'hoy',
        clear: 'limpiar',
        close: 'Ok',
        closeOnSelect: false // Close upon selecting a date,
    });
</script>
<script type="text/javascript">
    $(document).ready(function(){
     // function to get all records from table
     function getAll(){

      $.ajax
      ({
       url: 'getAlumnos.php',
       data: 'action=showAll',
       cache: false,
       success: function(r)
       {
        $("#display").html(r);
       }
      });
     }

     getAll();
     // function to get all records from table


     // code to get all records from table via select box
     $("#getAlumnos").change(function(){
      var id = $(this).find(":selected").val();

      var dataString = 'action='+ id;

      $.ajax
      ({
       url: 'getAlumnos.php',
       data: dataString,
       cache: false,
       success: function(r)
       {
        $("#display").html(r);
       }
      });
     })
     // code to get all records from table via select box
    });