Частичный просмотр через Ajax все ссылки на Javascript не работают

Question

У меня есть PartialView в моем приложении MVC, которое возвращает мое представление, если в ModelState есть ошибки.На сайте _Layout много ссылок на javascript (jQuery, JQuery.validate, ...), которые я использую в представлении partai.Здесь код: Javascript представить:

$(function () {
$('form').submit(function (e) {
    e.preventDefault();
    if ($('form').valid()) {
        $.ajax({
            url: this.action,
            type: this.method,
            data: $(this).serialize(),
            success: function (result) {
                if (!result.Success) {
                    $('#formcontent').html(result); // Show PartailView with Validationmessages
                }
                else {
                }
            }
        });
    }
});

});

Родительский сайт:

<div id="formcontent" class="tc-form">
    @{ Html.RenderPartial( "_ConfigurationPartial", Model ); }
</div>

Частичное представление:

@model SettingsViewModel
@{ Layout = null; }
@using( Html.BeginForm() )
{
    @Html.ValidationSummary( false, SystemStrings.ValidationSummaryMessage )
    <ol class="last">
       <li class="row">
            @Html.LabelFor( m => m.PasswordMinimumLength )
            @Html.EditorFor( m => m.PasswordMinimumLength )
            @Html.ValidationMessageFor( m => m.PasswordMinimumLength, "*" )
        </li>
        <li class="row">
            @Html.LabelFor( m => m.PasswordNeverExpires )
            @Html.EditorFor( m => m.PasswordNeverExpires )
            @Html.ValidationMessageFor( m => m.PasswordNeverExpires, "*" )
        </li>
        <li class="row">
            @Html.LabelFor( m => m.PasswordExpirationValue )
            @Html.EditorFor( m => m.PasswordExpirationValue )
            @Html.ValidationMessageFor( m => m.PasswordExpirationValue, "*" )
            @Html.EditorFor( m => m.PasswordExpirationUnit )
            @Html.ValidationMessageFor( m => m.PasswordExpirationUnit, "*" )
        </li>
    </ol>
    <div class="tc-form-button">
        <input type="submit" value="Save" title="Save" class="t-button t-state-default" />
        @Html.ActionLink( "Cancel", "Configuration", "System", null, new { @class = "t-button" } )
    </div>
}

<script type="text/javascript">
    jQuery(document).ready(function () {
        $('#PasswordNeverExpires').change(function () {
            setState($(this).is(':checked'));
        });
    });

    function setState(isDisabled) {
        if (isDisabled) {
            // ...
        }
        else {
            // ...
        }
    }

Контроллер:

    [HttpPost]
    public ActionResult Configuration( SettingsViewModel model )
    {
        if( !ModelState.IsValid )
        {
            this.PopulateViewData();
            return PartialView( "_ConfigurationPartial", model );
        }
        else
        {
            // ... do save
            return Json( new { Success = true }, JsonRequestBehavior.AllowGet );
        }
    }

Если частичный просмотр загружается через ajax, все мои Javascript нарушаются.Там нет второго AJAX представить, это нормальный пост.Таким образом, Partalvew отображается без какой-либо информации о макете.Кажется, что все ссылки javascript не найдены.Есть ли способ обновить DOM или что-то еще?Должен ли я иметь все JavaScript в PartailView?Как правильно это сделать?

С уважением

Answer 1

Ваша проблема в том, что вы связываете событие отправки с формой при первой загрузке страницы. Когда вы перезагружаете форму через ajax, вам нужно перепривязать событие отправки к новой форме.

Вы также можете live связать событие, которое вы делаете только один раз

$("form").live("submit", function(e) {
    e.preventDefault();
    if ($('form').valid()) {
        $.ajax({
            url: this.action,
            type: this.method,
            data: $(this).serialize(),
            success: function(result) {
                if (!result.Success) {
                    $('#formcontent').html(result); // Show PartailView with Validationmessages
                }
                else {}
            }
        });
    }

});

читать дальше здесь

Answer 2

Этот код находится за пределами частичного просмотра:

<script type="text/javascript">
jQuery(document).ready(function () {
   var oldvalue=$('#PasswordNeverExpires').val();
   $('#PasswordNeverExpires').change(function(){
      oldvalue=$(this).val();
   })
});
</script>

Затем я немного изменяю ваш код в PartialView:

jQuery(document).ready(function () {
        if($('#PasswordNeverExpires').val()!=oldvalue){
            //your scripts put here.
        }
    });

Приведенный выше код не был проверен, но он должен работать.