Reputation: 2425
I want to pass data to my controller in POST method using AJAX and Jquery.
It looks some thing like this: https://jsfiddle.net/10bhsd2o/ I have bootstrap drop-down that displays records from database.
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Your Sites <span class="caret"></span></a>
<ul class="dropdown-menu">
<li ><a href="#"><?php
foreach($sites as $site)
{
echo "<li class='specialLink' id='$site->site_key'>".$site->site_key."</li>";
}?></a></li>
</ul>
</li>
Now I want to send the data to my controller,the item i select from dropdown of the <li></li>
tag.
This is my script:
<script type="text/javascript">
$( ".specialLink" ).click(function() {
var value = this.id;
var url= "<?php echo base_url('customer/dashboard/index') ?>";
alert(url)
//get value for throw to controller
alert(value);
$("#specialLink").submit(function(){
$.ajax({
type: "POST", //send with post
url: "<?php echo base_url('customer/dashboard/index') ?>",
data: {value:value},
success:function(data){
alert(data)
}
});
});
});
</script>
HTML GENERATED
<ul class="dropdown-menu">
<li ><a href="#"><li class='specialLink' id='54th-65hy'>54th-65hy</li><li class='specialLink' id='HT45-YT6T'>HT45-YT6T</li></a></li>
</ul>
Controller
public function index()
{
var_dump($_POST);
print_r($_POST);
$this->data['subview'] = 'customer/dashboard/index';
$this->load->view('customer/_layout_main',$this->data);
}
Now my my alerts are correct i get proper url in alert i get proper data in alert.
But in my controller when i do print_r($_POST); i get blank array WHY? Where am i going wrong?
Upvotes: 1
Views: 4301
Reputation: 306
$( ".specialLink" ).click(function() {
var value = this.id;
var url= "<?php echo base_url('customer/dashboard/index') ?>";
alert(url)
alert(value);
$.post(url,{value:value},function(data){alert(data)});
});
Upvotes: 0
Reputation: 2820
Change your html
markup. since your looping inside an anchor
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Your Sites <span class="caret"></span></a>
<ul class="dropdown-menu">
<?php
foreach($sites as $site)
{
echo "<li class='specialLink' id='$site->site_key'><a href='#'>".$site->site_key."</a></li>";
}
?>
</ul>
</li>
Then change your click
function
$( ".specialLink" ).click(function() {
var value = this.id;
var url= "<?php echo base_url('customer/dashboard/index') ?>";
alert(url)
//get value for throw to controller
alert(value);
$.ajax({
type: "POST", //send with post
url: "<?php echo base_url('customer/dashboard/index') ?>",
data: {value:value},
success:function(data){
alert(data)
}
});
});
I don't know if your using the index
function for other views but for testing purposes. Try this first
public function index()
{
if(!empty($_POST)){
var_dump($_POST);
print_r($_POST);
}else{
$this->data['subview'] = 'customer/dashboard/index';
$this->load->view('customer/_layout_main',$this->data);
}
}
Let me know what you get on your 3rd alert
Upvotes: 2
Reputation: 660
You Just Change in You Javascript
You remove $("#specialLink").submit(function(){
and });
<script type="text/javascript">
$( ".specialLink" ).click(function() {
var value = this.id;
var url= "<?php echo base_url('customer/dashboard/index') ?>";
alert(url)
//get value for throw to controller
alert(value);
$.ajax({
type: "POST", //send with post
url: "<?php echo base_url('customer/dashboard/index') ?>",
data: {value:value},
success:function(data){
alert(data)
}
});
});
</script>
Upvotes: 1