Зависимые значения раскрывающегося списка

Question

Я использую зависимый раскрывающийся список с javascript, где значение другого выбора изменяется на основе предыдущего выбора. Моя проблема в том, что когда я сохраняю данные, они отправляют цифры в базе данных, а не фактические значения, которые я хочу сохранить фактические значения.

Мой код здесь;

    @extends('layout/header')
@include('layout/sidebar')

<div id="page-wrapper">
    <div class="container-fluid">

        <div class="row">
            <div class="col-md-12">
                <h1 class="motetreports_heading"></h1>
                {{-- first sequnce --}}

                <form class="form-horizontal" action="/atgardrr/{{request()->route('id')}}" method="post">
                  {{ csrf_field() }}
                  <div class="form-group">
                    <h3>Huvudkategorier</h3>
                  <select name="huvudkategori" class="form-control artgard_select" id="select1">
                  </select>
                </div>
                <div class="form-group">
                  <h3>Underkategorier 1</h3>
                  <select name="underkategorier1" class="form-control artgard_select" id="select2">
                  </select>
                </div>
                <div class="form-group">
                  <h3>Underkategorier 2</h3>
                  <select name="underkategorier2" class="form-control artgard_select" id="select3">
                  </select>
                </div>

<div style="width: 50%;" class="form-group">
  <h3>Underkategorier 3</h3>
  <input type="text" class="form-control"  name="underkategorier3" id="comment"/ >
</div> 

                      <button type="submit" style="width: 100px;margin-top:20px;" class="btn btn-primary">Skicka</button>

                      </form>




                <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

                <script type="text/javascript">
var opt1 = ['Utredning/Bedömning', 'Stöd', 'Behandling', 'Funktions-/Färdighetsträning','Boende/placering', 'Kontroll/Tvångsåtgärd'],
    opt2 = [
      ['Ansökan/Egen anmälan', 'Remiss/Hänvisning', 'Anmälan av annan', 'Annat'],
      ['Praktiskt', 'Emotionellt/Socialt', 'Materiellt', 'Annan'],
      ['Social/psykosocial', 'Psykologisk', 'Medicinsk', 'Psykiatrisk', 'Annat'],
      ['ADL', 'Social färdighetsträning', 'Fysisk träning', 'Annat'],
      ['Akutboende', 'Familjehem', 'Behandlingshem', 'Stödboende', 'Tvångsvård', 'Annat'],
      ['Kontroll', 'Tvångsåtgärd', 'Annat']
    ],
    opt3 = [
      [
        ['Bedömning', 'Manualbaserat test eller samtal', 'Observation', 'Utredande samtal', 'Provtagning', 'Annat'],
        ['Bedömning', 'Manualbaserat test eller samtal', 'Observation', 'Utredande samtal', 'Provtagning', 'Annat'],
        ['Bedömning', 'Manualbaserat test eller samtal', 'Observation', 'Utredande samtal', 'Provtagning', 'Annat'],
        [ 'Specificering']
      ],
      [
        ['Råd eller Information', 'Stödjande eller Motiverande SAMTAL ', 'Stödjande eller Motiverande AKTIVITET', 'Kompensatorisk aktivitet', 'Annat' ],
        ['Råd eller Information', 'Stödjande eller Motiverande SAMTAL ', 'Stödjande eller Motiverande AKTIVITET', 'Kompensatorisk aktivitet', 'Annat' ],
        ['Ekonomiskt', 'Utrustning/Hjälpmedel', 'Produkt', 'Annat' ],
        [ 'Specificering']
      ],
      [
        ['Behandlande samtal', 'Behandlande aktivitet'],
        ['Behandlande samtal', 'Behandlande aktivitet'],
        ['Medicin', 'Behandlande samtal', 'Annan behandlande insats'],
        ['Medicin', 'Behandlande samtal', 'Annan behandlande insats'],
        [ 'Specificering']
      ],
      [
        [ 'Specificering'],
        [ 'Specificering'],
        [ 'Specificering'],
        [ 'Specificering']
      ],
      [
        [ 'Specificering'],
        [ 'Specificering'],
        [ 'Specificering'],
        ['Stödboende', 'Försöks- & träningslägenhet'],
        ['LVU', 'LVM', 'LPT', 'LRV', 'Annat'],
        [ 'Specificering']
      ],
      [
        ['Drogtest', 'Kroppsvisitation', 'Annat'],
        ['Avskiljning/Inlåsning', 'Bältesläggning', 'Annat'],
        [ 'Specificering']
      ]
    ];
jQuery(document).ready(function() {

  // populating the dropdowns when the page loads...
  jQuery.each(opt1, function(i, e) { jQuery('#select1').append('<option value="'+i+'">'+e+'</option>'); });
  jQuery.each(opt2[0], function(i, e) { jQuery('#select2').append('<option value="'+i+'">'+e+'</option>'); });
  jQuery.each(opt3[0][0], function(i, e) { jQuery('#select3').append('<option value="'+i+'">'+e+'</option>'); });

  // click events
  jQuery('body').on('change', '#select1', function() {
    jQuery('#select2, #select3').empty();
    jQuery.each(opt2[jQuery('#select1').val()], function(i, e) {
      jQuery('#select2').append('<option value="'+i+'">'+e+'</option>');
    });
    jQuery.each(opt3[jQuery('#select1').val()][jQuery('#select2').val()], function(i, e) {
      jQuery('#select3').append('<option value="'+i+'">'+e+'</option>');
    });
  });
  jQuery('body').on('change', '#select2', function() {
    jQuery('#select3').empty();
    jQuery.each(opt3[jQuery('#select1').val()][jQuery('#select2').val()], function(i, e) {
      jQuery('#select3').append('<option value="'+i+'">'+e+'</option>');
    });
  });
});

                </script>


            </div>
        </div>
    </div>
    <!-- /.container-fluid -->
</div>
<!-- /#page-wrapper -->

</div>
<!-- /#wrapper -->

@include('layout/footer')

В базе данных, Получаю:

3   2   0 

Answer 1

Ваши входные данные создаются следующим образом:

<option value="'+i+'">'+e+'</option>'

i - это индекс e - это значение. Поэтому я бы подумал, что если бы вы использовали e для атрибута значения, это сработало бы.

Атрибут value обычно является тем, что форма отправляет в базу данных.

index представляет позицию numeri c в массиве .