Not able to call javascript function on drop down change

In my view file i want to call a javascript function onchange of drop down element, for that i used the following piece of code





<script type="text/javascript">

<?php 

     echo CHtml::cdata('jQuery(function($) {

                                  var default_cc='.$cc_assignto.';

                                  $(\'#'.CHtml::activeId($model,'component_id').'\').change(function(){

                                      alert($(this).val());

                                  );

                       });

          '); 

?>

</script>




Is something wrong in my code.




CHtml::dropDownList(CHtml::getActiveId($model,'component_id'),2,array(1=>'A',2=>'B'),array('onchange'=>'javascriptFunction();'));


//


<script>

function javascriptFunction(){

 [[CODE FOR ONCHANGE HERE.]]

 var value=$('#ModelName_component_id').val();

 [...]

}

</script>



http://www.yiiframework.com/doc/api/1.1/CHtml#dropDownList-detail

I made it work like this




<script type="text/javascript">

jQuery(function($) {

        var cc_assign=<?php echo $cc_assignto ?> ;

        $('#<?php echo CHtml::activeId($model,'component_id') ?>').change(function(){

            $('#<?php echo CHtml::activeId($cc_module,'addtocc') ?>').html('');

            if($(this).val()!=''){

                $('#<?php echo CHtml::activeId($model,'assigned_to') ?>').val(cc_assign[$(this).val()].assign_to);

                $('#<?php echo CHtml::activeId($cc_module,'who') ?>').html('');

                if(cc_assign[$(this).val()].default_cc){

                    $.each(cc_assign[$(this).val()].default_cc, function(key, value)

                    {

                        $('#<?php echo CHtml::activeId($cc_module,'who') ?>').append($("<option></option>").attr("value",key).text(value));

                    });

                }

            }else{

                $('#<?php echo CHtml::activeId($model,'assigned_to') ?>').val('');

                $('#<?php echo CHtml::activeId($cc_module,'who') ?>').html('');

            }

        });

});

</script>



but i have added my script in my view file.

I do have date picker widget element in my form along with my other form elements,for the widget Yii is including jquery file and then writing a jquery function. In the jquery function all the html element events are written.

Now instead of writing one more jquery function(in my view file), i need to keep all my custom script and Yii generated script in one place i.e at the end of the page where yii is writing default script. How can i combine my custom script with yii generated jquery script function.




Yii::app()->clientScript->registerScript('myScript','[SCRIPT CODE]',CClientScript::POS_END);



http://www.yiiframework.com/doc/api/1.1/CClientScript#registerScript-detail

Above solution worked fine, but i need a bit more help, how can i send all the select box option values to server irrespective of it is selected or not. I am trying to do this in jquery.




jQuery.ajax({

           "type":"POST",

           "url":\' '.CController::createUrl('bugs/getdefault').' \',

           "cache":false,

           "data":{\'component_id\':$("#'.CHtml::activeId($model,'component_id').'").val(),\'usersin\':$("#'.CHtml::activeId($cc_module,'who').'".map(function(){return $(this).val();}).get(),\'name\':\'pavan\'},

           "success":function(html){$("#'.CHtml::activeId($cc_module,'addtocc').'").html(html)}

});



if we go to “data” parameter there is ‘usersin’ variable where i am trying to get all values of selectbox into an array and then send it server, i tried using map function of jquery but its giving client side errors, how can i fix this.

well the easiest solution that comes into my mind right now is something like:




$(document).remove('input[name=checkboxValues[]]').append('<input type="hidden" name="checkboxValues[]" />');

$('#Model_component_id option').each(function(){

   $('input[name=checkboxValues[]]').val($(this).attr('value'));

});



the above code will populate a virtual input array with the values of your select options, then all you have to do, is to send that input with ajax, like:




var selectOptionsData=$('input[name=checkboxValues[]]').serialize();

[...]

$.ajax({

  "data":selectOptionsData,

});

[...]



Not tested though, hope you get the point .