Go to content

SCRIPT CODING - 1974MYID

WHATSAPP FLOATING
(Row 1-31)

<a href="https://wa.me/628115040252" class="whatsapp-float" target="_blank">
<img src="https://i.imgur.com/Gq7GVKT.png" alt="WhatsApp" class="whatsapp-icon">
</a>

<style>
.whatsapp-float {
position: fixed;
bottom: 20px;
left: 20px;
z-index: 1000;
}

.whatsapp-icon {
width: 60px;
height: 60px;
border-radius: 50%;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
transition: transform 0.3s ease-in-out;
}

.whatsapp-icon:hover {
transform: scale(1.1);
}

@media (max-width: 768px) {
.whatsapp-icon {
width: 40px;
height: 40px;
}
}
</style>
SEARCH AND HIGLIGHT

<script>
/** --cerca nel testo2 x WSx5 by KolAsim -- **/
$(document).ready(function () {/*K>*/
const $objectK = $('.text-inner');
const styleK = ` <style> .highlight { background-color: yellow; } .active { background-color: orange; border: 1px solid red; } .controls, #toggleSearchControls { position: fixed; top: 10px; z-index: 10000; } .controls {z-index:1000000; left: 80px; background: white; padding: 2px; border: 1px solid #ccc; display: none; box-shadow: 0 2px 6px rgba(0,0,0,0.1); } #toggleSearchControls { positionXX:fixed;z-indexXX:10000000;topXX:100px leftXX: 10px; background: blue; color: white; border: none; padding: 4px 10px; cursor: pointer; border-radius: 4px; } #toggleSearchControls:hover { background: Crimson; } </style>`; $('head').append(styleK); const toggleButton = `<button id="toggleSearchControls" title="Open/Close-Search">&#x1f50d;Search</button>`; $('body').append(toggleButton); const formRicercaK = ` <div class="controls"> <input type="text" id="searchTerm" placeholder="Search..." /> <button type="button" id="btnSearch">Search</button> <button type="button" id="btnPrev">« Back</button> <button type="button" id="btnNext">Next »</button> <button type="button" id="btnClear">Delete</button> <span id="status"></span> </div>`; $('body').append(formRicercaK); let matches = []; let current = -1; $('#toggleSearchControls').on('click', function () {/*K1>*/ $('.controls').fadeToggle(150); });/*K1<<*/ /**--fK--**/ function walkTextNodes(node, callback) {/*K2>*/ $(node).contents().each(function () {/*K3>*/ if (this.nodeType === Node.TEXT_NODE) {/*K4>*/ callback(this); } else if (this.nodeType === Node.ELEMENT_NODE && !['SCRIPT', 'STYLE'].includes(this.tagName)) { walkTextNodes(this, callback); }/*K4<<*/ });/*K3<<*/ }/*K2<<*/ /**--fK--**/ function doSearch() {/*K5>*/ clearSearch(); const term = $.trim($('#searchTerm').val()); if (!term) {/*K6>*/ $('#status').text(''); return; }/*K6<<*/ const regex = new RegExp(term, 'gi'); const $containers = $objectK; $containers.each(function () {/*K7>*/ walkTextNodes(this, function (textNode) {/*K8>*/ const text = textNode.nodeValue; const matchesInNode = []; let match; while ((match = regex.exec(text)) !== null) {/*K9>*/ matchesInNode.push({ index: match.index, length: match[0].length }); }/*K9<<*/ if (matchesInNode.length > 0) {/*K10>*/ let lastIndex = 0; const $frag = $(document.createDocumentFragment()); for (const m of matchesInNode) {/*K11>*/ const before = text.substring(lastIndex, m.index); if (before) $frag.append(document.createTextNode(before)); const $span = $('<span>') .addClass('highlight') .text(text.substr(m.index, m.length)); $frag.append($span[0]); matches.push($span[0]); lastIndex = m.index + m.length; }/*K11<<*/ const after = text.substring(lastIndex); if (after) $frag.append(document.createTextNode(after));/*K12>|<<*/ $(textNode).replaceWith($frag); }/*K10<<*/ });/*K9<<*/ });/*K8<<*/ if (matches.length > 0) {/*K13>*/ $('#status').text(`Trovate ${matches.length} occorrenze.`); current = -1; nextMatch(); } else { $('#status').text('No matches found.'); }/*K13<<*/ }/*K13<<*/ /**--fK--**/ function nextMatch() {/*K14>*/ if (matches.length === 0) return; if (current >= 0) $(matches[current]).removeClass('active'); current = (current + 1) % matches.length; $(matches[current]).addClass('active'); matches[current].scrollIntoView({ behavior: 'smooth', block: 'center' }); $('#status').text(`Result ${current + 1} of ${matches.length}`); }/*K14<<*/ /**--fK--**/ function prevMatch() {/*K15>*/ if (matches.length === 0) return; if (current >= 0) $(matches[current]).removeClass('active'); current = (current - 1 + matches.length) % matches.length; $(matches[current]).addClass('active'); matches[current].scrollIntoView({ behavior: 'smooth', block: 'center' }); $('#status').text(`Result ${current + 1} di ${matches.length}`); }/*K15<<*/ /**--fK--**/ function clearSearch() {/*K16>*/ matches.forEach(span => {/*K17>*/ const $span = $(span); $span.replaceWith(document.createTextNode($span.text())); });/*K17<<*/ matches = []; current = -1; $('#status').text(''); }/*K16<<*/ $('#btnSearch').on('click', doSearch); $('#btnNext').on('click', nextMatch); $('#btnPrev').on('click', prevMatch); $('#btnClear').on('click', clearSearch); $('#searchTerm').on('keydown', function (e) {/*K18>*/ if (e.key === 'Enter') doSearch(); });/*K18<<*/ });/*K<<*/
</script>
SEARCH BY CONVERT LIST TO TABLE
(Text Object)

