Javascript-форум - Помогите с add remove class

Javascript-форум (https://javascript.ru/forum/)

- Элементы интерфейса (https://javascript.ru/forum/dom-window/)

- - Помогите с add remove class (https://javascript.ru/forum/dom-window/65864-pomogite-s-add-remove-class.html)

Помогите с add remove class

Есть таблица, по клику на строке, открывается дополнительная инфо, при повторном клике закрывается инфо. Работает, если кликать медленно, а если быстро кликнуть два или несколько раз, открывается много инфо. Как это устранить?

<script>
		$(document).ready(function() {							
			// Details
			$('.parent').on('click', function(){
				parent = $(this);
				if (parent.hasClass('active')) {
					parent.next().remove();					
					parent.removeClass('active');										
				} else {					
					$.ajax({
						url: './lm_ld.php',
						data: {
							login: parent.data('login'),
							datestart: '<?php echo $datestart; ?>',
							dateend: '<?php echo $dateend; ?>',
							shift: '<?php echo $shift; ?>',
							date: parent.data('date'),
							shift: '<?php echo $shift; ?>'
						}
					}).done(function(response) {							
						$('<tr class="details"><td colspan="6">' + response + '</td></tr>').insertAfter(parent);
						parent.addClass('active');											
					});
				}
			});
		});
</script>

Цитата:

Сообщение от Sav2907

Как это устранить?

не удалять запрошенную информацию и не запрашивать дважды

Sav2907,
как-то так ...

$(function() {

      // Details
      $('.parent').on('click', function(){
        var parent = $(this), next = parent.next('.details'), ok = parent.data('ok');
        if(next.length){
        next.toggle();
        parent.toggleClass('active')
        }
        else if(!ok){
          $.ajax({
            url: './lm_ld.php',
            data: {
              login: parent.data('login'),
              datestart: '<?php echo $datestart; ?>',
              dateend: '<?php echo $dateend; ?>',
              shift: '<?php echo $shift; ?>',
              date: parent.data('date'),
              shift: '<?php echo $shift; ?>'
            }
          }).done(function(response) {
            var ok = parent.data('ok');
            if(!ok){
            $('<tr class="details"><td colspan="6">' + response + '</td></tr>').insertAfter(parent);
            parent.addClass('active');
            parent.data('ok',true);
            }

          });
        }
      });


});

рони,
Спасибо, проверить не могу, код на работе. В понедельник проверю

рони,
Спасибо большое, работает

Еще одно, по клику на красный крестик (<a href="del.php?id='.$row['id'].'">), отправляется $ _POST и запись удаляется. После этого, нужно чтобы с таблички запись исчеза без обновления страницы.

Sav2907,
не понимаю

Например кликаю по крестику записи №7, с базы запись удаляется. С таблички она тоже исчезнет после обновления страницы, а нужно обновить саму табличку а не страницу

Короче говоря, нужно этот кусок прикрутить к крестикам.

.done(function(response) {
            var ok = parent.data('ok');
            if(!ok){
            $('<tr class="details"><td colspan="6">' + response + '</td></tr>').insertAfter(parent);
            parent.addClass('active');
            parent.data('ok',true);
            }
 
          });

Sav2907,
где код для креста?

echo '<div align="center"><table class="ui small celled two table" style="border: 1px solid #A4A4A4; width: 100%;">
	<thead>
		<tr>
			<th>№</th>
			<th>Дата</th>			
			<th>Час зміни</th>			
			<th>Прес</th>
			<th>Аплікатор</th>
			<th>Ударів</th>
			<th>ID</th>
			<th>Роб. крок</th>
			<th>№ Замовлення</th>
			<th>Назва частини</th>
			<th>Вид операції</th>
			<th>RM</th>
			<th>Кількість</th>
			<th>Брак</th>
			<th>Хвилин</th>
			<th>Код простою</th>
			<th>Час простою</th>
			'.((!isset($userdata['id'])) && (!isset($_COOKIE['id'])) && $userdata['id'] === $_COOKIE['id'] ? '' : '<th></th>').'
		</tr>
	</thead><tbody>';
	$i=1;

	while ($row = mysqli_fetch_assoc($result4)) {
	
		echo "<tr class='child' ".(!empty($row['protokol']) ? 'style="background: #000; color: #fff;"' : '')." data-login='$row[login]'>
				<td>".$i++."</td>			
				<td>$row[created]</td>				
				<td>$row[zmina]</td>				
				<td>$row[pres]</td>
				<td>$row[aplikator]</td>
				<td>$row[udariv]</td>
				<td>$row[nomer]</td>
				<td>$row[mash]</td>
				<td>$row[xpps]			
				<td>$row[referal]</td>
				<td>$row[result]</td>
				<td>$row[RM]</td>
				<td>$row[kilkist]</td>
				<td>$row[brak]</td>
				<td>$row[chas]</td>
				<td>$row[kod_prost]</td>
				<td>$row[chas_prost]</td>
				<td><a href="del.php?id='.$row['id'].'"><img src="img/delete.png"></a></td>
			  </tr>";
	}	
	echo '</tbody></table></div>';

Sav2907,
зарисовка на тему ...

$('.child').on('click', 'a', function(event) {
 event.preventDefault();
 var parent = $(this).parents('.child'), next = parent.next('.details'), url = this.href;
 $.ajax({url: url}).done(function() {parent.add(next).remove()});
})

рони,
А если

<td>$row[kilkist]</td>
                <td>$row[brak]</td>
                <td>$row[chas]</td>
                <td>$row[kod_prost]</td>
                <td><a href="update.php?id='.$row['id'].'"><img src="img/update.png"></a></td>
                <td><a href="del.php?id='.$row['id'].'"><img src="img/delete.png"></a></td>

Sav2907,
$('.child').on('click', 'aТочкаВашКласс',
<td><a href="del.php?id='.$row['id'].'" class="ВашКласс"><
:-?