Passing data attribute from Ajax to PHP using Wordpress - php

Question

I am developing a WordPress plugin and I am trying to pass a variable from function.php(ajax) to pass_userid.php. Both files are inside my plugin folder. I am attempting to pass the data attribute from function.php(ajax) to pass_userid.php but it did not send the data and received error 500.
Plugin structure:
-plugin folder
--function.js
--pass_userid.php
This is my function.php
<?php
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
function custom_ajax(){
?>
<script>
jQuery(document).ready(function( $ ) {
$('[data-source-id="13487"]').on("load", function() {
$('[data-source-id="13487"]').contents().find('button.button.ld-gb-gradebook-component-grade-add').click(function() {
var ajaxurl = "https://<?php echo $_SERVER['HTTP_HOST'];?>/wp-content/plugins/gradebook-custom/pass_userid.php";
var user_id = $('[data-source-id="13487"]').contents().find('.ld-gb-gradebook-component-overall-grade').attr('data-user-id');
alert(user_id);
$.ajax({
type: 'POST',
url: ajaxurl,
contentType: 'application/json; charset=utf-8',
dataType: 'json',
data: {
'action' : 'call_userid',
'userid' : user_id},
success: function(data)
{
console.log("data pass success!");
},
error: function(errorThrown){
console.log("no data pass!");
}
});
});
});
});
</script>
<?php
}
add_action('wp_head', 'custom_ajax');
?>
This is pass_userid.php:
<?php
function call_userid(){
if(isset($_REQUEST)){
$testing = $_REQUEST["userid"];
console.log("Test 123");
}
}
add_action("wp_ajax_call_userid", "call_userid");
add_action("wp_ajax_nopriv_call_userid", "call_userid");
?>