Cannot get a reference to an external javascript file

I have been banging my head up against the wall for several hours and I need help...

I want to be able to reference my JS in an external file rather than inline @section Scripts for an associated cshtml file.

I have tried both of the approaches below and none of them work.

@Html.RazorJSInclude("~/Scripts/Categories/Create.js");

        $.getScript("~/Scripts/Categories/Create.js", function ()
        {
            contentCategoriesCreate();
        });

The package RazorJSInclude just doesn't work as advertised. I don't see anywhere when debugging that this js file is pulled in.

No matter what I try with the jQuery getScript method, I cannot get it to resolve the url I am pointing to.

Note that with the latter, I did include a bundle in my Layout page and the Bundle.config file.

If I include the script inline, everything works fine, but I want to decouple the inline JS from my HTML.

What is the simplest way I can do this?

EDIT

I included the Url.Content as suggested which I forgot to mention that I already tried. It didn't work (see screenshot).

I also tried the Razor Syntax: @Url.Content which also did not work. See below screenshot.

I don't know how something so simple to supposedly be able to do, is turning out to be a nightmare...

Any other suggestions would be helpful....

EDIT 2

Lastly, what I have done, was to include the script inside my bundling. However, that still did not work. This time, the script loaded with no errors, but when I click on the "Create" button, the click function doesn't fire.

Here is pertinent code inside my BundleConfig.js file:

bundles.Add(new ScriptBundle("~/bundles/jsViews").Include(
             "~/Scripts/Categories/Create.js",
             "~/Scripts/AntiForgeryToken.js"));

Here is pertinent code inside my _Layout.js file:

@Scripts.Render("~/bundles/jsViews")

Here is the pertinent code inside my Create.cshtml file:

@section Scripts {
    <script>
    $(document).ready(function ()
    {
        if (typeof contentCreateCategory == "function")
            contentCreateCategory();
    });
</script>
}

Here is the pertinent code inside my external JS file:

function contentCreateCategory()
{
    function contentCategoriesCreate()
    {
        $('#btnCategoryCreate').click(function (e)
        {
            var form = $('#form1');
            if (form.valid())
            {
                createCategory();
            }

            return false;
        });
    }
}

function createCategory()
{
    var category_Input = {
        CategoryDescription: $('#CategoryDescription').val()
    };

    var Url = $("#url").val();

    $.ajax({
        url: Url,
        data: AddAntiCSRFToken(JSON.stringify(category_Input)),
        dataType: "html",
        type: "POST",
        contentType: "application/x-www-form-urlencoded; charset=UTF-8",
        async: false,
        success: function (data, status)
        {
            // Record added
        },
        error: function (data, status, xhr)
        {
            alert(status + '\n' + xhr + '\n' + data);
        }
    });
};

Finally, here is the screenshot that proves the JS is loading, but nothing happens when I click the "Create" button. Note again, that when I include the script inline within the Create.cshtml file, everything works fine. I cannot do any more than what I've done. I've given the code & screenshots. I'm hoping somebody can please let me know what I need to do to get this to work...