Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

I am loading a Partial View in a Dialog box that contains Javascript. When the partial view is displayed in the Dialog box, the partial view shows up, but any Javascript that was in the partial view is not there.

My question: How do I load the Javascript that is on the Partial View?

Here is my Javascript file:

$(document).ready(function () 
{
    BindEvents();
});

function BindEvents()
{
    $('#Reassign').bind('click', function (event, ui) {
    GetReassign();
    return false;
    });

function GetReassign() {
    var checkeditems = $('input:checkbox[name="selectedObjects"]:checked').map(function () { return $(this).val() }).get().join(",");
    if (checkeditems) 
    {
        $("#DialogBox").dialog({
            width: 525,
            modal: true,
            draggable: false,
            resizable: false,
            open: function (event, ui) {
                $(this).load('/ControllerName/PartialView', function () {
                    var checkeditems = $('input:checkbox[name="selectedObjects"]:checked').map(function () { return $(this).val() }).get().join(",");
                    $('input.tasks').val(checkeditems);
                });
            },
            buttons: {
                "Cancel": function () {
                    $(this).dialog("close");
                }
            }
        });
    }
}

}

Here is my Partial View:

@model SFB.SVP2.Objects.InterviewFollowup
@using SVP2UI.Helpers;

<script type="text/javascript">

    var ddlMailCodes;
    var ddlEmployees;

    function pageLoad() {
        ddlEmployees = $get("AssignedTo");
        ddlMailCodes = $get("MailCodes");
        $addHandler(ddlMailCodes, "change", bindOptions);
        bindOptions();
    }

    function bindOptions() {
        ddlEmployees.options.length = 0;
        var MC = ddlMailCodes.value;
        if (MC) {
            Sys.Net.WebServiceProxy.invoke(
                "/Services/BranchService.asmx",
                "Employees",
                false,
                { MC: MC },
                bindOptionResults
            );
        }
    }

    function bindOptionResults(data) {
        var newOption;
        for (var k = 0; k < data.length; k++) {
            newOption = new Option(data[k].LastName + ", " + data[k].FirstName, data[k].ADUser);
            ddlEmployees.options.add(newOption);
        }
    }

</script>

@using (Html.BeginForm("ReassignPost", "InterviewFollowup"))
{
    @Html.ValidationSummary(true)
    @Html.AntiForgeryToken()

<fieldset>
    <legend><strong>Re-Assign Task</strong></legend>

    <input type="hidden" value="" id="tasks" class="tasks" name="tasks" />

    <div style="display: table; float:left; position:relative; width: 50%">
        <div class="editor-label">
            Location:
        </div>
        <div class="editor-field">
            @Html.DropDownList("MailCodes", (IEnumerable<SelectListItem>)ViewData["MailCode"], "-- Select --")
            @Html.ValidationMessage("MailCodes")
        </div>
    </div>

    <div style="display: table; float:right; position:relative; width: 50%">
        <div class="editor-label">
            @Html.LabelFor(model => model.AssignedTo)
        </div>
        <div class="editor-field">
            <select name="AssignedTo" id="AssignedTo"></select>
        </div>
    </div>

    <div class="editor-label">
        Notes:
    </div>
    <div class="editor-field">
        <input type="text" name="Notes" id="Notes" />
        @Html.ValidationMessage("Notes") 
    </div>

    <p>
        <input type="submit" value="Submit" />
        <input type="button" value="Cancel" />
    </p>

</fieldset>
}
share|improve this question
    
Added the Partial View @Dismissile –  Turp Apr 3 '12 at 19:19
    
I'm having a hard time understanding what you're asking. What does the first javascript have to do with anything? –  Dismissile Apr 3 '12 at 19:33
    
The first Javascript loads a JQuery Dialog box when a button is clicked. (I am not showing the main view with the button.) When you click on the button, the Dialog box loads. –  Turp Apr 3 '12 at 19:40
    
When a PartialView (or any page for that matter) is loaded into the JQuery Dialog, it looks as if it strips out all <script> tags! Is there anyway to get around this? I have a JS tag I need to put on the page, but will get errors if the elements are not loaded. So I can't put it on the main page. –  Turp Apr 3 '12 at 20:41
    
I'm pretty sure it's not stripping out the <script> tags; I've done this plenty of times using partial views and AJAX. Try putting an alert("hello") in your script, and see if that gets called. –  Ethan Brown Apr 3 '12 at 21:14

1 Answer 1

up vote 1 down vote accepted

I would recommend you to externalize all your javascript into a separate js file. Mixing javascript and markup is bad. Once you have externalized it, you can call whatever function you like once you show the partial:

$("#DialogBox").dialog({
    width: 525,
    modal: true,
    draggable: false,
    resizable: false,
    open: function (event, ui) {
         $(this).load('/ControllerName/PartialView', function () {
             // OK, at this stage the partial is injected into the DOM
             // here you can call whatever function you like
             // for example the pageLoad(); function

             var checkeditems = $('input:checkbox[name="selectedObjects"]:checked').map(function () { return $(this).val() }).get().join(",");
             $('input.tasks').val(checkeditems);
        });
    },
    buttons: {
        "Cancel": function () {
            $(this).dialog("close");
        }
    }
});

Oh, and is there any reason for still using MicrosoftAjax scripts? Those are so much obsolete compared to jQuery that it's been long time I've seen someone using them. You can perfectly fine invoke a script enabled .ASMX service using jQuery.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.