How to fill select with javascript php and jquery?

1

I would like you to help me with the doubt I have

<head>
    <meta charset = "UTF-8">
    <title>Formulario de registro</title>
    <link rel="stylesheet" href="../css/reg.css">
    <script src="../js/llenar.js"></script>
</head>
<body>
    <h1>Formulario de registro</h1>
    <form action="php/regcap.php" method= "post" class = "form-registro">
        <h2> Crear capitanes</h2>
        <div class ="contenedor-input">
            <input type = "text" name = "cedula" placeholder = "Cedula" class = "input-100" required>
            <input type = "text" name = "nombre" placeholder = "Nombres" class = "input-48" required>
            <input type = "text" name = "apellido" placeholder = "Apellidos" class = "input-48" required>
            <input type = "text" name = "user" placeholder = "Usuario" class = "input-48" required>
            <input type = "text" name = "pwd" placeholder = "Contraseña" class = "input-48" required>
            <select name = "congregacion" class = "input-100" required>
                <option value = "escoga una congregacion">Escoga una congregación</option>
            </select>
            <input type = "submit" value = " Registrar capitan" class = "btn-enviar">
        </div>      
    </form>
</body>

and this is javascript

import ("jquery-3-2-1.min.js");
window.onload = function(){
    alert("hola");
    $("#cmbCongregacion").onload(function(){
        $.post("php/llenar1.php",function(data){
            $("#cmbCongregacion").html(data);
            alert("hola otra vez!");
        });
    });
    alert($.post);
}

As I read, the file of jquery should be imported, but I do not know if it is right or wrong

The truth is I do not know if it was well written and I found something similar, but the truth does not load the select , it can be done directly in the code of the page but I want to learn to do it this way, it seems to me that It looks more professional.

If anyone knows of a good manual for beginners I would appreciate it

I add the result of the console.

    
asked by Familia Valencia Hdz 28.12.2017 в 19:42
source

1 answer

1

You have 3 errors

  • Your select does not have id="cmbCongregacion" .
  • Line $("#cmbCongregacion").onload(function(){ is not necessary.
  • You are not including jQuery correctly.

Solution:

llena.js:

window.onload = function() {
  alert("hola!");
  $.post("php/llenar1.php", function(data) {
    $("#cmbCongregacion").html(data);
    alert("hola otra vez!");
  });
}

HTML

<head>
  <meta charset="UTF-8">
  <title>Formulario de registro</title>
  <link rel="stylesheet" href="../css/reg.css">

  <!-- AQUI incluimos jQuery -->
  <script src="../js/jquery-3-2-1.min.js"></script>

  <script src="../js/llenar.js"></script>
</head>

<body>
  <h1>Formulario de registro</h1>
  <form action="php/regcap.php" method="post" class="form-registro">
    <h2> Crear capitanes</h2>
    <div class="contenedor-input">
      <input type="text" name="cedula" placeholder="Cedula" class="input-100" required>
      <input type="text" name="nombre" placeholder="Nombres" class="input-48" required>
      <input type="text" name="apellido" placeholder="Apellidos" class="input-48" required>
      <input type="text" name="user" placeholder="Usuario" class="input-48" required>
      <input type="text" name="pwd" placeholder="Contraseña" class="input-48" required>

      <!-- AQUI agregamos el ID al select -->
      <select id="#cmbCongregacion" name="congregacion" class="input-100" required>
                <option value = "escoga una congregacion">Escoga una congregación</option>
            </select>
      <input type="submit" value=" Registrar capitan" class="btn-enviar">
    </div>
  </form>
</body>
    
answered by 28.12.2017 / 20:06
source