I am unable to post values from multi select drop down. Actual problem is in the edit profile part of user in this section i am not able to post values of already selected values from database.
This is my html part
<select name="drop_caste[]" id="cast_to" class="form-control new-two" size="8" multiple="multiple">
<?php foreach($selectedcast->result() as $row): ?>
<option value="<?php echo $row->cid; ?>" ><?php echo $row->caste ; ?></option>
<?php endforeach; ?> </select>
</select>
This is the code i am using to post the value
$this->input->post('drop_caste');
You need to add drop_caste into an array as
$data['drop_caste'] = $this->input->post('drop_caste');
print_r($data);// here you get your value
OR you can use foreach loop for it
foreach($this->input->post("drop_caste") as $drop_caste){
echo $drop_caste;
}
OR you can direct change POST array in to string
$caste = implode(',',$this->input->post("caste"));
JS:
Trigger this on some action:
var config = { learn : [] };
$('#learn_multiselect option:selected').map(function(a, item){
config.learn.push( { "id" : item.value } );
});
//write code for ajax to send this config object using ajax to your controller
//something like this
$.ajax({
url: $url,
method: $method,
data: $dataArr,
dataType: $dataType,
contentType: $contentType
}).done(function(data){
//handle as required
}).fail(function(data){
//handle as required
});
HTML:
<select id="learn_multiselect" multiple="multiple">
<option value="1">Science</option>
<option value="2">Maths</option>
</select>
Now you should be able to get the POSTED(or what ever method you used in AJAX) data in your controller.
Related
I am not sure the title is explained perfectly.
I have 2 select tags and both select tags data are coming from the same table, in
The fist select tag - I am fetching data from the database which stores location name => This works perfectly and I have 3 locations name in the database.
<select name="location" class="form-label" id="location" required>
<option value="">Select Dojo Location</option>
<?php foreach ($location as $row): ?>
<option value="<?php echo $row->id; ?>"><?php echo $row->location; ?></option>
<?php endforeach; ?>
</select>
Image for first select tag
The second select tag - I am fetching prices from different columns of the same table but it shows every price from different locations.
<select name="month" class="form-label" id="month" required>
<option value="">Select Fees Period</option>
<?php foreach ($location as $row1): ?>
<option value="<?php echo $row1->admission_fee_1; ?>">Monthly</option>
<option value="<?php echo $row1->admission_fee_1; ?>">Quarterly</option>
<option value="<?php echo $row1->admission_fee_6; ?>">Half Yearly</option>
<option value="<?php echo $row1->admission_fee_12; ?>">Annually</option>
<?php endforeach; ?>
<?php endif; ?>
Image for second select tag
Image for table data
What I am trying to do is, when user select location in 1 select tag, so it only shows the prices of that selected location from database in second select tag.
This is what I am getting in the result
But I do not succeed yet, any solution is helpful or is there any other way to do this or am I doing it wrong.
Thanks in advance.
You have to use JavaScript and onChange method. It was resolved manytimes, e.g. how to change a selections options based on another select option selected?
You need to make some ajax call.
On Selection of first location tag; you can make jQuery Ajax call and get prices of that selected location only. In Ajax response you can receive HTML of second select tag and replace with current one.
Let me know if you need further explanation.
You need fetch the data dinamically.
Something like this
$( "#location" ).change(function() {
// this.value is your ID
$.post('/endpoint/fetch-details/' + this.value)
.done(function(data) {
// load data into another SELECT
})
.fail(function() {
alert( "error" );
})
});
On Codeigniter you could have a controller method (/endpoint/fetch-details/) that returns a JSON object.
Successfully Done...
Ajax function =>
$(document).ready(function () {
$('#location').on('change', function () {
var location_id = $(this).val();
if (location_id == '') {
$('#fees').prop('disabled', true);
} else {
$('#fees').prop('disabled', false);
$.ajax({
url: "<?php echo $base_url;?>welcome/getFeePeriod",
type: 'POST',
data: {location: location_id},
dataType: 'json',
success: function (data) {
//alert("Ok");
$('#fees').html(data);
},
error: function () {
alert("Error Accured...");
}
});
}
});
});
Controller function =>
public function getFeePeriod()
{
$location_id = $this->input->post('location');
$FeesPeriod = $this->admin_model->getFeePeriod($location_id);
if (count($FeesPeriod)>0) {
$fee_select_box = '';
$fee_select_box .= '<option id="">Select Fee Period</option>';
foreach ($FeesPeriod as $fees) {
$fee_select_box .= '<option id="' . $fees->admission_fee_1 . '">Monthly</option>+
<option id="' . $fees->admission_fee_3 . '">Quarterly</option>+
<option id="' . $fees->admission_fee_6 . '">Half Yearly</option>+
<option id="' . $fees->admission_fee_12 . '">Yearly</option>';
}
echo json_encode($fee_select_box);
}
}
model function =>
function getFeePeriod($location_id){
$query = $this->db->get_where('location', array('id'=>$location_id));
return $query->result();
}
Thanks everyone for their response...
I need to POST the value of the selected option to use in a query on another page.
This is my form:
<form method="post" data-remote="true">
<select class="selectpicker" data-live-search="true" name="switch-area">
<?php while($test3 = sqlsrv_fetch_array($test2, SQLSRV_FETCH_ASSOC)) : ?>
<option data-tokens="<?php echo $test3['Name'] ?>" value="<?php echo $test3['Name'] ?>"><?php echo $test3['Name'] ?></option>
<?php endwhile; ?>
</select>
<button class="btn btn-info">View Area</button>
</form>
I am using ajax and this is my code:
$(document).ready(function() {
$('select[name="switch-area"]').change(function(){
var status = $(this).val();
$.ajax({
type: 'POST',
url: 'sim-area.php',
data: {changeStatus: status}
});
});
});
Then on sim-area.php this is my code to grab the data:
$selectedArea = $_POST['switch-area'];
But I keep getting an undefined index error, am I posting this in the correct way?
You're sending changeStatus but not switch-area in your data, you want
$selectedArea = $_POST['changeStatus'];
I am banging my head against a wall with this now so any help will go a long way with this one.
I am trying to get some data from a drop down list and update a database with the data selected.
This is my drop down list:
<form method="post" data-remote="true">
<select class="selectpicker" data-live-search="true" name="status[]">
<?php while($test3 = sqlsrv_fetch_array($test2, SQLSRV_FETCH_ASSOC)) : ?>
<option data-tokens="<?php echo $test3['Name']; ?>" value="<?php echo $test3['Name']; ?>">
</option
<?php endwhile; ?>
</select>
View Area
This is my ajax:
$(document).on('click', '#sim-area', function() {
$.ajax({
type: "POST",
url: 'sim-area.php',
data: {changeStatus: status},
success: function() {
"area switched"
}
});
});
and this is my page that is updating the databse (sim-area.php):
<?php
$userID = $user['userID'];
$selectedArea = $_GET['changeStatus'];
$queryAreaName = "
SELECT UserID, Name, U_NB, U_RTN
FROM Table
WHERE UserID = '$userID' AND Name = '$selectedArea'";
$getAreaname = sqlsrv_query($sapconn2, $queryAreaName);
$areaSwitch = sqlsrv_fetch_array($getAreaname, SQLSRV_FETCH_ASSOC);
$areaNB = $test2['U_NB'];
$areaRTN = $test2['U_RTN'];
//UPDATE TABLE
?>
No matter what I try I get an undefined error, I have changed it to hard code the values and in inserts fine, so I know everything is working fine, It just isn't passing the data through
Looks you are not passing data correctly to ajax call.
Below is updated code for dropdown (changed name of select and added id attribute):
<form method="post" data-remote="true">
<select class="selectpicker" data-live-search="true" name="status" id="changeStatus">
<?php while($test3 = sqlsrv_fetch_array($test2, SQLSRV_FETCH_ASSOC)) : ?>
<option data-tokens="<?php echo $test3['Name']; ?>" value="<?php echo $test3['Name']; ?>">
</option
<?php endwhile; ?>
</select>
Updated code for jquery (changed code for passing value of data):
$(document).on('click', '#sim-area', function() {
$.ajax({
type: "POST",
url: 'sim-area.php',
data: {changeStatus: $('#changeStatus').val()},
success: function() {
"area switched"
}
});
});
I have two dropdowns: state and city. Both are in the same form. The goal is to somehow save the selection without clicking submit button so it could be used as a criteria to display selections of cities in the second dropdown.
For example: When california is chosen in the first dropdown, second dropdwon displays all the cities in California.
Code:
<?php $db= DB::table('states_table')->get(); ?>
<select class="form-control input-md" name="state">
<option value="" disabled selected>Choose the state</option>
<?php foreach ($db as $data) { ?>
<option value="<?php echo $data->city; ?>">
<?php echo $data->city;?>
</option><?php
}?>
</select>
just use ajax :
$('#form').on('change','select[name="state"]', function() {
var province = $('select[name=state]').val();
$.ajax({
url: './get_city.php',
method: 'post',
data: {"state": state},
success: function (data) {
$('select[name=city]').html(data);
}
})
});
and in the get_city.php connect to db , get the cities and return them on tags
$('#state_field_id').click(function(){
var state=document.getElementById('state_field_name').options[document.getElementById('state_field_name').selectedIndex].text;
});
you will get selected value
I have a table with multiple rows that lists records from my database.
These records are projects' information and in each row, I have drop down list to modify the status of the project.
To do so, I used Ajax because I hate to refresh the whole page after update.
This is the function I created to do the update:
function call(){
var projid=$('#projid').val();
var projstatus=$('#projstatus').val();
var dataall={'projid':projid, 'projstatus':projstatus};
$.ajax({
type: 'POST',
url: "stsproj.php",
data: dataall,
success: function (data) {
}
});
}
And below is my drop down list:
<?php do { ?>
<td>
<form action="<?php echo $editFormAction; ?>" method="post" name="form2" id="form2">
<input type="hidden" name="MM_update" value="form2" />
<input type="hidden" name="projid" id="projid" value="<?php echo $row_projlist['projid']; ?>" />
<select name="projstatus" id="projstatus" class="select1" onchange="call()">
<option value="<?php echo $row_status['projstatus'];?>"><?php echo $row_status['sts'];?></option>
<option value="1">Awaiting</option>
<option value="2">Ongoing</option>
<option value="3">Finishing</option>
</select>
</form>
</td>
<?php }while($row_projlist = $projlist->fetch(PDO::FETCH_ASSOC)); ?>
My problem is the following:
When I update the status of the first project, it works but when I try to do it with other projects, it doesn't work.
To be more specific, the parameters of the first project are sent always (this is what firebug says).
Please help!
Your problem is due to duplicate ids. You don't need to use ids(actually do not use id for automatic list generation. Id names must be unique). Remove call function from your select box and use below javascript;
You can use such js to handle that;
$(function() {
$("select[name='projstatus']").change(function() {
var projid = $(this).parent("form").find("input[name='projid']").val();
var projstatus = $(this).val();
var dataall = {'projid':projid, 'projstatus':projstatus};
$.ajax({
type: 'POST',
url: "stsproj.php",
data: dataall,
success: function (data) {
}
});
});
});
You can see working example for form manipulating part here : http://jsfiddle.net/cubuzoa/SYf8s/
The previous answer will probably solve your problem, but I think it can be simplified.
for the form...
<form>
<select class="select1" onchange="call(<?=$row_projlist['projid']?>)">
<option value="<?=$row_status['projstatus']?>"><?=$row_status['sts']?></option>
<option value="1">Awaiting</option>
<option value="2">Ongoing</option>
<option value="3">Finishing</option>
</select>
</form>
and the javascript
function call(id)
{
$.post('stsproj.php',{'projid':id, 'projstatus':$('#projstatus').val()} )
.done(function(data){
//do something with data
});
}