Witam! Jestem aktualnie w trakcie wykonywania pewnego projektu jako stażysta, tak więc dość mocno laik ze mnie (zwłaszcza, że na stażu głównie miałem się zajmować UI designem, nie kodzeniem). Projekt prawie ukończony, borykam się właściwie z ostatnim problemem.
Otóż mam sobie tabelę, uzupełniającą się automatycznie na podstawie rekordów w bazie danych, zawierających informacje takie jak: nazwa komputera, nazwa użytkownika, data ostatniej aktualizacji danego rekordu, informacje o sprzęcie, informacje o zainstalowanym oprogramowaniu i licencjach. Zalecenie było następujące: widoczne na wierzchu miały być nazwy komputerów i użytkowników oraz wspomniana data aktualizacji, reszta miała być rozwijana. Ponadto ma być wyszukiwarka, która po znalezieniu szukanej frazy rozwinie rekord(y), w którym(ych) jest ona zawarta.
Tabelę wykonałem w sposób następujący: najpierw tr odkryty, z podstawowymi informacjami, po nim następuje tr rozwijany z resztą informacji. Wyszukiwarka oczywiście wyszukuje sobie frazy i rozwija odpowiednie tr... ale tylko pod warunkiem, że szukana fraza znajduje się w zwiniętym tr, czyli jest np. nazwą oprogramowania. Jeśli wyszukuję czegoś, co znajduje się w domyślnie rozwiniętym tr (np. nazwy komputera), to owszem, wyszukuje frazę, ale nie rozwija tego ukrytego pod nim.
Oto fragment kodu odpowiadający za tworzenie tabeli:
@foreach (var computer in Model.Computers)
{
//var index = computer.Name + Model.Computers.IndexOf(computer).ToString();
var records = Model.Records.Where(r => r.ComputerId == computer.Id).OrderByDescending(r => r.LastReport);
var installedProducts = Model.Products.Where(p => records.Any(r => r.ProductId == p.Id && r.isInstalled == true));
var uninstalledProducts = Model.Products.Where(p => records.Any(r => r.ProductId == p.Id && r.isInstalled == false));
<tr>
<td><span class="record search b">@computer.Name</span></td>
<td><span class="record search b">@computer.UserInfo</span></td>
<td><span class="record search">@computer.LastReport</span></td>
<td class="btn-container">
<button type="button" onclick="icon(this)"><span class="fas fa-chevron-circle-down down icon"></span></button>
</td>
</tr>
<tr class="collapse show-all">
<td colspan="4">
<div class="device-info col-sm-4">
<span class="custom-label">Device information:</span>
<br />
<span class="info"><span class="component">Processor:</span><span class="component-data">---</span></span>
<span class="info"><span class="component">RAM:</span><span class="component-data">---</span></span>
<span class="info"><span class="component">Disk space (free/total):</span><span class="component-data">---</span></span>
<span class="info"><span class="component">UUID:</span><span class="component-data">---</span></span>
</div>
<div class="products col-sm-4">
<span class="custom-label">Products:</span>
@foreach (var product in installedProducts)
{
var record = records.Single(r => r.ProductId == product.Id);
<div class="computer-product">
<span class="product-name b search">@product.Name</span>
<br />
<span class="product-key search">Key: @product.Key</span>
<br />
</div>
}
</div>
<div class="un-uproducts col-sm-4">
<span class="custom-label">Uninstalled products:</span>
@foreach (var product in uninstalledProducts)
{
var record = records.Single(r => r.ProductId == product.Id);
<div class="computer-product">
<span class="product-name search b">@product.Name</span>
<br />
<span class="product-key search">Key: @product.Key</span>
<br />
<span class="last-report">Last report: @record.LastReport</span>
</div>
}
</div>
</td>
</tr>
}
A oto część kodu odpowiadającego za rozwijanie wyszukiwanej frazy:
function findElementToExpand(el) {
while ((el = el.parentElement) && !el.classList.contains("collapse"));
return el;
}
//[...]
var elementToExpand = findElementToExpand(this);
$(elementToExpand).fadeIn(0);
Próbowałem na podstawie powyższego dodać funkcję .next('tr') kiedy widzi, że dany wiersz zamiast klasy "collapse" zawiera klasę "collapseSubling". Nie działało, myślę jednak, że po prostu mieszam się w adresowaniu błądząc po DOMie.
Będę wdzięczny za pomoc w rozwiązaniu problemu. Jeśli potrzeba bardziej szczegółowych wyjaśnień, to ich udzielę. Gorzej z pokazaniem większej części kodu (usprawniam istniejący już program i choć zmieniłem go prawie całkowicie, kod nie jest w 100% mój i nie wiem, na ile mogę go publikować).
Pozdrawiam.