Get value from links with jquery

Question

Hello.

I have a div box with some images that the user can click. When the user clicks the image i want a ajax call that will provide me with the product images from that provider.

Like this:

<div id="phones" style="display:none;">
    <a href="#" value=1 id=HTC class=vendorLinks>
        <img src=/images/vendors/htc.png>
    </a>
    <a href="#" value=2 id=Nokia class=vendorLinks>
         <img src=/images/vendors/nokia.png>
    </a>
    <a href="#" value=3 id=SonyEricsson class=vendorLinks>IMAGE</a>
    <a href="#" value=4 id=Samsung class=vendorLinks>IMAGE</a>
    <a href="#" value=5 id=BlackBerry class=vendorLinks>IMAGE</a>
    <a href="#" value=6 id=Sonim class=vendorLinks>IMAGE</a>
    <a href="#" value=8 id=Motorola class=vendorLinks>IMAGE</a>  
</div>

When i click on one of the links i want a ajax call against the url /mob/changePhone

$('#cPhone').click(function(){
  $('#phones').fadeIn('slow');

  });
  $('.vendorLinks').click(function(){


 $.ajax({
 type: "POST",

 url: "/mob/changePhone/<?=$userID?>",

 data: data,
 success: function()
 {

  $('.vendorLinks').fadeOut('slow');
  $('#phone').fadeIn('slow').html(this);

 }
});
});

The php function looks like this:

function changePhone($UID = null)
   {

    $UID   = $this->uri->segment(3);
    $vendor = // How can i get the value from the link?
    echo $vendor;
    echo "<br>";
    echo $UID; 
    if(!$UID)
     {
      echo "Error: No user ID given!";
     } 
    if($vendor)
     {
      // Do something
     }
    // get the vendor logo.
    $vendors = $this->getVendors();
    $string = "";
    foreach($vendors as $maker){
     $string .= "<a href=\"#\" value=". $maker['id'] . " id=". $this->spaceRemover($maker['name']) ." class=vendorLinks><img width=100px height=100px style=border:0; padding-left: 5px; src=". $maker['imgPath'] . "></a>";
    }
    return $string;
   }

How can i get the value from the link?

Hopes anyone know how i can do this and maybe tell me if this peace of code is bad. Its for internal use so security is not a priority :-).

Thanks.

Best Regards Audunfr

Answer 1

You should set the data variable in your ajax call. Like this:

$.ajax({
        type: "POST",
        url: "/mob/changePhone/<?=$userID?>",
        data: {vendor : $(this).attr('id')},
        success: function()
        {

                $('.vendorLinks').fadeOut('slow');
                $('#phone').fadeIn('slow').html(this);

        }
});

Then you can access the vendor's name by the php-variable $_POST['vendor'].