Skip to main content
Publicación cerrada como "No adecuado para este sitio" por Mariano, bypabloc_, toledano, Jose D. Jurado, Patrick

Mi código lo que hace es que, una vez elegida una opción en un select, en los demás selectselect la deshabilita, cosa que no funciona con los selectselect añadidos dinámicamente. ¿Alguien sabe porqué?

EDIT:EDIT:
Ya logré que ejecute la función volviéndola a escribir después de crear el elemento. Ahora lo que pasa es que los nuevos elementos no aparecen con las opciones deshabilitadas en los otros.

Mi código lo que hace es que, una vez elegida una opción, en los demás select la deshabilita, cosa que no funciona con los select añadidos dinámicamente. ¿Alguien sabe porqué?

EDIT: Ya logré que ejecute la función volviéndola a escribir después de crear el elemento. Ahora lo que pasa es que los nuevos elementos no aparecen con las opciones deshabilitadas en los otros.

Mi código lo que hace es que, una vez elegida una opción en un select, en los demás select la deshabilita, cosa que no funciona con los select añadidos dinámicamente. ¿Alguien sabe porqué?

EDIT:
Ya logré que ejecute la función volviéndola a escribir después de crear el elemento. Ahora lo que pasa es que los nuevos elementos no aparecen con las opciones deshabilitadas en los otros.

Errores de ortografía
Origen Enlace
Mariano
  • 24.5k
  • 20
  • 76
  • 105

¿Porqué ¿Por qué elementos dinámicos no ejecutan las funciones definidas con anterioridad?

Tengo este código con los elementos creados inicialmente funciona de maravilla pero una vez que usas el botón de añadir los nuevos elementos no ejecutan la función.

Aquí mi código (también en jsfiddle):

$(".selectClass").change(function() {
  $("select option").prop("disabled", false);
  $(".selectClass").not($(this)).find("option[value='" + $(this).val() + "']").prop("disabled", true);
  console.log('in');
});

$(".addButton").click(function() {
  $('.myOptions').append(`<select class="selectClass">
                            <option value="default">Select one</option>
                            <option value="1">1</option>
                            <option value="2">2</option>
                            <option value="3">3</option>
                            <option value="4">4</option>
                            <option value="5">5</option>
                            <option value="6">6</option>
                        </select>`);
})
<!-- jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<!-- HTML -->
<button class="addButton">Add</button>
<div class="myOptions">
  <select class="selectClass">
    <option value="default">Select one</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
  </select>
  <select class="selectClass">
    <option value="default">Select one</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
  </select>
  <select class="selectClass">
    <option value="default">Select one</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
  </select>
  <select class="selectClass">
    <option value="default">Select one</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
  </select>
</div>

Mi código lo que hace es que, una vez elegida una opción, en los demás select la deshabilita, cosa que no funciona con los select añadidos dinamicamentedinámicamente. ¿Alguien ¿Alguien sabe porqué? Saludos.

Aqui mi código

¿Porqué elementos dinámicos no ejecutan las funciones definidas con anterioridad?

Tengo este código con los elementos creados inicialmente funciona de maravilla pero una vez que usas el botón de añadir los nuevos elementos no ejecutan la función. Mi código lo que hace es que una vez elegida una opción en los demás select la deshabilita, cosa que no funciona con los select añadidos dinamicamente. ¿Alguien sabe porqué? Saludos.

Aqui mi código

¿Por qué elementos dinámicos no ejecutan las funciones definidas con anterioridad?

Tengo este código con los elementos creados inicialmente funciona de maravilla pero una vez que usas el botón de añadir los nuevos elementos no ejecutan la función.

Aquí mi código (también en jsfiddle):

$(".selectClass").change(function() {
  $("select option").prop("disabled", false);
  $(".selectClass").not($(this)).find("option[value='" + $(this).val() + "']").prop("disabled", true);
  console.log('in');
});

$(".addButton").click(function() {
  $('.myOptions').append(`<select class="selectClass">
                            <option value="default">Select one</option>
                            <option value="1">1</option>
                            <option value="2">2</option>
                            <option value="3">3</option>
                            <option value="4">4</option>
                            <option value="5">5</option>
                            <option value="6">6</option>
                        </select>`);
})
<!-- jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<!-- HTML -->
<button class="addButton">Add</button>
<div class="myOptions">
  <select class="selectClass">
    <option value="default">Select one</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
  </select>
  <select class="selectClass">
    <option value="default">Select one</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
  </select>
  <select class="selectClass">
    <option value="default">Select one</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
  </select>
  <select class="selectClass">
    <option value="default">Select one</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
  </select>
</div>

Mi código lo que hace es que, una vez elegida una opción, en los demás select la deshabilita, cosa que no funciona con los select añadidos dinámicamente. ¿Alguien sabe porqué?

¿Por que ¿Porqué elementos dinamicosdinámicos no ejecutan las funciones definidas con anterioridad?

Tengo este código, con los elementos creados inicialmente funciona de maravilla, pero una vez que usas el botón de añadir, los nuevos elementos no ejecutan la función, mi. Mi código lo que hace es que una vez elegida una opción en los demás select la deshabilita, cosa que no funciona con los select añadidos dinamicamente, alguien. ¿Alguien sabe porqueporqué? Saludos.

Aqui mi código

EDIT: Ya logrelogré que ejecute la funcion volviendolafunción volviéndola a escribir despuesdespués de crear el elemento, ahora. Ahora lo que pasa es que los nuevos elementos no aparecen con las opciones deshabilitadas en los otros.

¿Por que elementos dinamicos no ejecutan las funciones definidas con anterioridad?

Tengo este código, con los elementos creados inicialmente funciona de maravilla, pero una vez que usas el botón de añadir, los nuevos elementos no ejecutan la función, mi código lo que hace es que una vez elegida una opción en los demás select la deshabilita, cosa que no funciona con los select añadidos dinamicamente, alguien sabe porque? Saludos.

Aqui mi código

EDIT: Ya logre que ejecute la funcion volviendola a escribir despues de crear el elemento, ahora lo que pasa es que los nuevos elementos no aparecen con las opciones deshabilitadas en los otros

¿Porqué elementos dinámicos no ejecutan las funciones definidas con anterioridad?

Tengo este código con los elementos creados inicialmente funciona de maravilla pero una vez que usas el botón de añadir los nuevos elementos no ejecutan la función. Mi código lo que hace es que una vez elegida una opción en los demás select la deshabilita, cosa que no funciona con los select añadidos dinamicamente. ¿Alguien sabe porqué? Saludos.

Aqui mi código

EDIT: Ya logré que ejecute la función volviéndola a escribir después de crear el elemento. Ahora lo que pasa es que los nuevos elementos no aparecen con las opciones deshabilitadas en los otros.

se añadieron 197 caracteres en el cuerpo
Origen Enlace
Loading
se añadió 1 carácter en el cuerpo
Origen Enlace
Loading
Origen Enlace
Loading