1

I was wondering if someone got an idea how to remove a choice you made in multiple dropdown menus.

I have no idea if you can do it with dropdown menu's maybe I need datalist or something else.

But what I mean is I have for example 6 dropdown menu's like this dropdown menu's

I made it so you have 1 - 6 but if I choose number 3 in the first one, how can I remove it in the 2nd menu, or make in invisible.

I had this problem in multiple projects from me but never know how to solve it.

Code of 1 of the menu's

<select name="getal" form="enquete" />

  <?php
    for($i=1; $i<=5; $i++)
    {
      echo "<option value=".$i.">".$i."</option>";
    }
  ?> 
</select>
j08691
  • 204,283
  • 31
  • 260
  • 272
  • You need JavaScript for that. You can't do that with just PHP. –  May 19 '17 at 08:09
  • Alright , thats fine , i already thought you need javascript or jquery. But How do i do it than –  May 19 '17 at 08:35
  • 1
    You set `onchange` for each ` –  May 19 '17 at 09:21
  • ... and there's a fine how-to remove an – cjs1978 May 19 '17 at 09:43
  • Here's one way: https://jsfiddle.net/khrismuc/rynuo1bz/ –  May 19 '17 at 09:54
  • If you are using react you can build the select options dynamically in the render method leaving out the option you don't need with an if statement inside of the loop that builds the select options. – fungusanthrax May 19 '17 at 15:27
  • you can check this [FIDDLE](https://jsfiddle.net/hwctc2g5/) (not removed, disabled, easy change) – OldPadawan May 19 '17 at 18:23

2 Answers2

0
 $("#drop1").change(function () {
        var d1 = this.value;
        if(d1==3)
        {
        $('#drop3').hide();
        }
    });
Rajaguru R
  • 96
  • 1
  • 8
0

Let´s say you got 2 option select items like this:

<select name="getal" form="enquete" class="selectmenu"/>
<?php
      for($i=1; $i<=5; $i++)
    {
      echo "<option value=".$i.">".$i."</option>";
    }
?> 
</select>
<select name="getal2" form="enquete" class="selectmenu"/>
<?php
  for($i=1; $i<=5; $i++)
  {
    echo "<option value=".$i.">".$i."</option>";
  }
?> 
</select>

You can add 2 jquery selectors - they can be dynamic - I´m showing you how to do it with 2 dropdown lists:

var $drop1 = $("#geta1");
var $drop2 = $("#geta2");

Create a function to react on change of dropdown 1 (again, you can do it on each beside the clicked one):

$drop1.change(function() {
    var selectedItem = $(this).val();
    if (selectedItem) {
        $drop2.find('option[value="' + selectedItem + '"]').remove();
    }
});

We are just removing the options, if you want you can re-add them when changed again. Create one array and iterate through the options, if not present, append the missing options.

Is this what you want to do?

Curious Mind
  • 659
  • 10
  • 26