Where does jquery code go in a partial view?

Question

I am brand new to asp.net MVC and JQuery. I've created a MVC site using the NerdDinner tutorial. For the create and edit views, I'm using a partial view (code simplified below) for data entry. Where would I place my jquery code?

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<Marlow.Controllers.SubcontractFormViewModel>" %>

<% using (Html.BeginForm()) {%>

    <fieldset>
        <legend>Fields</legend>
        <p>
            <label for="grp">group:</label>
            <%= Html.DropDownList("grp", Model.Groups) %>
            <%= Html.ValidationMessage("grp", "*") %>
        </p><p>
            <input type="submit" value="Save" />
        </p>
    </fieldset>

<% } %>

Answer 1

you can have your jquery code anywhere, either in the partial or the page where you call your partial or in an external file.

it depends upon how you want your jquery code to fire if you embed it in the partial it would fire wherever you call it

if your question is whether to place it inside our outside the <%%> the answer is outside

Answer 2

It doesn't really matter, as long as you place your script tag in a valid part of your (X)HTML structure. You should be using jQuery's document.ready function to delay running the script until the whole document has been loaded. This means you're not dependent on the script coming after the HTML that it is manipulating.

That being said, it is often preferable to put as much script as possible into external script files rather than embedding it in your views. (The external script files should be included at the bottom of the body of your HTML document since this gives the best browser performance)

Answer 3

You can put it either in the partial view or in the page that loads it. One thing to watch for though is that if you have jQuery events to fire on elements that are inside the partial view and your loading the script on the main page if you load in the partial view from somewhere else (i.e a GET) then those events won't be attached to the DOM elements.

So if your going to put the script in the main page make sure you use the jQuery Live function to wire up the events.

Answer 4

I'm not so sure about those that say you can place the jQuery code anywhere you like.

I'm big on seperation of concerns and in this case it may be prudent to place the code in the actual View rather than the PartialView.

I say this because as soon as you place the code in the PartialView you are defining its behaviour for ever. If you place the code in the View, it gives you the flexibility to redefine the behaviour later on.

Now to be fully flexible you would place the code in a .js and then load it from the View. Then you can re-use the code in other views as well.

One other benefit is that if your jQuery is doing a partial postback, then placing it at the View level allows you to customise the /controller/action at the View rather than settign variables or passing models to the PartialView to get the same result.

The above does obviously rely on the premise that the PartialView could be re-used in some other way. If it's locked and rigid, then I'd certainly put the code with the partial view.