Hidden fields appear / modified with a select multiple

What if you used jQuery to check the selected / deselected modes and to show / hide the fields in the change event of the select?

It would look something like this:

$(document).on('change', '#multiple' function(){
    $('#multiple option').each(function(i, e){ 
      var mode = $(e).data("mode");
      var type = $(e).data("type");

      $('[data-mode=' + mode + ']').show();

      if (type != undefined || type != ''){
          $('[data-mode=' + mode + ']').attr('type', type);
      }
    });
});

But for this example, you should add two attributes data- to your inputs. the data-mode and the data-type .

• data-mode = > the way the input should be activated;
• data-type = > the type of the input when it is activated;

Then, according to the example you gave, the inputs would look like this:

<input type="hidden" data-mode="moderador" data-type="date" id="campo-1" name ="campo-1" value="0000">
<input type="hidden" data-mode="administrador" data-type="file" id="campo-2" name ="campo-2" value="0000">

In this case, the first input will be activated for moderador mode and will be of type date , while the second will be activated for administrador mode and will be file type.

This example is also valid for any type of input, select, textarea, etc ..., just have the data-mode attribute. But for elements other than inputs, such as selects for example, you should check for the data-type attribute and if you do not simply display the control.

Editing:

If you need to load data to populate a select while displaying it, you could do it as follows:

<select name="nome" data-ajax-load="true" data-url="/dados.php"></select>

And change the event change to understand these two new attributes, thus:

$(document).on('change', '#multiple' function(){
    $('#multiple option').each(function(i, e){ 
      var mode = $(e).data("mode");
      var type = $(e).data("type");
      var ajax = $(e).data("ajax-load");

      if (ajax)
      {
          var url = $(e).data("url");

          $.ajax({
             cache: false,
             type:  tipo,
             data:  data,
             url: location.origin + "/" + url,
             success: function (response) {
                $(e).html(response);
             }
          });
      }

      $('[data-mode=' + mode + ']').show();

      if (type != undefined || type != ''){
          $('[data-mode=' + mode + ']').attr('type', type);
      }
    });
});

You can use a simple JavaScript to do what you want.

To do this, you can do the submit of the form for the page itself, whenever you change your select as follows:

<form id='formId' action=''>
<!-- ... -->
<select id="hierarquia" name="hierarquia[]" onchange="this.form.submit();" >

In case you need to save the form on another page you have to note that you have to remove action in onchange :

<form id='formId' action='gravar.php'>
<!-- ... -->
<select id="hierarquia" name="hierarquia[]"
   onchange="document.getElementById('formId').action='';this.form.submit();" >

Then just pick up all the fields with POST and put the values collected in your fields:

if($_SERVER['REQUEST_METHOD'] == 'POST')
{
    $value_campo1 = filter_input(INPUT_POST, 'campo-1');
    $hierarquia   = filter_input(INPUT_POST, 'hierarquia');
    //outros valores que precises apanhar
}

Example of a input :

<input type="hidden" id="campo-1" name ="campo-1" 
   value="<?php ($value_campo1 != NULL) ? echo $value_campo1 : echo "0000"?>">

Example of a select coming from DB:

$sql    = "SELECT * FROM table";
$result = mysqli_query( $connection , $sql);
while($row = mysqli_fetch_array($result))
{
    $selected = "";
    // verifica a seleção que já foi feita depois do submit
    if($row['hierarquia']==$hierarquia)   
        $selected = "  selected=\"selected\"";

    echo "<option $selected value='{$row['hierarquia']}'> {$row['hierarquia']} </option>";
}

As for appearing the fields you want depending on mode just do the check before showing the field;

if($_GET['mode']=='admin')
{
?>
     <!-- campo(s) de admin -->
<?php
}
else if($_GET['mode']=='moderador')
{
?>
    <!-- campo(s) de moderador -->
<?php
}