Как отправить кнопку из ниоткуда?

Question

Я создаю новый Datatable, и в нем есть такая функциональность, что я могу расширить строку , если кто-то нажал на нее:

// Add event listener for opening and closing details
$('#datatable-buttons tbody').on('click', 'tr', function(){
    var tr = $(this);
    var row = a.row( this );


    if(row.child.isShown()){
        // This row is already open - close it
        row.child.hide();
        tr.removeClass('shown');
    } else {
        row.child(format(row.data())).show();
        tr.addClass('shown');
           }
});

Итак, если кто-то нажална кнопке в расширенной строке, чем я мог ее прослушать:

$('#datatable-buttons tbody').on('click', 'td button', function(){
    var tr = $(this);
    var row = a.row( this );

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

Это простая функция, которая расширяет строку:

function format ( d ) {
    var editform = '<form> ... <button type="submit" class="btn 
    btn-primary mb-2" >Submit</button></div> </div></form>';

    return editform; 
}

Итак, теперь я мог слушать ее только при нажатии кнопки, но я не знаю, как взять эти данные и отправитьформа.

Еще раз: 1. У данных есть строки и нет кнопок.2. Если вы нажмете на любую из строк - она ​​расширится и покажет детали (появится новая область ниже строки).3. Это форма в этой области.4. Я не могу отправить его.

ОБНОВЛЕНИЕ: jsfiddle Вы можете увидеть проблему, нажав любую строку и нажав кнопку.Таким образом, вы можете получить предупреждение, но не данные формы.

Answer 1

Судя по вашему коду JSFiddle и комментариям, вы пытаетесь подавить отправку формы, чтобы вместо этого использовать AJAX-запрос на отправку данных. Однако вы сделали это, попытавшись изменить атрибут «action» тега form, и при этом ввели синтаксическую ошибку.

Несмотря на то, что вы могли бы заставить эту технику работать, это не рекомендуемый способ и имеет некоторые недостатки. Лучше обрабатывать событие отправки формы с помощью стандартного (делегированного) обработчика события jQuery:

$('#table_id tbody').on('submit', 'form', function(event) { 
  event.preventDefault(); 
  //...and then your AJAX code goes here
});

event.preventDefault остановит обычную отправку формы, чтобы вы могли затем запустить код AJAX.

Вот адаптированная версия вашего JSFiddle, показывающая его в действии: https://jsfiddle.net/moa1nr9j/