test123123
test123123

Reputation: 921

jQuery code not working with MVC3 site

I want to highlight my elements and add a link with jquery.

My Code:

@model IEnumerable<Mvc3Demo.Products>

@{
    ViewBag.Title = "List";
}

<h2>List</h2>
<script type="text/javascript" src="../../Scripts/jquery-1.5.1.min.js" />
<script type="text/javascript">
    $(document).ready(function () {
        $('#productList li').hover(
            function () {
                $(this).css({ 'background': 'green', 'cursor': 'pointer' });
            },
            function () {
                $(this).css('background', '');
            }
        ).click(function () {
            window.location = 'Product/Edit/' + $(this).attr('productid');
        });
    });
</script>

<ul id="productList">
@foreach (Mvc3Demo.Products p in Model)
{
    <li productid="@p.ProductsID">
        @p.Name
        <[email protected]("Bearbeiten", "Edit", "Product", p, null)-->
    </li>
}
</ul>

Layout page:

<!DOCTYPE html>
<html>
<head>
    <title>@ViewBag.Title</title>
    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
    <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
</head>

<body>
    @RenderBody()
</body>
</html>

The JQuery will be found so that couldn't be the error ( i proofed it with firebug)

Error:

No Error occurs in Firebug and no highlighting and no link

Please help

Upvotes: 1

Views: 1352

Answers (3)

themarcuz
themarcuz

Reputation: 2583

Don't you have something in your Layout page that broke the jQuery functionality? Try to unbind your page from the Layout and test it indipendently. Or post your Layout page to let us see what could be wrong with it...

Edited after seeing the Layout page:

There's the error. you already have the jquery reference in the layout page. This cause the error. Simply delete the reference from you page leaving the one in the layout) and everything is going to work. I created a littel project to test it.

PS: I still don't understand why 2 references to the same javascritp file cause the error :/

Upvotes: 0

alexl
alexl

Reputation: 6851

try to type

<script type="text/javascript" src="../../Scripts/jquery-1.5.1.min.js"></script>

instead of

<script type="text/javascript" src="../../Scripts/jquery-1.5.1.min.js" />

Upvotes: 0

Rory McCrossan
Rory McCrossan

Reputation: 337560

I've put the HTML which would be output from your example above into a fiddle. As you can see, it appears to work correctly.

Is the URL in your reference to jQuery correct?

Upvotes: 1

Related Questions