No edit summary
Tag: 2017 source edit
No edit summary
Tag: 2017 source edit
(4 intermediate revisions by the same user not shown)
Line 81: Line 81:
         <!-- New search input field for suggestions -->
         <!-- New search input field for suggestions -->
         <input
         <input
             id="customsearch-input"
             id="customsearchs-input"
             class="search-input"
             class="search-inputs"
             type="text"
             type="text"
             placeholder="Search MDriven Learn"
             placeholder="Search MDriven Learn"
Line 89: Line 89:
             autocomplete="off"
             autocomplete="off"
         >
         >
         <div id="suggestion-container" style="
         <div id="suggestion-container"></div>
            position: absolute;
            top: 100%;
            left: 0;
            width: 100%;
            background: #fff;
            border: 1px solid #ccc;
            border-radius: 4px;
            box-shadow: 0 2px 6px rgba(0,0,0,0.15);
            display: none;
            z-index: 9999;
        ">
            <ul id="suggestion-list" style="list-style: none; margin: 0; padding: 0;"></ul>
        </div>
     </form>
     </form>
</div>
</div>
Line 136: Line 123:
{{#widget:Card|heading=Best Practices|display=block|imageIcon=/images/main4.svg|subheading=Explore effective solutions|text=Our suggestions on how you can maximize the benefits of the MDriven tools to realize business solutions.|link=/index.php/BestPractices:Best_Practices|linktext=Try these Best Practices}}
{{#widget:Card|heading=Best Practices|display=block|imageIcon=/images/main4.svg|subheading=Explore effective solutions|text=Our suggestions on how you can maximize the benefits of the MDriven tools to realize business solutions.|link=/index.php/BestPractices:Best_Practices|linktext=Try these Best Practices}}
<html>
<html>
<script>
  (function () {
    var input = document.getElementById('customsearch-input');
    var suggestionsBox = document.getElementById('suggestion-container');
    var suggestionList = document.getElementById('suggestion-list');
    var lastFetchController = null;
    // Hide suggestions
    function hideSuggestions() {
      suggestionsBox.style.display = 'none';
    }
    // Show suggestions
    function showSuggestions() {
      suggestionsBox.style.display = 'block';
    }
    // Populate suggestions in the dropdown
    function updateSuggestions(suggestions) {
      suggestionList.innerHTML = '';
      if (!suggestions.length) {
        hideSuggestions();
        return;
      }
      for (var i = 0; i < suggestions.length; i++) {
        var sugg = suggestions[i];
        var li = document.createElement('li');
        li.textContent = sugg;
        li.style.padding = '8px 12px';
        li.style.cursor = 'pointer';
        li.addEventListener('click', function () {
          input.value = this.textContent;
          hideSuggestions();
        });
        suggestionList.appendChild(li);
      }
      showSuggestions();
    }
    // Fetch suggestions using XMLHttpRequest
    function fetchSuggestions(query) {
      var xhr = new XMLHttpRequest();
      var url = 'https://search-api.mdriven.net/wiki_suggestions?q=' + encodeURIComponent(query);
      xhr.open('GET', url, true);
      xhr.onreadystatechange = function () {
        if (xhr.readyState === 4 && xhr.status === 200) {
          try {
            var data = JSON.parse(xhr.responseText);
            updateSuggestions(data);
          } catch (err) {
            console.error('Error parsing suggestions:', err);
          }
        }
      };
      xhr.onerror = function () {
        console.error('Error fetching suggestions');
      };
      xhr.send();
    }
    // Listen for user input
    input.addEventListener('input', function () {
      var query = this.value.trim();
      if (!query) {
        hideSuggestions();
        return;
      }
      // Cancel previous fetch if the user types quickly
      if (lastFetchController) {
        lastFetchController.abort();
      }
      // Create a new AbortController (Polyfill for ES5 compatibility)
      lastFetchController = new AbortControllerPolyfill();
      // Fetch suggestions using XMLHttpRequest
      fetchSuggestions(query);
    });
    // Hide suggestions on clicking outside
    document.addEventListener('click', function (e) {
      if (!suggestionsBox.contains(e.target) && e.target !== input) {
        hideSuggestions();
      }
    });
    // Polyfill for AbortController for older browsers
    function AbortControllerPolyfill() {
      this.signal = {};
      this.abort = function () {
        // Aborting is not fully supported in ES5, but this is a placeholder to mimic behavior
      };
    }
  })();
</script>


</div>
</div>

Revision as of 13:29, 31 March 2025

MDriven Learn
Learn. Model. Build.
Visualize and design your ideas. Discover more with MDriven documentation, hands-on training, and ready-made models to get the most from MDriven's tools and services.
Image
Icon
Documentation
Find technical documentation
Gain understanding through in-depth explanations of the concepts behind the MDriven tools.
Icon
Training
Learn by doing
Practical training and tutorials on MDriven designed to educate and inspire you to model your ideas.
Icon
Q&A
Ask questions and get help
Write to us your MDriven-related questions and receive quality answers and feedback.
Icon
Model Examples
Try model samples
Use our unique, pre-built models to build your ideas and achieve your goals.
Icon
Best Practices
Explore effective solutions
Our suggestions on how you can maximize the benefits of the MDriven tools to realize business solutions.


MDriven Chat

How would you like to chat today?

Setting up your conversation…

This may take a few moments