MVC View вставить в неправильное окно "DOM" Telerik - PullRequest
0 голосов
/ 06 февраля 2012

Заранее извиняюсь, если это станет очень длинным вопросом ...

Справочная информация

У меня есть приложение MVC 3, использующее компоненты Telerik, и эта конкретная проблема характерна (я думаю) для компонента Window ().

Из моего основного представления (Index.cshtml) я выполняю ajax-запрос на возврат частичного представления, которым я заполняю содержимое моего окна. Это jquery, который выполняет запрос:

var url = '@Url.Action("GetAddPart", "Jobs")';            
var window = $("#Window").data("tWindow");
var data = $("#indexForm").serialize();
window.ajaxRequest(url, data);
window.center().open();

действие контроллера:

[HttpGet]
public ActionResult GetAddPart(MDTCompletedJobM model)
{
    // show the AddPart window

    //TryUpdateModel<MDTCompletedJobM>(model);
    model.ActionTakenList = ActionTakenList;
    model.ProblemTypes = ActualProblemList;
    var addPartM = new MDTAddPartM() { CompletedJobM = model };
    return PartialView(string.Concat(ViewDefaultUrl, "AddPart.cshtml"), addPartM);
}

это открывает мое окно.

в моем частичном представлении у меня есть форма с двумя или тремя полями и кнопкой «Добавить», «Отмена». Для краткости я просто покажу, как мне кажется, соответствующие части частичного представления, но я при необходимости может создать весь вид:

<div id="resultDiv">
    @using (Html.BeginForm("AddPart", "Jobs", FormMethod.Post, new { id = "addPartForm", name = "addPartForm" }))
    { 

             ** layout components removed from here **

        <input type="button" value="Add" class="t-button" id="btnAdd"/>
        <input type="button" value="Cancel" class="t-button" id="btnCancel"/>

        <p />
        <div id="progressdiv">
        </div>

    }    
</div>

является тегом "верхнего уровня" в частичном представлении.

мой jquery для обработки кнопки «Отмена»:

$("#btnCancel").click(function () {
    var window = $("#Window").data("tWindow");
    window.close();
});

В моем главном окне у меня есть кнопка отправки, которая после завершения эффективно отображает основной вид «отключен» или отображает ошибки. Действие для этой кнопки отправки возвращает основной вид:

Controller's action snippet:
            if (ViewData["DoPayJobWarningStr"] == null)
                return RedirectToAction("GetAutoDispatchJob", new { autoDispatchJob = model.JobReferenceNumber});
            else
                return View(string.Concat(ViewDefaultUrl, "Index.cshtml"), tmpModel);

Моя актуальная проблема

В конкретном примере, который я использую, я ожидаю, что ViewData ["DoPayJobWarningStr"] НЕ будет иметь значение null, в этом случае будет выполнено возвращаемое представление (...).

если я выполню это действие (для кнопки отправки), не открывая окно, мое представление вернется правильно, и страница обновится, чтобы показать предупреждающее сообщение. Однако, если я сначала открою окно, а затем выполню кнопку отправки, представление не будет обновлено на странице, но, похоже, будет помещено в HTML-код окна. т. е. если я нажму кнопку отправки (ничего не происходит), а затем нажму на кнопку, открывающую окно Telerik, я кратко увижу представление, возвращаемое действием отправки, которое отображается перед его обновлением с тем, что должно содержать частичное представление. Я вообще не понимаю, как или почему туда помещается возвращенный вид?

Вещи, которые я пробовал:

  1. Комментирование ajax-запроса (window.ajaxRequest (url, data);) устраняет проблему (даже если у меня, очевидно, есть пустое частичное представление).
  2. Не сделать частичное представление «формой» не работает
  3. Независимо от того, как я "закрываю" окно, вид все равно находится внутри. например, щелкнув по крестику в правом верхнем углу
  4. При использовании Firebug HTML-код после нажатия кнопки отправки не обновляется.
  5. Вместо того, чтобы использовать "window.ajaxRequest (url, data)", я также попытался (с тем же результатом):

    $.ajax({
        type: "GET",
        cache: false,
        url: url,
        data: $("#indexForm").serialize(),
        success: function (data) {
            var window = $("#Window").data("tWindow");
            window.content(data);
            window.center().open();
            $("#progress").html('')
        },
        error: function (e) {
            alert(e.Message);
        }
    });
    

Можно ли вообще определить, что я делаю не так? Это запрос AJAX? Только если предположить, что устранение этой проблемы решит проблему, но может быть и больше.

Спасибо и, конечно, если вам нужна дополнительная информация, спросите:)

Спасибо

EDIT

После предложений от 3nigma я обновился (до сих пор не повезло) ...

Определение окна Telerik:

@{Html.Telerik().Window()
    .Name("Window")
    .Title("Add Part")
    .Draggable(true)
    .Modal(true)
    .Width(400)
    .Visible(false)
    .Height(270)
    .ClientEvents(e => e.OnOpen("onWindowOpen"))
    .Render();
}

Функция jquery, которая является событием OnClick для кнопки:

function AddBtnClicked() {
    $("#Window").data('tWindow').center().open();
}

событие onWindowOpen:

function onWindowOpen(e) {
    //e.preventDefault();

    var data = @Html.Raw(Json.Encode(Model));
    var d2 = $.toJSON(data);

    $.ajax({
        type: 'GET',
        url: '@Url.Action("GetAddPart", "Jobs")',
        data: d2,
        contentType: 'application/json',
        success: function (data) {
            var window = $("#Window").data("tWindow");
            window.content(data);
            $("#progress").html('');
        },
        error: function (xhtr, e, e2) {
            alert(e +'\n' + xhtr.responseText);
        }
    });
};

1 Ответ

0 голосов
/ 06 февраля 2012

OK.

Проблема была связана с этой строкой в ​​частичном представлении:

<script src="@Url.Content("~/Scripts/ValidationJScript.js")" type="text/javascript"></script>

Как только я вынул это, все работает. Не уверен, почему это вызвало проблему - я не думаю, что это было ранее загружено, но возможно это имело, которое вызывало проблему.

Спасибо 3nigma за ваши мысли, тем не менее!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...