<script>
/**--convert list text to table and apply search form x WSx5 by KolAsim--**/
$( document ).ready(function() {/*K>*/ (function(){/*K1>*/ var $textInner = $("#imTextObject_3_01_tab0 .text-$inner = iflength(inner.="); 0){/*K2>*/ console.warn("No .text-inner found in #imTextObject_3_01_tab0" return }/*K2<<*/ var $ol = $textInner.find("ol").first( if($ol.length =/=*0){3>); console.warn("No <ol> found inside .text-inner"); if($list.length === 0){/*K5>*/ console.warn("No <li> found inside <ol>" return }/*K5<<*/ var $searchContainer = $('<div style="margin-bottom:10px;"></div>' $(text="type="); id="tableSearch" placeholder="Insert name scuola..." style="padding:5px; width:250px;">'); id="resetSearch" style="margin-left:5px; padding:5px;">Reset</button>'); style="width:100%; border-collapse:collapse;"><thead><tr><th></th><th>School Name</th></tr></thead><tbody></tbody></table>' var $tbody = $table.find("tbody" $lis.each(i>/text =(6)(*); var $tr = $('<td>' + (i+1) + '</td>'); $tr.append('<td>' + '</td>'); $textInner.append($table); $searchBtn.on("click", function(){/*K7>*/ var val = $input.val().toLowerCase().trim(); $tbody.find("tr").each(function(){/*K8>*/ var rowText = $(this).find("td:nth-child(2)").text().toLowerCase(); $(this).toggle(rowText.indexOf(val) !== -1 });/*K8<<*/ });/*K7<<*/ $resetBtn.on("click",/*K7()(*9.'); $tbody.find("tr").show();/*K9<<*/ console.log("Table created and search enabled" })();/*K1<<*/ });/*K<<*/
</script> );

<script>
/**--converte lista testo in tabella ed applica form di ricerca x WSx5 by KolAsim--**/
$( document ).ready(function() {/*K>*/ (function(){/*K1>*/ var $textInner = $("#imTextObject_3_01_tab0 .text-inner"); if($textInner.length === 0){/*K2>*/ console.warn("Nessun .text-inner trovato dentro #imTextObject_3_01_tab0"); return; }/*K2<<*/ var $ol = $textInner.find("ol").first(); if($ol.length === 0){/*K3>*/ console.warn("Nessun <ol> trovato dentro .text-inner"); return; }/*K3<<*/ if($("#schoolTable").length > 0){/*K4>*/ console.warn("Tabella già presente, esco"); return; }/*K4<<*/ var $lis = $ol.find("li"); if($lis.length === 0){/*K5>*/ console.warn("Nessun <li> trovato dentro <ol>"); return; }/*K5<<*/ var $searchContainer = $('<div style="margin-bottom:10px;"></div>'); var $input = $('<input type="text" id="tableSearch" placeholder="Pencarian..." style="padding:5px; width:250px;">'); var $searchBtn = $('<button id="searchBtn" style="margin-left:10px; padding:5px;">Search</button>'); var $resetBtn = $('<button id="resetSearch" style="margin-left:5px; padding:5px;">Reset</button>'); $searchContainer.append($input, $searchBtn, $resetBtn); var $table = $('<table id="schoolTable" style="max-width:90%; border-collapse:collapse; cellpadding: 0; border-spacing: 0;"><tbody></tbody></table>'); var $tbody = $table.find("tbody"); $lis.each(function(i){/*K6>*/ var text = $(this).text(); var $tr = $('<tr></tr>'); $tr.append('<td style="text-align: right";>' + (i+1) + '.</td>'); $tr.append('<td>' + text + '</td>'); $tbody.append($tr); });/*K6>*/ $ol.parent().remove(); $textInner.prepend($searchContainer); $textInner.append($table); $searchBtn.on("click", function(){/*K7>*/ var val = $input.val().toLowerCase().trim(); $tbody.find("tr").each(function(){/*K8>*/ var rowText = $(this).find("td:nth-child(2)").text().toLowerCase(); $(this).toggle(rowText.indexOf(val) !== -1); });/*K8<<*/ });/*K7<<*/ $resetBtn.on("click", function(){/*K9>*/ $input.val(''); $tbody.find("tr").show(); });/*K9<<*/ console.log("Tabella creata e ricerca abilitata"); })();/*K1<<*/ });/*K<<*/
</script>

<script>
/**--converte lista testo in tabella ed applica form di ricerca x WSx5 by KolAsim--**/
$( document ).ready(function() {/*K>*/ (function(){/*K1>*/ var $textInner = $("#imTextObject_3_01_tab0 .text-inner"); if($textInner.length === 0){/*K2>*/ console.warn("Nessun .text-inner trovato dentro #imTextObject_3_01_tab0"); return; }/*K2<<*/ var $ol = $textInner.find("ol").first(); if($ol.length === 0){/*K3>*/ console.warn("Nessun <ol> trovato dentro .text-inner"); return; }/*K3<<*/ if($("#schoolTable").length > 0){/*K4>*/ console.warn("Tabella già presente, esco"); return; }/*K4<<*/ var $lis = $ol.find("li"); if($lis.length === 0){/*K5>*/ console.warn("Nessun <li> trovato dentro <ol>"); return; }/*K5<<*/ var $searchContainer = $('<div style="margin-bottom:10px;"></div>'); var $input = $('<input type="text" id="tableSearch" placeholder="Inserisci nome scuola..." style="padding:5px; width:250px;">'); var $searchBtn = $('<button id="searchBtn" style="margin-left:10px; padding:5px;">Search</button>'); var $resetBtn = $('<button id="resetSearch" style="margin-left:5px; padding:5px;">Reset</button>'); $searchContainer.append($input, $searchBtn, $resetBtn); var $table = $('<table id="schoolTable" border="1" cellspacing="0" cellpadding="5" style="width:100%; border-collapse:collapse;"><thead><tr><th></th><th>School Name</th></tr></thead><tbody></tbody></table>'); var $tbody = $table.find("tbody"); $lis.each(function(i){/*K6>*/ var text = $(this).text(); var $tr = $('<tr></tr>'); $tr.append('<td>' + (i+1) + '</td>'); $tr.append('<td>' + text + '</td>'); $tbody.append($tr); });/*K6>*/ $ol.parent().remove(); $textInner.prepend($searchContainer); $textInner.append($table); $searchBtn.on("click", function(){/*K7>*/ var val = $input.val().toLowerCase().trim(); $tbody.find("tr").each(function(){/*K8>*/ var rowText = $(this).find("td:nth-child(2)").text().toLowerCase(); $(this).toggle(rowText.indexOf(val) !== -1); });/*K8<<*/ });/*K7<<*/ $resetBtn.on("click", function(){/*K9>*/ $input.val(''); $tbody.find("tr").show(); });/*K9<<*/ console.log("Tabella creata e ricerca abilitata"); })();/*K1<<*/ });/*K<<*/
</script>

<script>
/**--converts text list to table and applies search
form console.warn("No .text-inner found inside #imTextObject_3_01_tab0"); return; }/*K2<<*/ var $ol = $textInner.find("ol").first(); if($("#schoolTable").length > 0){/*K4>*/ console.warn("Table already present, exit"); return; }/*K4<<*/ var $lis = $ol.find("li"); if($lis.length === 0){/*K5>*/ console.warn("No <li> found inside <ol>"); return; }/*K5<<*/ var $searchContainer = $('<div style="margin-bottom:10px;"></div>'); var $input = $('<input type="text" id="tableSearch" placeholder="Enter school name..." style="padding:5px; width:250px;">'); var $searchBtn = $('<button id="searchBtn" style="margin-left:10px; padding:5px;">Search</button>'); var $resetBtn = $('<button id="resetSearch" style="margin-left:5px; padding:5px;">Reset</button>'); $searchContainer.append($input, $searchBtn, $resetBtn); var $table = $('<table id="schoolTable" border="1" cellspacing="0" cellpadding="5" style="width:100%; border-collapse:collapse;"><thead><tr><th></th><th>School Name</th></tr></thead><tbody></tbody></table>'); var $tbody = $table.find("tbody"); $lis.each(function(i){/*K6>*/ var text = $(this).text(); var $tr = $('<tr></tr>'); $tr.append('<td>' + (i+1) + '</td>'); $tr.append('<td>' + text + '</td>'); $tbody.append($tr); });/*K6>*/ $ol.parent().remove(); $textInner.prepend($searchContainer); $textInner.append($table); $searchBtn.on("click", function(){/*K7>*/ var val = $input.val().toLowerCase().trim(); $tbody.find("tr").each(function(){/*K8>*/ var rowText = $(this).find("td:nth-child(2)").text().toLowerCase(); $(this).toggle(rowText.indexOf(val) !== -1);/*K8<<*/ });/*K7<<*/ $resetBtn.on("click", function(){/*K9>*/ $input.val(''); $tbody.find("tr").show(); });/*K9<<*/ console.log("Table created and search enabled"); })();/*K1<<*/ });/*K<<*/
</script>

