Home » Php » php – Load data with controller inside javascript

php – Load data with controller inside javascript

Posted by: admin February 25, 2020 Leave a comment

Questions:

In symfony 4.4 application with Webpack Encore, I have an input field in a twig template. This template load a javascript asset which need to call a function which fetch data matching with the current value of the input field.

Input inside my template templates/mypage.html.twig

<input class="form-control" type="search" placeholder="Search" aria-label="Search" id="searchInput">

My javascript file assets/js/search.js

const searchInput = document.getElementById('searchInput');

searchInput.addEventListener('input', function () {
    //here I need a function to fetch data matching with searchInput.value
}

I have here a method inside my controller which return the search result for a given value src/SearchController.php

public function search($value) {
    $searchResult = $this->myRepository->findAllMatching($value);
    // here I need to return the result of search
}

How can I run the search whenever the value of the input changes ?

How to&Answers: