Страница загрузки диалога JQuery, содержащая код Javascript - PullRequest
2 голосов
/ 03 апреля 2012

Я загружаю частичное представление в диалоговом окне, которое содержит Javascript. Когда частичное представление отображается в диалоговом окне, отображается частичное представление, но любой Javascript, который был в частичном представлении, отсутствует.

Мой вопрос: Как мне загрузить Javascript, который находится в Частичном представлении?

Вот мой файл Javascript :

$(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");
                }
            }
        });
    }
}

}

Вот мой частичный вид:

@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>
}

1 Ответ

1 голос
/ 04 апреля 2012

Я бы порекомендовал вам перенести весь ваш javascript в отдельный файл js. Смешивать JavaScript и разметку плохо. После того, как вы вывели его, вы можете вызывать любую функцию, какую захотите, когда вы показываете частичное:

$("#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");
        }
    }
});

О, и есть ли причина, по-прежнему использовать сценарии MicrosoftAjax? Они настолько устарели по сравнению с jQuery, что я давно видел, как кто-то их использует. Вы можете прекрасно запустить службу .ASMX с включенным сценарием, используя jQuery.

...