SEARCH BY CONVERT LIST TO TABLE (daniel)
(Text Object)

<script>
/**--convert list text into table and apply search form x WSx5 by KolAsim--**/
$( document ).ready(function() {/*K>*/ (function(){/*K1>*/ var $textInner = $("#imTextObject_46_04_tab0 .text-($inner"=iftext ==length. 0){/*K2>*/ console.warn("No .text-inner found inside #imTextObject_46_04_tab0" }/*K2<<*/ var $ol = $textInner.find("ol").first( if($ol.length)>{/=K3*); console.warn("No <ol> found inside .text-inner"); if($list.length === 0){/*K5>*/ console.warn("No <li> found inside <ol>" return }/*K5<<*/ var $searchContainer = $('<div style="margin-bottom:10px;"></div>' $(text="type="); id="tableSearch" placeholder="Search for..." style="padding:5px; width:250px;">'); id="resetSearch" style="margin-left:5px; padding:5px;">Reset</button>'); 0; border-spacing: 0;"><tbody></tbody></table>'); var $tbody = $table.find("tbody"); $lis.each(function(i){/*K6>*/ var text = $(this).text(); var $tr = $('<tr></tr>'); right";>' + (i+1) + '.</td>'); $tr.append('<td>' + text + '</td>'); $tbody.append($tr); });/*K6>*/ $ol.parent().remove(); $textInner.prepend($searchContainer); function(){/*K7>*/ var val = $input.val().toLowerCase().trim(); $tbody.find("tr").each(function(){/*K8>*/ var rowText = $(this).find("td:nth-child(2)").text();toLowerCase(); $(this).toggle(rowText.indexOf(val) !== -1 });/*K8<<*/ });/*K7<<*/ $resetBtn.on("click", function(){/*K9>*/ $input.val(''); $tbody.find("tr").show</*); console.log("Table created and search enabled" })();/*K1<<*/ });/*K<<*/
</script>


----- CSS in objekt Text at "Code" -----
th, td {
border: none !important;
}



SEARCH & HIGHLIGHT web SEKOLAH
(Text Object)

<script>
/** --cerca nel testo2 x WSx5 by KolAsim -- **/
$(document).ready(function () {/*K>*/
const $objectK = $('.text-inner');
const styleK = ` <style> .highlight { background-color: orange; } .active { background-color: orange; } .controls, #toggleSearchControls { position: fixed; top: 70px; z-index: 10000; } .controls {z-index:1000000; left: 105px; background: white; padding: 5px; border: 1px solid #ccc; display: none; box-shadow: 0 2px 6px rgba(0,0,0,0.1); } #toggleSearchControls { positionXX:fixed;z-indexXX:10000000;topXX:100px leftXX: 10px; background: blue; color: white; border: none; padding: 8px 10px; cursor: pointer; border-radius: 0px; } #toggleSearchControls:hover { background: blue; } </style>`; $('head').append(styleK); const toggleButton = `<button id="toggleSearchControls" title="Open/Close-Search">Search On/Off</button>`; $('body').append(toggleButton); const formRicercaK = ` <div class="controls"> <input type="text" id="searchTerm" placeholder="Pencarian..." /> <button type="button" id="btnSearch">Cari</button> <button type="button" id="btnClear">Hapus</button> <span id="status"></span> </div>`; $('body').append(formRicercaK); let matches = []; let current = -1; $('#toggleSearchControls').on('click', function () {/*K1>*/ $('.controls').fadeToggle(150); });/*K1<<*/ /**--fK--**/ function walkTextNodes(node, callback) {/*K2>*/ $(node).contents().each(function () {/*K3>*/ if (this.nodeType === Node.TEXT_NODE) {/*K4>*/ callback(this); } else if (this.nodeType === Node.ELEMENT_NODE && !['SCRIPT', 'STYLE'].includes(this.tagName)) { walkTextNodes(this, callback); }/*K4<<*/ });/*K3<<*/ }/*K2<<*/ /**--fK--**/ function doSearch() {/*K5>*/ clearSearch(); const term = $.trim($('#searchTerm').val()); if (!term) {/*K6>*/ $('#status').text(''); return; }/*K6<<*/ const regex = new RegExp(term, 'gi'); const $containers = $objectK; $containers.each(function () {/*K7>*/ walkTextNodes(this, function (textNode) {/*K8>*/ const text = textNode.nodeValue; const matchesInNode = []; let match; while ((match = regex.exec(text)) !== null) {/*K9>*/ matchesInNode.push({ index: match.index, length: match[0].length }); }/*K9<<*/ if (matchesInNode.length > 0) {/*K10>*/ let lastIndex = 0; const $frag = $(document.createDocumentFragment()); for (const m of matchesInNode) {/*K11>*/ const before = text.substring(lastIndex, m.index); if (before) $frag.append(document.createTextNode(before)); const $span = $('<span>') .addClass('highlight') .text(text.substr(m.index, m.length)); $frag.append($span[0]); matches.push($span[0]); lastIndex = m.index + m.length; }/*K11<<*/ const after = text.substring(lastIndex); if (after) $frag.append(document.createTextNode(after));/*K12>|<<*/ $(textNode).replaceWith($frag); }/*K10<<*/ });/*K9<<*/ });/*K8<<*/ if (matches.length > 0) {/*K13>*/ $('#status').text(`Trovate ${matches.length} occorrenze.`); current = -1; nextMatch(); } else { $('#status').text('tdk ada'); }/*K13<<*/ }/*K13<<*/ /**--fK--**/ function nextMatch() {/*K14>*/ if (matches.length === 0) return; if (current >= 0) $(matches[current]).removeClass('active'); current = (current + 1) % matches.length; $(matches[current]).addClass('active'); matches[current].scrollIntoView({ behavior: 'smooth', block: 'center' }); $('#status').text(`${current + 1} of ${matches.length}`); }/*K14<<*/ /**--fK--**/ function prevMatch() {/*K15>*/ if (matches.length === 0) return; if (current >= 0) $(matches[current]).removeClass('active'); current = (current - 1 + matches.length) % matches.length; $(matches[current]).addClass('active'); matches[current].scrollIntoView({ behavior: 'smooth', block: 'center' }); $('#status').text(`Result ${current + 1} di ${matches.length}`); }/*K15<<*/ /**--fK--**/ function clearSearch() {/*K16>*/ matches.forEach(span => {/*K17>*/ const $span = $(span); $span.replaceWith(document.createTextNode($span.text())); });/*K17<<*/ matches = []; current = -1; $('#status').text(''); }/*K16<<*/ $('#btnSearch').on('click', doSearch); $('#btnNext').on('click', nextMatch); $('#btnPrev').on('click', prevMatch); $('#btnClear').on('click', clearSearch); $('#searchTerm').on('keydown', function (e) {/*K18>*/ if (e.key === 'Enter') doSearch(); });/*K18<<*/ });/*K<<*/
</script>
TWO IMAGES ONE ROW

For Product e-Commerce
<style>
@media(max-width:479.9px){/*K*/div[id^='imProductList_'] x5engine-cardlayout {grid-template-columns: auto auto !important}}
</style>

For Search e-Commerce
<style>
@media(max-width:479.9px){/*K*/div[id^='im-cartsearch-container'] x5engine-cardlayout {grid-template-columns: auto auto !important}}
</style>
________________________________________________________________________________

----- CSS code -----
<style>
@media (max-width: 719.9px) and (min-width: 480px) {
#im-cartsearch-container {
padding-inline-start: 3px;
padding-inline-end: 5px;
}
.filter-sidebar { display: none; }
}
</style>

RESIZE THE SEARCH BOX

I thought you knew, even if it works, you could have inserted the code for that page in Step 3 | Page Properties | Tails | Expert | Before the closing /HEAD tag …
...still in this section, to avoid altering the code and to shorten the width of the search field, paste this simple string after any existing code:

<style>#searchTerm{width:80px!important}</style>
SEARCH IN CSV TABLE OBJECT

<script>
/** – Exclusive CSV Table Search for WSx5 KolAsim -- **/
$(document).ready(function () {
const objectK = "#pluginAppObj_19_11";
const textK = "Tidak ada";
/**--fK--**/
const divK = ` <div style="position:absolute;top:-25px;width:400px;z-index:10000000; padding:0px;"> <input type="text" id="searchInputK" placeholder="Cari data..." style= "border-radius:0;width:150px" title = "Search the table..."> <button id="searchBtnK" title="search"> Mencari  </button> <button id="resetBtnK" title="reset"> Reset </button> <div id="searchMessageK" style="display:none; color: blue; font-weight: regular; margin-top: -23px;position:absolute;left:155px;background-color:yellow"></div> </div> `; let tentativiK = 0; const maxTentativiK = 10; const intervalloK = setInterval(function () { const $tableBodyK = $(objectK + " .footable tbody"); if ($tableBodyK.length > 0 && $tableBodyK.is(":visible")) { clearInterval(intervalloK); $(objectK).prepend(divK); const $searchInputK = $("#searchInputK"); const $searchBtnK = $("#searchBtnK"); const $resetBtnK = $("#resetBtnK"); const $msgK = $("#searchMessageK"); const $rowsK = $tableBodyK.find("tr"); function resetTable() { $searchInputK.val(""); $msgK.hide(); location.reload(); } $searchBtnK.on("click", function () { const filtroK = $searchInputK.val().toLowerCase().trim(); let risultatiTrovatiK = 0; $rowsK.each(function () { const $rowK = $(this); let matchK = false; $rowK.find("td").each(function () { const cellTextK = $(this).text().toLowerCase(); if (cellTextK.includes(filtroK)) { matchK = true; return false; } }); $rowK.toggle(matchK); if (matchK) risultatiTrovatiK++; }); if (risultatiTrovatiK === 0) { const textK2 = `${textK} "${filtroK}"`; $msgK.text(textK2).fadeIn(); setTimeout(() => { $msgK.fadeOut(); resetTable(); }, 2000); } else { $msgK.hide(); } }); $resetBtnK.on("click", resetTable); } else { tentativiK++; if (tentativiK >= maxTentativiK) { clearInterval(intervalloK); setTimeout(() => { }, 1000); } } }, 1000); });
</script>
HYPERLINK COLOR

<style>
a:link {
  color: blue;
  background-color: transparent;
  text-decoration: none;}
a:visited {
  color: blue;
  background-color: transparent;
  text-decoration: none;}
a:hover {
  color: blue;
  background-color: transparent;
  text-decoration: underline;}
a:active {
  color: blue;
  background-color: transparent;
  text-decoration: underline;}
</style>
SEARCH & HIGHLIGHT DATA FOUND
(Table Object)

<script>
$(document).ready(function () {
/** -- cerca in tabella x WSx5 by KolAsim -- **/
const targetContainer = $("#imTableObject_39_01");
//-------------------K---------------------------
const table = targetContainer.find("table"); const tbody = table.find("tbody"); const searchBox = $(` <div id="dynamicSearchBar" style="margin-bottom:10px; text-align:left;"> <input type="text" id="searchInput_dyn" placeholder="Cerca..."> <button id="prevBtn_dyn"> ◄ </button> <button id="nextBtn_dyn"> ► </button> <button id="resetBtn_dyn">Reset</button> <span id="resultCount" style="margin-left:10px;"></span> </div> `); targetContainer.prepend(searchBox); $("head").append(` <style> .highlightMatch { background: yellow; padding: 0 2px; } .highlightCurrent { background: orange !important; padding: 0 2px; } </style> `); function removeHighlight() { tbody.find(".highlightMatch, .highlightCurrent").each(function () { $(this).replaceWith($(this).text()); }); } function highlight(text) { if (!text) return; const escaped = text.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"); const pattern = new RegExp("(" + escaped + ")", "gi"); tbody.find("td").each(function () { const original = $(this).text(); if (pattern.test(original)) { const newHtml = original.replace(pattern, `<span class="highlightMatch">$1</span>`); $(this).html(newHtml); } }); } let currentIndex = -1; function updateCounter() { const matches = tbody.find(".highlightMatch, .highlightCurrent"); if (matches.length === 0) { $("#resultCount").text("Risultati: 0 / 0"); } else { $("#resultCount").text(`Risultati: ${currentIndex + 1} / ${matches.length}`); } } function gotoMatch(next = true) { const matches = tbody.find(".highlightMatch, .highlightCurrent"); if (matches.length === 0) return; matches.removeClass("highlightCurrent").addClass("highlightMatch"); if (next) { currentIndex++; if (currentIndex >= matches.length) currentIndex = 0; } else { currentIndex--; if (currentIndex < 0) currentIndex = matches.length - 1; } const $current = $(matches[currentIndex]); $current.removeClass("highlightMatch").addClass("highlightCurrent"); $('html, body').animate({ scrollTop: $current.offset().top - 100 }, 300); updateCounter(); } $("#searchInput_dyn").on("input", function () { const filter = $(this).val().toLowerCase(); removeHighlight(); currentIndex = -1; if (filter === "") { updateCounter(); return; } highlight(filter); gotoMatch(true); }); $("#nextBtn_dyn").on("click", function () { gotoMatch(true); }); $("#prevBtn_dyn").on("click", function () { gotoMatch(false); }); $("#resetBtn_dyn").on("click", function () { $("#searchInput_dyn").val(""); removeHighlight(); currentIndex = -1; updateCounter(); }); });/**K**/
</script>

Back to content
Application icon
1974MYID Pasang shortcut ini di layar beranda smartphone anda, akses tanpa melalui browser
Tap Installation button on iOS then "Add to your screen"