Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

André Luís

Jump menu ou menu de salto

Recommended Posts

Olá pessoal!

Preciso de uma ajuda, por favor.

A situação é a seguinte: estou criando um formulário de inscrição para cursos. Tenho 4 cursos diferentes. Sendo assim, quem se inscreve deve escolher no mínimo 2 deles, pois é feito um processo seletivo.

Daí, durante o preenchimento da ficha de inscrição, tem-se a seguinte parte de escolha de cursos:

<form>
1a. OPÇÃO:  
<select name="jumpMenu" id="jumpMenu">
    <option>item1</option>
    <option>item2</option>
    <option>item3</option>
    <option>item4</option>
  </select>
---------------------------------------------
Eu gostaria de que, por exemplo, se o candidato escolhese o item1 como 1a. opção, este saísse automaticamente da lista de opções na hora de escolher a 2a. opção, e assim sucessivamente, até a 4a. opção.
-----------------------
Então na segunda opção ficaria:
2a. OPÇÃO:  
<select name="jumpMenu" id="jumpMenu">
    <option>item2</option>
    <option>item3</option>
    <option>item4</option>
  </select>

3a. OPÇÃO:  
<select name="jumpMenu" id="jumpMenu">
    <option>item2</option>
    <option>item4</option>
  </select>

4a. OPÇÃO:  
<select name="jumpMenu" id="jumpMenu">
    <option>item2</option>
</select>

</form>

 

Desde já agradeço pela atenção de todos.

 

André

Compartilhar este post


Link para o post
Compartilhar em outros sites

Tecnicamente, vc terá q utilizar javascript e não php para fazer isso.

 

Mas existe um flow melhor, do q "excluir" opções do select.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá William!

Eu me expressei mal. Não é excluir, apenas desabilitar as que já foram escolhidas anteiormente.

Você pode me dar uma referência para este flow?

Grato.

André

Compartilhar este post


Link para o post
Compartilhar em outros sites

Pediram algo exatamente igual no fórum de javascript.

 

http://forum.imasters.com.br/topic/523621-desabilitar-radio-buttons-de-valor-igual/#entry2086451

 

Ali, com radio buttons.

Compartilhar este post


Link para o post
Compartilhar em outros sites

William,

 

Eu tenho dúvidas para adaptar aquele código para esse caso onde se usa o select.

 

<html>
<head>


</head>
<body>
1a. OPÇÃO:  
<select name="curso1" id="curso1" >
    <option value="item1">item1</option>
    <option value="item2">item2</option>
    <option value="item3">item3</option>
    <option value="item4">item4</option>
  </select>
<br>
2a. OPÇÃO:  <select name="curso2" id="curso2">
    <option value="item1">item1</option>
    <option value="item2">item2</option>
    <option value="item3">item3</option>
    <option value="item4">item4</option>
  </select>
<br>
3a. OPÇÃO:  <select name="curso3" id="curso3">
    <option value="item1">item1</option>
    <option value="item2">item2</option>
    <option value="item3">item3</option>
    <option value="item4">item4</option>
  </select>
<br>
4a. OPÇÃO:  <select name="curso4" id="curso4">
    <option value="item1">item1</option>
    <option value="item2">item2</option>
    <option value="item3">item3</option>
    <option value="item4">item4</option>
  </select>




<script>
(function(){
  var choices = {};


  function enable_all($elements) {
    var $elements = [].slice.call($elements);
    $elements.forEach(function($each){
      if (!$each.checked) { // DEVERIA SER SELECTED ?
        console.log($each);
        $each.removeAttribute("disabled");
      }
    });
  }
  function disable_all($elements) {
    var $elements = [].slice.call($elements);
    $elements.forEach(function($each){
      if (!$each.checked) {
        $each.setAttribute("disabled", "disabled");
      }
    });
  }
  function disable_all_of_same_value(value) {
    var $radios = document.querySelectorAll();
    disable_all($radios);
  }
  function enable_all_of_same_value(value) {
    var $radios = document.querySelectorAll('DEVERIA SER O NOME DA DIVS?');
    enable_all($radios);
  }


  var $radios = document.querySelectorAll("DEVERIA SER SELECT");
  $radios = [].slice.call($radios);


  $radios.forEach(function($each){
    $each.addEventListener("click", function() {
      if (choices[this.name]) {
        enable_all_of_same_value(choices[this.name]);
      }


      choices[this.name] = this.value;
      disable_all_of_same_value(this.value);
    });
  });


}());
</script>
</body>
</html>

Eu tentei fazer isso que está comentado no código, mas não consegui.

Por favor, peço paciência pois não estou familiarizado com esta linguagem.

Se puder me ajudar cara, ficaria muito grato.

 

Abraço.

Compartilhar este post


Link para o post
Compartilhar em outros sites


<select multiple name="curso[]" id="curso3">

<option value="item1">item1</option>

<option value="item2">item2</option>

<option value="item3">item3</option>

<option value="item4">item4</option>

</select>

 


<?php

// para pegar os dados no POST você utiliza assim

foreach($_POST["curso"] as $valor){

echo $valor;

}

?>

Compartilhar este post


Link para o post
Compartilhar em outros sites

<html>

<head>

 

 

</head>

<body>

1a. OPCAO: <select name="curso1" id="curso1" >

<option value="item1">item1</option>

<option value="item2">item2</option>

<option value="item3">item3</option>

<option value="item4">item4</option>

</select>

<br>

2a. OPCAO: <select name="curso2" id="curso2">

<option value="item1">item1</option>

<option value="item2">item2</option>

<option value="item3">item3</option>

<option value="item4">item4</option>

</select>

<br>

3a. OPCAO: <select name="curso3" id="curso3">

<option value="item1">item1</option>

<option value="item2">item2</option>

<option value="item3">item3</option>

<option value="item4">item4</option>

</select>

<br>

4a. OPCAO: <select name="curso4" id="curso4">

<option value="item1">item1</option>

<option value="item2">item2</option>

<option value="item3">item3</option>

<option value="item4">item4</option>

</select>

 

 

 

 

<script>

(function(){

var choices = {};

 

 

function enable_all($elements) {

var $elements = [].slice.call($elements);

$elements.forEach(function($each){

if (!$each.selected) {

$each.removeAttribute("disabled");

}

});

}

function disable_all($elements) {

var $elements = [].slice.call($elements);

$elements.forEach(function($each){

if (!$each.selected) {

$each.setAttribute("disabled", "disabled");

}

});

}

function disable_all_of_same_value(value) {

var $options = document.querySelectorAll('option[value="'+value+'"]');

disable_all($options);

}

function enable_all_of_same_value(value) {

var $options = document.querySelectorAll('option[value="'+value+'"]');

enable_all($options);

}

 

var $selects = document.querySelectorAll('select');

$selects = [].slice.call($selects);

 

$selects.forEach(function($each){

$each.addEventListener("change", function() {

if (choices[this.name]) {

enable_all_of_same_value(choices[this.name]);

}

 

choices[this.name] = this.value;

disable_all_of_same_value(this.value);

});

});

}());

</script>

</body>

</html>

:lol:

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.