0

in the view I have a drop-down list like this:

<div class="input select"><label for="customer">Customer</label><select name="data[Project][customer_id]" id="customer">
<option value="16">Customer1</option>
<option value="17">Customer2</option>
</select>

What I am trying to do with jQuery is that either on the page load or on drop-down selection choice change, the jquery would call the controller function with given option value and get the expected return from the function. The following is the controller part:

public function getInitials($id){
         $this->autoRender = false;
         if($this->request->is('ajax')){
             $initials = $this->Customer->getInitialsById($id);
                     echo json_encode($initials);

    }}

JQuery is not something that I am good at, but I did the research and tried to take some similar function and make it work, but nothing simply works and I feel that I am doing something completely wrong. Here is the jQuery:

    jQuery(document).ready(function($){

        $('#customer').change({
       var initials = "";
       $("select option:selected").each(function(){
            initials = "<?php echo Router::url(array('controller'=>'projects','action'=>'getInitialsById')) ?>"
});
$("div").text( initials );
        });

Any help is much much appreciated.

1
  • Looks like you mixed some client side (the jQuery each-loop) and the server side php. Have a look at the jQuery.getJson(). Also, while I'm not familiar with cakephp but you seem to be missing the id param in the function call, no? Nov 7, 2013 at 15:26

2 Answers 2

0

You need to properly set up the AJAX call: http://api.jquery.com/jQuery.ajax/ , http://api.jquery.com/jQuery.getJSON/

Also, you need to supply the value (id) of the newly chosen customer <option> in your AJAX call, as defined in your getInitials($id) function declaration. Be careful you are requesting getInitials and not getInitialsById, as the latter is called by the former.

Finally, I do not believe echo will work. You need to do $this->response->body(json_encode($initials)); (http://book.cakephp.org/2.0/en/controllers/request-response.html#CakeResponse::body)

0

It doesn't make sense to call make the AJAX call on document load, because that happens before the option is selected from the dropdown list.

So to make the AJAX call once an option is selected add this code:

$('#customer').change(function(){
    var data = $('#inputEl option:selected').val();

    $.ajax({
        type:'POST',
        async: true,
        cache: false,
        url: <?php echo Router::url(array('controller'=>'projects','action'=>'getInitialsById')) ?>,
        success: function(response) {
            jQuery('[ID OF ELEMENT TO HOLD REPONSE (OPTIONAL)').html(response);
        },
        data: data
    });
    return false;
})

Hasn't been test but that should work.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.