bootstrap раскрывающийся список выберите подтвердить кнопкой - PullRequest
0 голосов
/ 31 января 2020

после выбора элемента из выпадающего меню пользователь подтвердит выбор, нажав кнопку. а затем должен переместить его на страницу, назначенную для этого элемента, как это сделать? После выбора элемента из выпадающего меню пользователь подтвердит выбор, нажав кнопку. а затем должен переместить его на страницу, назначенную для этого элемента, как это сделать?

спасибо:)

<!DOCTYPE html>
<html>
<head>
  <title>Bootstrap-select Tests (Bootstrap 4)</title>

  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.9/dist/css/bootstrap-select.min.css">

  <style>
    body {
        padding-top: 70px;
        margin-left: 200px;
    }

  </style>
</head>
<body>

  <select class="selectpicker" data-width="75%" data-live-search="true" title="Wybierz urządzenie...">
    <optgroup label="Producent1">
      <option><a href="#">Maszyna 1</a></option>
      <option>Maszyna 2</option>
      <option>Maszyna 3</option>
    </optgroup>
    <optgroup label="Producent1">
      <option>Maszyna 1</option>
      <option>Maszyna 2</option>
      <option>Maszyna 3</option>
    </optgroup>
  </select>
<br>
<br>
<br>
<br>
    <button type="button" data-width="75%" class="btn btn-lg btn-danger">Szukaj!</button>

  

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.bundle.min.js"></script>
<script src="../dist/js/bootstrap-select.js"></script>


</body>
</html>

Ответы [ 2 ]

0 голосов
/ 01 февраля 2020

отметьте это: html файл:

<form action="page.php" method="post">
    <div class="form-group">
        <label for="selectedItem"> select:</label>
        <select class="form-control" id="selectedItem" name="selectedItem">
            <optgroup label="Producent1">
                <option value="Maszyna1">Maszyna 1</option>
                <option value="Maszyna2">Maszyna 2</option>
                <option value="Maszyna3">Maszyna 3</option>
            </optgroup>
            <optgroup label="Producent2">
                <option value="Maszyna4">Maszyna 4</option>
                <option value="Maszyna5">Maszyna 5</option>
                <option value="Maszyna6">Maszyna 6</option>
            </optgroup>
        </select>

    </div>
    <button type="submit" id="btnRedirect" data-width="75%" class="btn btn-lg btn-danger">Szukaj!</button>
</form>

страница. php файл:

<?php
$addresses=array(
'Maszyna1'=>'https://facebook.com',
'Maszyna2'=>'https://google.com',
'Maszyna3'=>'https://twitter.com/',
);
if (isset($_POST['selectedItem']) && !empty($_POST['selectedItem'])){
  $selectedItem=$_POST['selectedItem'];
 foreach ($addresses as $key=> $address){
     if ($selectedItem===$key)
         header("Location:".$address);
 }
}
?>



0 голосов
/ 31 января 2020

поместите его в тег формы с атрибутами действия и метода и измените тип кнопки для отправки. что-то вроде этого:

<div class="container">

    <div class="form-group">
        <label for="selectedItem"> select:</label>
        <select class="form-control" id="selectedItem" name="selectedItem">
            <optgroup label="Producent1">
                <option value="https://www.facebook.com/">Maszyna 1</option>
                <option value="https://www.google.com/">Maszyna 2</option>
                <option value="Maszyna3">Maszyna 3</option>
            </optgroup>
            <optgroup label="Producent2">
                <option value="Maszyna3">Maszyna 3</option>
                <option value="Maszyna4">Maszyna 4</option>
                <option value="Maszyna5">Maszyna 5</option>
            </optgroup>
        </select>

    </div>
    <button type="submit" data-width="75%" class="btn btn-lg btn-danger">Szukaj!</button>

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...