CKEditor и ASP.Net MVC 3 Обязательный атрибут

Ответ 1

Если кто-то ищет более общий способ сделать это, вы можете добавить этот javascript:

    $(document).ready(function () {
    if ($('.text-editor')) {
        $('.text-editor').ckeditor();
        $('input[type=submit]').bind('click', function() {
            $('.text-editor').ckeditorGet().updateElement();
        });
    }
    });

И используйте класс CSS-текста .text-editor в текстовом поле, и он отлично работает.

@Html.TextAreaFor(model => model.Description, new { @class = "text-editor" })

Я нахожу это решение eazyer, чем другое, надеюсь, что это может помочь!

Ответ 2

Это еще проще, если вы не используете адаптер jQuery:

$(function () {
    $('input[type="submit"]').click(function () {
        CKEDITOR.instances.Body.updateElement();
    });
});

Где Тело - это идентификатор текстового поля.

Ответ 3

Для меня этот код делает трюк, он, вероятно, может быть оптимизирован немного, но он работает:

$('#newsForm').submit(function (event) {
     var editor = $('#Body').ckeditorGet();
     editor.updateElement();
     $(this).validate().form();
});

Поскольку я не знаю, в каком порядке обработчики событий для отправки запускаются, я обязательно обновляю значение и обновляю результат проверки.

EDIT: Обновленное решение

<script type="text/javascript">
    //<![CDATA[
    $(document).ready(function () {
        $('#Body').ckeditor();
        $('#newsForm').bind('submit', onFirstSubmit);
    });

    function onFirstSubmit(event) {
        var editor = $('#Body').ckeditorGet();
        editor.updateElement();
        $(this).validate().form();
        $(this).unbind('submit', onFirstSubmit).submit();
    }

    //]]>
</script>

Ответ 4

Я также пытался использовать CKEditor, но не повезло. Я использовал CLEditor вместо этого (вместе с обязательным атрибутом), и он отлично подходит для меня.

Когда-нибудь думал о том, чтобы попробовать это?

Ответ 5

Я не мог исправить это с помощью вышеупомянутых решений, но это сработало для меня;

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

<script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Content/ckeditor/ckeditor.js")" type="text/javascript"></script>

<script type="text/javascript">

    $(function () {

        CKEDITOR.replace("activiteit_details", { toolbar: 'Basic' });
        CKEDITOR.replace("activiteit_verslag", { toolbar: 'Full' });


        // Bind CKeditor fields on submit (To avoid problems with the RequiredAttribute)
        $('input[type=submit]').bind('click', function () {

            var CKactiviteit_details = CKEDITOR.instances.activiteit_details.getData();
            $("#activiteit_details").val(CKactiviteit_details);

            var CKactiviteit_verslag = CKEDITOR.instances.activiteit_verslag.getData();
            $("#activiteit_verslag").val(CKactiviteit_verslag);
        });

    });


</script>


@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)
    <fieldset>

...

    <div class="editor-label">
        @Html.LabelFor(model => model.activiteit_details)
    </div>
    <div class="editor-field">
        @Html.TextAreaFor(model => model.activiteit_details)
        @Html.ValidationMessageFor(model => model.activiteit_details)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.activiteit_verslag)
    </div>
    <div class="editor-field">
        @Html.TextAreaFor(model => model.activiteit_verslag)

        @Html.ValidationMessageFor(model => model.activiteit_verslag)
    </div>

...
        <p>
            <input type="submit" value="Opslaan" />
        </p>
    </fieldset>

Ответ 6

Спасибо за ответы. Благодаря этому сообщению я нашел свое собственное решение, которое идеально подходит для моего дела.

Если вы не хотите использовать событие click/mousedown, но вместо этого хотите вызвать проверку правильности формы-отправки, вы можете использовать следующий подход.

Он не использует ни плагин JQuery-Adapter CKEditor, ни событие click. И можно применить его ко всем формам с помощью ckeditor.

$('form').on('submit.ckeditorValidation', function () {
    var $this = $(this);
    var $ckeditor = $this.find('textarea.ckeditor');

    // if no ckeditor for this form then do nothing
    if (!$ckeditor || !$ckeditor.length) {
        return true;
    }

    // update content from CKEditor to TextArea
    var textAreaId = $ckeditor.attr('id');
    CKEDITOR.instances[textAreaId].updateElement();

    // trigger validation and check if the form is valid
    if (!$this.valid()) {
        return false;
    }

    // if form is valid then
    // unsubscribe current event handler to avoid endless recursion
    // and re-trigger form submit
    $(this).off('submit.ckeditorValidation').submit();
    return true;
});

Ответ 7

Я прошел через ту же проблему, и я не смог ее решить из-за еще одной проблемы, связанной с ней.

Когда ckeditor заменяет текстовое поле, он делает его скрытым, и я узнал, что настройки по умолчанию для проверки подлинности jquery состоят в том, чтобы игнорировать скрытые элементы с помощью ": hidden" селектора.

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

$('#frmid').validate().settings.ignore = "input:hidden";
            $('input[type="submit"]').click(function () {
                $("#txtarea").val(CKEDITOR.instances["txtarea"].getData());
            });