отправить переменную функции на внешний вызов ajax

Question

У меня есть модал, в котором есть элемент текста со значком

<span class="edit-comment-icon" title="Edit"></span>

и при нажатии на значок он превращает h3 в текстовую область:

$('.edit-comment-icon').click(function(){
var _this = $(this),
    h3Tag =_this.prev()[0],
    h3Value = productComment;

    var input = $('<textarea />', {
        val: h3Value, 
        type: "text", 
        class:'uk-width-4-10',
        style: 'padding: 5px',
        rows: '5'
        });

    h3Tag.replaceWith(input[0]);
    $('.edit-comment-icon').hide();
    $('.save-comment-button').removeClass('uk-hidden').css('font-size','20px');
})

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

Так что, если в заголовке указано «ТЕСТ», и они редактируют его, а затем в текстовой области изменяют его на «тестирование» и нажимают кнопку «Сохранить / отправить», мне нужно передать «тестирование» моему вызову ajax вместе с текущими данными, которые он получает:

$('#saveButton').click(function(){
    $ajax({
      url: 'url',
      data: dataset /*but need to add textarea value to this*/
    });
})

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

Answer 1

Просто используйте селектор, который нацелен на элемент textarea внутри модального элемента, например, если ваш модальный элемент имеет класс my-modal, вы можете использовать .my-modal textarea

$('#saveButton').click(function(){
    var value = $('.my-modal textarea').val();
    var dataset = {
      myTextarea:value
      //and/or other properties
    };    
    //or if dataset is already created
    dataset.myTextarea = value;

    $ajax({
      url: 'url',
      data: dataset
    });
})

Если их более одногоtextarea внутри модала, вам нужно добавить id или какой-то уникальный класс для этого textarea

var input = $('<textarea />', {
  val: h3Value, 
  type: "text", 
  class:'for-h3 uk-width-4-10',
  style: 'padding: 5px',
  rows: '5'
});

и затем в обратном вызове

var value = $('.my-modal .for-h3').val();