Как передать данные щелкаемой / выбранной строки из одной таблицы в другую таблицу, которые расположены рядом

#javascript #php #jquery #laravel #vue.js

#javascript #php #jquery #laravel #vue.js

Вопрос:

У меня есть две таблицы, которые расположены рядом, и я хотел бы добавить выбранную строку из первой таблицы на вторую вкладку

мне удалось получить данные из выбранной строки и преобразовать их в массив. Я попытался использовать тег v-bind для привязки значений данных во второй таблице, но он не работает

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

Комментарии:

1. пожалуйста, добавьте немного кода

2. какую часть вы хотите увидеть??

3. @Error70 какую часть вы хотите видеть в коде??

4. что вы пытались реализовать логику, эту часть, html-код, код javascript

Ответ №1:

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

 // identify the two tables with IDs for easier access
var tbl1=$('#table_1_id'), tbl2=$('#table_2_id');

// use tbody selector to make sure that you don't bind this event to table heading rows
$('#table_1_id,#table_2_id').find('tbody tr').on('click', moveRow);

function moveRow() {
   // find on which table this row is
   var row = $(this);
   var table_current = row.closest('table');

   // If current table ID equals to first table ID then it means we are in first table
   if (table_current.prop('id')==tbl1.prop('id')) {
      // Then we move the row to second table
      tbl2.find('tbody').append(row);
   } else {
      // The row was in second table so we move it to first table
      tbl1.find('tbody').append(row);
   }

   return;
}