Add Category field to Buddypress Activity

My goal is to allow user to select a category for their buddypress activity update before posting it. I have added the following script to the function.php of my child theme.

/***Add Form***/`
function add_bpcat_form_func(){
$output.=’
<div id=”bpcat”>
<select name=”bpcat” id=”bpcat”>
<option value=”” disabled selected>Choose a Category</option>
<option value=”update”>Update</option>
<option value=”news”>News</option>
<option value=”video”>Video</option>
<option value=”image”>Photo</option>
<option value=”advertisement”>Advertisement</option>
</select>
</div>
‘;
echo $output;
/* I presume I must set jquery value for #bpcat.value() in Javascript here but how to do*/
}

add_action(‘bp_activity_post_form_options’, ‘add_bpcat_form_func’);

/**Update Activity Meta**/
function add_bpcat_meta_func( $p ) {
bp_activity_update_meta( $p->id, ‘bpcat’, $_POST[‘bpcat’] );
}

add_action(‘bp_activity_after_save’, ‘add_bpcat_meta_func’);

/**Display Category in Activity**/
function my_bpcat_func() {
$bpcat = bp_activity_get_meta( bp_get_activity_id(), ‘bpcat’ );
echo ‘<span class=”bpcat”>Category: ‘ . $bpcat . ‘</span>’;
}

add_action(‘bp_activity_entry_meta’, ‘my_bpcat_func’ );`

Result so far: the bpcat in activity meta table is null.
I presume that it is because activity submission is passed through js instead of a normal form as I have read here, but that method requires me to change the BP core, which i am a bit relunctant (actually i tried it on my theme buddypress.js(global.js enqueued file) and still it does not work).

The lost part is how to add the additional javascript to make sure #bpcat can be queried after save as $_post[‘bpcat’]

Not good with JS, wish some of you guys can help me out…thanks in advance.