使用AJAX JQuery发送POST数据

Question

I want to send the selected item from Bootstrap dropdown in POST to my controller, but somehow it is not being sent.

In my dropdown I fetch records from the database in <li></li> tag, like this:

 <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>     

This is my script to send POST data:

<script type="text/javascript">

$( ".specialLink" ).click(function() {
    var value = this.id; //get value for throw to controller
    alert(value);  

    $("#specialLink").submit(function(){
        $.ajax({
            type: "POST", //send with post
            url: "<?php echo site_url('customer/dashboard') ?>",  
            data: "value=" + value,
        });
    });
});

</script>

But I don't send anything in POST data at my controller, nor do I get any error message in the console.

Answer 1

I think you're not using submit correctly. The submit function binds an event handler to the submit javascript event. Read more at https://api.jquery.com/submit/.

You just want to do the ajax request when $(.specialLink) is clicked, so try:

 $( ".specialLink" ).click(function() {
    var value = this.id; //get value for throw to controller
    $.ajax({
      type: "POST", //send with post
      url: "<?php echo site_url('customer/dashboard') ?>",  
      data: "value=" + value, 
    });
});