Unable to post multiple dropdown value PHP

Viewed 35

I am using "Multiselect dropdown",But i am facing two problems 1) Unable to send select box value 2) whenever i click on select box then dropdown not closed,How can i fix this ?

<select name="skills" multiple="" class="ui fluid selection dropdown no label">
      <option value="">All</option>
       <option value="1">Health 111</option>
      <option value="2">Health 2</option>
      <option value="3">Health 3</option>
      <option value="4">Power 1</option>
      <option value="5">Power 2</option>
      <option value="6">Power 3</option>
      <option value="7">Speed 1</option>
      <option value="8">Speed 2</option>
    </select>

Here is my script

<script>
$('.label.ui.dropdown')
  .dropdown();

$('.no.label.ui.dropdown')
  .dropdown({
  useLabels: false
});

$('.ui.button').on('click', function () {
  $('.ui.dropdown')
    .dropdown('restore defaults')
})

</script>
1 Answers

1) Unable to send select box value

<?php 
if(isset($_REQUEST['get_skills']))
{   
    $skill_list="";
    $cnt=0;

    foreach($_POST['skills'] as $skill)
    {
        if($cnt==0)
        {
            $skill_list=$skill;
        }else
        {
            $skill_list.=",".$skill;
        }
        $cnt++;
    }

    echo "Your Selected skills are:".$skill_list;

} ?>

2) whenever i click on select box then dropdown not closed,How can i fix this ?

   $(document).ready(function() {
            $('.js-example-basic-multiple').select2();
        });
 .js-example-basic-multiple {
            width: 100%;
        }
<html>

<head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
    <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>   
   
</head>

<body>
    <form method="post">
        <select class="js-example-basic-multiple" name="skills[]" multiple="multiple">
            <option value="All">All</option>
            <option value="Skill 1">Skill 1</option>
            <option value="Skill 2">Skill 2</option>
            <option value="Skill 3">Skill 3</option>
            <option value="Skill 4">Skill 4</option>
            <option value="Skill 5">Skill 5</option>
            <option value="Skill 6">Skill 6</option>
        </select>
        <input type="submit" name="get_skills" value="Get Skills Data" />
    </form>
</body>
</html>

Related