Jquery or Javascript problem in my partial view

Question

Can I use jQuery or JavaScript code in partial views?

I have a grid in my partial view and I am trying to hide one grid element using jQuery in that partial view. I am not able to do so. But same code works if I use it without a partial view.

Can anybody help me out?

Here is my code

<%@ Page Title="" Language="C#" Inherits="System.Web.Mvc.ViewPage<NascoBenefitBuilder.ViewModels.Obn.ProductTemplate.ObnProductTemplateMainData>" %>
<script type = "text/javascript" language="javascript">
$(document).ready(function(){
    alert("success");
});
</script>

This code is in my partil view but when this page loads I am not able to popup this alert box.

thanks Thanks

Solution 1

There could be few reasons for this not working.

Just to make sure your JQuery is available to partial view, you can try adding jquery references in your partial view page. Hoping you don't have similar issue like this one http://forums.asp.net/t/1649526.aspx/1

Second, if you are calling it through AJAX, javascript included in that partial view is not run by MVC AJAX. Follow this guideline to have it work for you.

http://geekswithblogs.net/DougLampe/archive/2010/11/12/execute-javascript-in-mvc-partial-view.aspx

Solution 2

It might be a conflict or the character $ being interpreted incorrectly, try doing:

<script type="text/javascript">
jQuery(document).ready(function(){
    alert("DOM loaded!");
});
alert("this script tag is executing properly!");
</script>

Solution 3

Check the output page for nested tags, or if any markup is being escaped out. Also, check the browser's javascript console for errors.