Cannot get value of bootstrap dropdown on Submit - php

Question

I have the following code of which i want to get the value of the text displayed on the bootstrap dropdown button when i click on the submit button, and also the i want the POST to be sent to a codeigniter controller to perform certain operations on it.
I need help please.
<form method="post" action="#" id="user-order-form">
<div class="users-order col-md-5">
<label class=""> <strong>ORDER BY </strong></label>
<div class="dropdown form-control" style="padding:0px; margin-left: 20px; margin-right:10px">
<button class="btn btn-default dropdown-toggle form-control" type="button" id="user-order-dropdown" name="user-order-dropdown" data-toggle="dropdown">
Surname
<span class="caret"></span>
</button>
<ul class="dropdown-menu" aria-labelled-by="user-order-dropdown" id="capton">
<li>Surname </li>
<li>First Name </li>
<li>Company Name </li>
</ul>
</div>
<label class="radio-inline"><input type="radio" name="order-radio" checked>ASC</label>
<label class="radio-inline"><input type="radio" name="order-radio">DESC</label>
<button type="submit" class="btn" name="order-submit-btn" id="order-submit-btn">Order</button>
</div>
</form>
This is the jquery code that displays the selected dropdown item:
$('.dropdown').each(function (key, dropdown) {
var $dropdown = $(dropdown);
$dropdown.find('.dropdown-menu a').on('click', function () {
$dropdown.find('button').text($(this).text()).append(' <span class="caret"></span>');
});
});

Answer 1

To get the value of dropdown: You need to create a hidden input field and every time the value of dropdown changes, you need to update
it.
To get the POST data in the controller: You need to create a controller(obviously) and a function within that controller. Then
give that URL to the form action attribute.
I've written a reference code for you with necessary explaining in the comments, see if it helps you.
View
<form method="post" action="<?php echo base_url('some_controller/some_function');?>" id="user-order-form">
<!-- give the action where controller name(some_controller) and function name(some_function) -->
<div class="users-order col-md-5">
<label class=""> <strong>ORDER BY </strong></label>
<div class="dropdown form-control" style="padding:0px; margin-left: 20px; margin-right:10px">
<button class="btn btn-default dropdown-toggle form-control" type="button" id="user-order-dropdown" name="user-order-dropdown" data-toggle="dropdown">
Surname
<span class="caret"></span>
</button>
<!-- make a hidden field, give it a default value(which is initially selected), give it a name(it will be used to get the post data)-->
<input type="hidden" name="dropdown" value="Surname"id="dropdown_input"/>
<ul class="dropdown-menu" aria-labelled-by="user-order-dropdown" id="capton">
<li>Surname </li>
<li>First Name </li>
<li>Company Name </li>
</ul>
</div>
<label class="radio-inline"><input type="radio" name="order-radio" checked>ASC</label>
<label class="radio-inline"><input type="radio" name="order-radio">DESC</label>
<button type="submit" class="btn" name="order-submit-btn" id="order-submit-btn">Order</button>
</div>
</form>
JQuery
$('.dropdown').each(function (key, dropdown) {
var $dropdown = $(dropdown);
$dropdown.find('.dropdown-menu a').on('click', function () {
$dropdown.find('button').text($(this).text()).append(' <span class="caret"></span>');
$('#dropdown_input').val($(this).text()); // change the value of hidden input field
});
});
Controller(Some_controller.php)
function some_function(){
$dropdown = $this->input->post('dropdown'); // get dropdown value
$order_radio = $this->input->post('order-radio'); // get radio value
/* Do whatever you want to with that data here(Eg - Save in DB) -- your logic */
}