Antarr Byrd
Antarr Byrd

Reputation: 26169

Render Partial Using jQuery

I'm trying to render a partial using jQuery in MVC3. I want to do it my changed the HTML in a section so it can be updated when a dropdown's selection changes.

$(document).ready(function(){

    $("#partial-6").html(@Html.Partial("_Edit",Model.Groups[0]));

});

Doesn't modify the section when the page is loaded. Just says what I typed there " I am partial"

Upvotes: 1

Views: 1135

Answers (1)

Jasper
Jasper

Reputation: 76003

Unless the asp code is adding quotes, you will need to do so. Otherwise you aren't passing a string into the .html() function:

$(function(){
    $('#drop-down-id').on('change', function () {
        $("#partial-6").html('@Html.Partial("_Edit",Model.Groups[0])');
    });
});

This will put the same code into the #partial-6 element each time the #drop-down-id element is changed. If you want to actually change the information you are putting in the #partial-6 element, you will need to make an AJAX call to return the partial from the server.

$(function(){
    $('#drop-down-id').on('change', function () {
        $.get('path/to/server-side.asp', { id : $(this).val() }, function (serverResponse) {
            $("#partial-6").html(serverResponse);
        });
    });
});

This will create a GET request for a server-side script that is sent with the GET variable, id, which is set to the value of the drop-down that triggered the code.

Note that .on() is new in jQuery 1.7 and in this case is the same as .bind().

Upvotes: 2

Related Questions