如何从列表组项目传递数据到PHP文件?

时间:2018-04-24 20:33:48

标签: javascript php html css

我正在制作一个简单的3步表单,第一步是在“事物”列表之间进行选择,而不是制作一个无聊的单选按钮,我选择了一个引导列表组。 但是我如何将用户选择的值传递给PHP文件?

我会将列表组代码粘贴到此处

  <div id="scelta_materia">
    <form method="POST" action="dopo.php">
      <div class="row spazio_scelta">
        <div class="col-4">
          <div class="list-group" id="list-tab" role="tablist">
            <a class="list-group-item list-group-item-action active" id="list-home-list" data-toggle="list" href="#list-home" role="tab" aria-controls="home">Italiano</a>
            <a class="list-group-item list-group-item-action" id="list-profile-list" data-toggle="list" href="#list-profile" role="tab" aria-controls="profile">Storia</a>
            <a class="list-group-item list-group-item-action" id="list-profile-list" data-toggle="list" href="#list-profile" role="tab" aria-controls="profile">Geografia</a>
            <a class="list-group-item list-group-item-action" id="list-messages-list" data-toggle="list" href="#list-messages" role="tab" aria-controls="messages">Matematica</a>
            <a class="list-group-item list-group-item-action" id="list-settings-list" data-toggle="list" href="#list-settings" role="tab" aria-controls="settings">Scienze</a>
            <a class="list-group-item list-group-item-action" id="list-settings-list" data-toggle="list" href="#list-settings" role="tab" aria-controls="settings">Fisica</a>
            <a class="list-group-item list-group-item-action" id="list-settings-list" data-toggle="list" href="#list-settings" role="tab" aria-controls="settings">Inglese</a>
          </div>
        </div>
      </div>
      <button type="submit" class="btn btn-outline-primary spazio_button">Successivo</button>
    </form>
  </div>

1 个答案:

答案 0 :(得分:0)

要做到这一点,你必须使用一些JavaScript代码:

$('#list-tab a').on('click', function (e) {
  e.preventDefault();
  $(this).tab('show');

  // Get user selection
  var userSelection = $(this).text();

  // Check if input does not already exists
  if ($('input[name="my_input"]').length === 0) {
    // Create hidden input
    var input = $('<input type="hidden" name="my_input" />');
    input.val(userSelection)
    // Prepend new input to form
    $('#scelta_materia').find('form').prepend(input);
  } else {
    $('input[name="my_input"]').val(userSelection);
  }
});

例如,如果用户选择Scienze列表组项,则会在表单中添加<input type="hidden" name="my_input" value="Scienze" />

表单提交后,您可以使用$_POST['my_input']

在PHP中检索输入值

我希望它可以帮助你:)