How to send value from dropdown menu of bootstrap to php

Question

i have create searching bar with filter button that can search between Teacher and Student name. First i can search to my database with fix to student but when i try to use filter button nothing send value from dropdown button So this is my poor code please come and help me

HTML:

<form method="post" action="<?php echo $_SERVER['SCRIPT_NAME']; ?>">
    <div class="input-group">
        <div class="input-group-btn search-panel">
            <button name="filter" type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#" id="dropdownMenu1">
                <span class="selection pull-left">Select an option</span></button>
            <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1" style="box-shadow:0px 6px 12px rgba(0, 0, 0, 0.176)">
                <li><a href="#Teacher" class="" data-value="Teacher"><span>Teacher</span></a></li>
                <li><a href="#Student" class="" data-value="Student"><span>Student</span></a></li>
                <li class="divider"></li>
                <li><a href="#all">All</a></li>
            </ul>
        </div>
        <!-- <input type="hidden" name="search_param" value="all" id="search_param">          -->
        <input name="txtSearch" type="text" class="form-control" id="txtSearch" placeholder="Search term..."
            value="<?php echo $wordSearch; ?>">
            <span class="input-group-btn">
            <button id="btnSearch" class="btn btn-primary" type="submit">
                <span class="glyphicon glyphicon-search"></span></button>
            </span>
    </div>
</form>

and this is my JS

<script type="text/javascript">
  $(".dropdown-menu").on('click', 'li a', function(){
    var selText = $(this).children("span").html();

   $(this).parent('li').siblings().removeClass('active');
      $('#vl').val($(this).attr('data-value'));
    $(this).parents('.input-group-btn').find('.selection').html(selText);
    $(this).parents('li').addClass("active");
  });

</script>

I have no idea about PHP PS. Everything are under the same page (pls see attached picture below) http://upic.me/i/hg/ssssss.jpg

SimonEritsch · Accepted Answer · 2015-01-06 15:40:28Z

1

A link is not a form element. You need to tell a form field (which will send the value - compared to a link) about the value. You are actually already doing this in your javascript with this line:

$('#vl').val($(this).attr('data-value'));

Now you just need to create the corresponding form field (with attribute id="vl") in your form. In this example use the "hidden" form field like this. Just add this somewhere between the tags:

<input type="hidden" id="vl" name="vl" value="">

And then you can get the value in PHP with:

$_POST['vl']

answered Jan 6, 2015 at 15:40

SimonEritsch

1,4971 gold badge16 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Joe Sarayuth Over a year ago

Ok, First you are understand what's the purpose of my issue, So i write this code to test and nothing came out

<input type="hidden" id="vl" name="vl" value="">         <?php                $filter = null;               if(isset($_POST['vl']))               {                 $filter = $_POST['vl'];               }             echo $filter;                ?>

one more question Have i need to click submit button to send value or just click list on dropdown menu then value will send ? Because i test this <input type="text" id="vl" /> and it's work instantly when i selected from dropdown menu

SimonEritsch Over a year ago

Right now it won't submit just by clicking, but you could add $("form").submit(); after $(this).parents('li').addClass("active"); to make it submit automatically.

atmd · Accepted Answer · 2015-01-06 15:34:27Z

0

If you are looking at posting data to the backend for a search you either need a ajax post to do it asyc (something like jquery ajax method) docs here

if you are wanting to use a form you'll need to read up on html forms heres the MDN docs before you get started on the php side of things

answered Jan 6, 2015 at 15:34

atmd

7,5003 gold badges35 silver badges64 bronze badges

Collectives™ on Stack Overflow

How to send value from dropdown menu of bootstrap to php

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related