jQuery(document).ready(function($) {
    $('#role').on('change', function() {
        $('#custom-role-permissions-form').submit(); // Submit form on role change
    });

    $('#select-user-form').on('submit', function(e) {
        e.preventDefault();
        var formData = $(this).serialize();
        var selectedRole = $('#role').val();

        $.ajax({
            type: 'POST',
            url: ajaxurl,
            data: formData,
            success: function(response) {
                // Update user dropdown
                $('#user').html(response);
                $('#user').trigger('change'); // Trigger change event to update side menu
            },
            error: function(xhr, status, error) {
                console.error('Error fetching users:', error);
            }
        });
    });

    $('#user').on('change', function() {
        var selectedUserId = $(this).val();
        var selectedRole = $('#role').val();

        // AJAX call to fetch and update side menu items based on selected user and role
        $.ajax({
            type: 'POST',
            url: ajaxurl,
            data: {
                action: 'custom_get_admin_menu_ajax', // AJAX action to fetch admin menu
                role: selectedRole,
                user: selectedUserId,
            },
            success: function(response) {
                $('#side-menu-container').html(response);
            },
            error: function(xhr, status, error) {
                console.error('Error fetching admin menu:', error);
            }
        });
    });
});