包含外部JavaScript的ASP.NET MVC 4问题

Question

I'm new in MVC and i got stuck with using a downloaded javascript controller in a partial view. I downloaded this treeview:
http://bassistance.de/jquery-plugins/jquery-plugin-treeview/
Then I placed the treeview.js and demo.js scripts in the project, with the css and the images folder. The 2 .js files are in the /Scripts/treeview folder and the css and images folder is in the /Content folder.

I added these to my BundleConfig.cs:

        bundles.Add(new ScriptBundle("~/bundles/treeview").Include(
                    "~/Scripts/treeview/jquery.treeview.js",
                    "~/Scripts/treeview/demo.js"));

        bundles.Add(new StyleBundle("~/Content/css/treewiew").Include("~/Content/jquery.treeview.css"));

My partial view looks like this:

<ul id="browser" class="treeview">
    <li><span class="folder">Folder 1</span>
        <ul>
            <li><span class="file">Item 1.1</span></li>
        </ul>
    </li>
    <li><span class="folder">Folder 2</span>
        <ul>
            <li><span class="folder">Subfolder 2.1</span>
                <ul id="folder21">
                    <li><span class="file">File 2.1.1</span></li>
                    <li><span class="file">File 2.1.2</span></li>
                </ul>
            </li>
            <li><span class="file">File 2.2</span></li>
        </ul>
    </li>
    <li class="closed"><span class="folder">Folder 3 (closed at start)</span>
        <ul>
            <li><span class="file">File 3.1</span></li>
        </ul>
    </li>
    <li><span class="file">File 4</span></li>

In the _Layout.cshtml I added these 2 lines in the head section, just before the @Styles.Render("~/Content/css") and @Scripts.Render("~/bundles/modernizr") lines:

<link href="@Url.Content("~/Content/jquery.treeview.css")" rel="stylesheet" type="text/css" />
<script runat="server" type="text/javascript" src="@Url.Content("~/Scripts/treeview/jquery.treeview.js")"></script>

And lastly, I call the partial view in the Index view, which is generated automatically with the project. The css works almost fine, I've got the styled list, but it doesn't functional as a tree view controller.

Now, I found these posts, but these weren't able to help me:
How to include javascript code in asp.net MVC4 View page?
MVC4 partial view javascript bundling Issue

I just can't see what's the problem at me. I've just started to learn javascript recently, MVC was totally new and unknown to me 5 days before, and I stuck with this problem for 3 days now and I'm angry at myself for that. Please, help me! Thanks a lot!

Answer 1

Add this line instead of using your script registration,

@Scripts.Render("~/bundles/jquery")    
@Scripts.Render("~/bundles/treeview")

Note: treeview should register after the jQuery reference.