(Created page with "<div class="companies__search"> <div> <label for="companies__name">Name</label> <input type="text" id="companies__name" placeholder="Name..."> </div> <script> // Get the input and dropdown content elements var input = document.getElementById("search--input"); function updateTemplate() { var parameters = ''; let name = document.getElementById("location__name").value; if ( name !== '' ) parameters += '|name=' + name var contentContainer = document....") |
mNo edit summary |
||
Line 1: | Line 1: | ||
<div class="companies__search"> | <div class="companies__search"> | ||
<div> | <div> | ||
<input type="text" id="companies__name" placeholder="Name..."> | <input type="text" id="companies__name" placeholder="Name..."> | ||
</div> | </div> | ||
Line 11: | Line 10: | ||
function updateTemplate() { | function updateTemplate() { | ||
var parameters = ''; | var parameters = ''; | ||
let name = document.getElementById(" | let name = document.getElementById("companies__name").value; | ||
if ( name !== '' ) parameters += '|name=' + name | if ( name !== '' ) parameters += '|name=' + name | ||
Revision as of 16:53, 26 March 2024
<input type="text" id="companies__name" placeholder="Name...">
<script>
// Get the input and dropdown content elements var input = document.getElementById("search--input");
function updateTemplate() {
var parameters = ; let name = document.getElementById("companies__name").value; if ( name !== ) parameters += '|name=' + name
var contentContainer = document.getElementById("companies--list"); // Use the selected template as a parameter in the parser function var parserFunction = "Template:Companies/Search" + parameters + "";
// Replace the content in the dynamic content container with the parsed template $.get(mw.util.wikiScript('api'), { action: 'parse', format: 'json', text: parserFunction }, function(data) { var parsedContent = data.parse.text['*']; var content = document.createElement('div') content.innerHTML = parsedContent
if ( content.querySelector('.mw-parser-output #companies-search-container') ) { contentContainer.innerHTML = content.querySelector('#companies-search-container').outerHTML; } else { contentContainer.innerHTML = 'No locations found' }
}); }
// Name input to run 500ms after last input let timeoutId; document.getElementById('location__name').addEventListener('input', function() { // Clear previous timeout (if any) clearTimeout(timeoutId);
// Set a new timeout for 500ms timeoutId = setTimeout(updateTemplate, 500); });
</script>