Как получить значения ячеек по событию клика на вкладках веб-страницы после первой? - PullRequest
0 голосов
/ 14 апреля 2020

Я пробовал javascript и JQuery. Я знаю, как написать код для получения значений ячеек из моей первой вкладки, но эта функция не работает на других вкладках моей веб-страницы. Кажется, будто таблица в других моих вкладках - просто вид. Я новичок в javascript и JQuery, поэтому думаю, что я могу упустить что-то легкое Я использовал «.on» в своей функции щелчка, и это не помогает. Вот код Javascript и код JQuery, оба работают путем захвата значения ячейки, которое я нажимаю, но только для первой вкладки:

JavaScript

init();

function init(){

addRowHandlers('customerTable');
}

function addRowHandlers(tableId) {
    if(document.getElementById(tableId)!=null){
        var table = document.getElementById(tableId);
        var rows = table.getElementsByTagName('tr');
        var cid = '';
        var name = '';

        for ( var i = 1; i < rows.length; i++) {

            rows[i].i = i;
            rows[i].onclick = function() {

                cid = table.rows[this.i].cells[0].innerHTML;                
                name = table.rows[this.i].cells[1].innerHTML;
                alert('cid: '+cid+' name: '+name);
            };
        }
    }
}

JQuery

$('#customerTable').find('tr').click(function() {
    var $id = $(this).closest("tr")   
                       .find(".custId")   
                       .text();       
    var $name = $(this).closest("tr") 
                       .find(".custName")    
                       .text(); 
   alert($name);
    $('.defaultTextBox.text_custId:text').val($id);
    $('.defaultTextBox.text_custName:text').val($name);
});

В конце моя цель состоит в том, чтобы щелкнуть по элементам и установить текст в моих текстовых полях на те значения, которые, как вы можете видеть, я сделал в JQuery, но это работает только на моей первой странице. Мне нужен клик в моей таблице, чтобы работать на всех вкладках. Заранее спасибо!

Редактировать

<div id="removeCustomer" class="tabcontent">
  <h3>Pick a customer to remove!</h3>
  <div class="container">
   <br />
   <h2 align="center">Search here to find the customer you want to remove</h2><br />
   <div class="form-group">
    <div class="input-group">
     <span class="input-group-addon">Search</span>
     <input type="text" name="search_text" id="search_text" placeholder="Search by name, phone number, email, or state" class="form-control" />
    </div>
   </div>
   <br />
   <div class="result"></div>
  </div>
</div>

Идентификатор "removeCustomer" является одной из вкладок. Поэтому у меня есть несколько вкладок, использующих один и тот же «результат», что, как мне кажется, является проблемой, которую я просто не знаю, как ее решить. Если бы я пропустил «результат», он не сгенерировал бы таблицу.

Вот JQuery, который использует файл php для подключения к моей базе данных и получения моих данных. И это то, что генерирует результат.

JQuery

$(document).ready(function(){

  load_data();

  function load_data(query)
  {
    $.ajax({
    url:"fetchCustomers.php",
    method:"POST",
    data:{query:query},
    success:function(data)
    {
      $('div.result').html(data);
    }
  });
  }
  $('input.form-control').keyup(function(){
  var search = $(this).val();
  if(search != '')
  {
   load_data(search);
  }
  else
  {
   load_data();
  }
 });
});

Еще раз спасибо.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...