javascript var returning object Object when should be returning an int or string

Question

I have two ajax functions and use the first one to pass some data to the second however when I look at the POST, I see that for the variable I am being sent I am getting object Object returned as the value of the variable and not what I was expecting either a string or an int. The javascript looks like this,

    $('.career_select .selectitems').click(function(){
    var selectedCareer = $(this).attr('title');
    $.ajax({
        type: 'POST',
        url: '/roadmap/step_two',
        data: 'career_choice='+selectedCareer+"&ajax=true&submit_career=Next",
        success: function(html){
            $('.hfeed').append(html);
            $('#grade_choice').SelectCustomizer();
          }
    });
});

$('#grade_choice_options .selectitems').live('click', function(selectedCareer){
    var selectedGrade = $('#grade_choice_customselect').val();
    $.ajax({
        type: 'POST',
        url: '/roadmap/step_two',
        data: 'career_choice='+selectedCareer+'&grade='+selectedGrade+"&ajax=true&submit_grades=Next",
        success: function(html){
            window.location.replace("/roadmap/your_map");
        }
    });
});

Answer 1

In your second function selectedCareer is the event object passed into the method by jQuery, you likely want to use this to get which items was clicked, e.g. $(this).val() for inputs of $(this).text() to get an element's text.

Also you can pass data an an object, especially if it's a complex value (e.g. may contain a &), like this:

 data: { career_choice: $(this).val(),
         grade: selectedGrade,
         ajax: 'true',
         submit_grades: 'Next' }