Как получить содержимое формы nicEdit при отправке через ajax?

Итак, что я хочу сделать, это отправить форму с помощью функции AJAX jQuery. И маршрут, который я выбрал, должен был использовать $('#form').serialize (); а затем передайте это как запрос GET. Это работает все денди и хорошо и денди, пока я не добавлю редактор, NicEdit, который я собираюсь использовать на сайте.

Я исследовал проблему, и ситуация такова, что как только NicEdit берет на себя текстовую область, например, он скрывает текстовую область для пользователя и вместо этого имеет ее запись в a . Эта информация затем будет помещен обратно в текстовую область, вызванную нажатием обычной кнопки отправки.

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

учитывая основную настройку моей ситуации:http://jsfiddle.net/MMzhS/1/ - Как бы вы получили данные из формы NicEdit в текстовую область перед alert(); вызывается?

9
ajax jquery nicedit

7 ответов

var nicE = new nicEditors.findEditor('assignment');
question = nicE.getContent();

'assignment' - Ваш идентификатор textarea.

содержимое textarea сохраняется в переменной вопроса, надеюсь, это поможет

23

следующее, как предусмотрено BinaryKitten из #jQuery, делает то же самое, но немного чище, на мой взгляд:http://jsfiddle.net/MMzhS/5/

12

  1. создать экземпляр nicEdit

    MyApp.editor = новый nicEditor ().panelInstance ('texarea_id');

  2. пусть пользователь вводит контент в свое сердце! (Каламбур)

  3. содержимое:

    var content = MyApp.редактор.instanceById ('textarea_id').getContent();

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

2

var nicInstance = nicEditors.findEditor ('options1'); var messageContent = nicInstance.getContent();

где options1-идентификатор textarea

2
var data = $('#peter div').eq(90).text();

- это информация, данные. Кроме того, пожалуйста, используйте $.post вместо $.get для представления формы; - быть хорошим к интернету.

0
document.getElementById("content").value = "<html><head><title></title><head><body>"+nicEditors.findEditor("this will be your id of your textarea").getContent()+"</body></head></html>";
var templateContent = document.getElementById("content").value;
0

для людей, которым интересно, как добавить пользовательский combobox в nicEdit, вот мой блог, чтобы отобразить пользовательский раскрывающийся список с динамическими значениями

ссылке

через редактирование файла NiceEdit js мы можем добавить пользовательское поле со списком в NicEdit

через Следующий способ мы можем добавить выпадающий список или combobox в NicEdit. Вы можете получить раскрывающееся значение из базы данных через ajax-вызов и показать его в NicEdit Прежде всего загрузите и реализуйте NicEdit на aspx страница Загрузите файл NiceEdit js, и вы можете включить его, следуя коду (http://nicedit.com/)

 <div style="height: 700px; width: 70%; overflow: scroll">                <div id="sample"><script type="text/javascript" src="../scripts/nicEdit.js"></script><script src="../nicExample/nicExample.js"></script>
                    <script type="text/javascript">
                        bkLib.onDomLoaded(function () {
                            //  nicEditors.allTextAreas()
                            new nicEditor({ fullPanel: true }).panelInstance('area2');});</script>
                    <h4>NicEdit Textarea</h4><textarea name="area2" id="area2" style="width: 70%; height: 700px"> </textarea>
                    </div></div>

теперь добавьте функцию getddlData() Ajax в niceEdit.JS файл в конце файла

// AJAX call
function getddlData() {
    var ajaxResponse;
    $.ajax({
        type: "POST",
        url: 'NicEdit.aspx/GetBookMarkData', // AJAX call to fecth dropdown data
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        async: false,
        cache: false,
        // Text file name
        success: function (response) {
            //    //alert(data.d);    // or do some other data processing
            //   //return data.d;
            ajaxResponse = response;
        }
    });
    return ajaxResponse.d;
}

/ / добавить webMethod в codebehind (.cs-файл) для выпадающего значения fetech в nicedit

   [WebMethod]
        public static string GetBookMarkData()
        {
///Also you can get DB's data here
            ///  (2 responses dropdown values being filled :  'drop down Value', drop down Text)
            /// Need DB data in , seprated list  Formate:  @@Test@@,TestOne, TestOne,  @@Test2@@,Test2,Test2
            string sbookmarkData = "<<Test_Name>>,Test Name,<<Test_Add>>,Test Add,<<Test_Location>>,Test Location,<<Test_City>>,Test City,<<Test_Phone>>,Test Phone";
            return sbookmarkData;
        }

теперь откройте файл NicEdit js и скопируйте (строка № 1552) или найдите следующую строку:

var nicEditorFontFormatSelect = nicEditorSelect.extend({

Copy complete function and create another one by changing names etc

var nicEditorInsertBookmark = nicEditorSelect.extend({
    /* By Pankaj Sharma : Not Needed Now  */
    sel: {
        '[[Location]]': "Test Name",
        pre: "Test Address",
        h6: "Test City",
        h5: "Test State",
        h4: "Test Zip",
        h3: "Test ABC",
        h2: "Test One",

    },
    init: function () {
        /* Pankaj Sharma */
        this.setDisplay("Insert Bookmark");
        var response = getddlData();
        var responseArr = response.split(",");
        var strings = [];
        //for (itm in this.sel) {         
        //  //  var A = itm.toUpperCase();
        //    //this.add(  A,  this.sel[itm]  )
        //   }

        for (i = 0; i < responseArr.length; i++) {
            strings.push([responseArr[i], responseArr[i + 1]]);
            i = i + 1;
        }
        for (var i in strings) {
            this.add(strings[i][0], strings[i][1]);
        }
        /* END HERE*/
    },
});

Got to line no 1230 или выполните поиск строка:

var nicSelectOptions = { кнопки: { Добавить следующее ниже fontFormat function

'CustomBookmark': { имя: __('вставить закладку'), тип: 'nicEditorInsertBookmark', // команда: 'InsertBookmark' / / InsertBookmark }

теперь обновленная функция должна выглядеть так

var nicSelectOptions = {
    buttons: {
        'fontSize': {
            name: __('Select Font Size'),
            type: 'nicEditorFontSizeSelect',
            command: 'fontsize'
        },
        'fontFamily': {
            name: __('Select Font Family'),
            type: 'nicEditorFontFamilySelect',
            command: 'fontname'
        },
        'fontFormat': {
            name: __('Select Font Format'),
            type: 'nicEditorFontFormatSelect',
            command: 'formatBlock'
        },
        'CustomBookmark': {
            name: __('Insert Bookmark'),
            type: 'nicEditorInsertBookmark',  //
            command: 'InsertBookmark'   //InsertBookmark
        }
    }
};

теперь Гото линия 1385 или обновление: функция (а) { Измените его на

 update: function (A) {
        //  alert(this.options.command);
        if (this.options.command == 'InsertBookmark') {+
 var editor = nicEditors.findEditor("area2");
        var range = editor.getRng();
        var editorField = editor.selElm();

            editorField.nodeValue = editorField.nodeValue.substring(0, range.startOffset) + A + editorField.nodeValue.substring(range.endOffset, editorField.nodeValue.length);
}
        else {
            // alert(A);  
            /* END HERE */
            this.ne.nicCommand(this.options.command, A);
        }
        this.close()
    }

в раскрывающемся списке нажмите Это добавит Выпадающее значение в текстовом редакторе в позиции курсора.

конец, вы должны иметь возможность видеть результаты

0