Live Search не передает переменные

Я работаю над поиском в реальном времени, который отображает миниатюры изображений. Это прекрасно работает. Проблема в том, что когда я нажимаю на миниатюру, данные из полей ввода формы не отправляются на страницу movie.php. Страница movie.php нуждается в них для загрузки соответствующего контента. Если кто-то может помочь, это будет оценено!

Страница поиска

<script src = "https://code.jquery.com/jquery-3.5.1.min.js"></script>

<script>
$(document).ready(function(){
    $('.search-box input[type = "text"]').on("keyup input", function(){
        /* Get input value on change */
        var inputVal = $(this).val();
        var resultDropdown = $(this).siblings(".result");
        if (inputVal.length){
            $.get("search_backend.php", {term: inputVal}).done(function(data){
                // Display the returned data in browser
                resultDropdown.html(data);
            });
        } else{
            resultDropdown.empty();
        }
    });
    
    // Set search input value on click of result item
    $(document).on("click", ".result", function(){
        $(this).parents(".search-box").find('input[type = "text"]').val($(this).text());
        $(this).parent(".result").empty();
    });
});
</script>
</head>

<body>
    <div class = "search-box">
        <input type = "text" autocomplete = "off" placeholder = "Search for a movie" />
        <div class = "result"></div>
    </div>

Бэкенд поиска

<?php include "../includes/db_connector.php";
 
if (isset($_REQUEST["term"])){
    
    $search_keyword = $_REQUEST["term"];
    // Prepare a select statement
    $sql = "SELECT title, img FROM jeffbox WHERE title LIKE '%" . $search_keyword . "%'";
    
    if ($stmt = mysqli_prepare($db_connect, $sql)){
        // Bind variables to the prepared statement as parameters
        mysqli_stmt_bind_param($stmt, "s", $param_term);
        
        // Set parameters
        $param_term = $search_keyword . '%';
        
        // Attempt to execute the prepared statement
        if (mysqli_stmt_execute($stmt)){
            $result = mysqli_stmt_get_result($stmt);
            
            // Check number of rows in the result set
            if (mysqli_num_rows($result) > 0){
                // Fetch result rows as an associative array
                while($row = mysqli_fetch_array($result, MYSQLI_ASSOC)){
                    $img = $row["img"];
                    $title = $row["title"];
                    ?>

<form id = "form-search" method = "post" action = "movie.php">
    <input id = "btn_top" style = "display: none;" type = "text" name = "title" id = "title" value = "<?php echo $title ?>" />
    <input id = "btn_top" style = "display: none;" type = "text" name = "latest" id = "latest" value = "<?php echo $title ?>" />
    <input id = "new_releases" type = "image" name = "image" src = "images/<?php echo $img ?>">
</form>

<?php
} } else { echo "<p>No movies found</p>"; }
  }
 }
     
// Close statement
mysqli_stmt_close($stmt);
}
 
// close connection
mysqli_close($db_connect);
?>

Я пробовал несколько поисков, но безрезультатно...

it's not sending the data from the form input fields to the movie.php page... так что же происходит вместо этого?

— 29.03.2023 19:44

Поля ввода формы очищаются, как только я нажимаю миниатюру.

— 29.03.2023 19:48

Невозможно воспроизвести такое поведение на основе предоставленного вами примера кода — демо: jsfiddle.net/7n2dgbcy

— 29.03.2023 22:12

javascript php html forms search

29.03.2023 19:34

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Обычно вы будете использовать кнопку отправки, чтобы инициировать отправку формы, что-то вроде

<input type=submit value = "Submit">

Однако, если вы хотите, чтобы изображение запускало отправку формы, одним из способов является использование следующего javascript:

<script>

function submitForm(originator)
{
    var pN=originator.parentNode;
    while (true)
    {
        if (pN&&pN.nodeName=='FORM')
        {
            pN.submit();
            break;
        }
        pN=pN.parentNode;
    }
}

</script>

Затем измените строку:

 <input id = "new_releases" type = "image" name = "image" src = "images/<?php echo $img ?>">

<img id = "new_releases"  src = "images/<?php echo $img ?>" onclick = "javascript:submitForm(this);">

С другой стороны, вы упомянули, что когда вы щелкаете по изображению, все поля данных в форме «очищаются», это произойдет только в том случае, если вы где-то в своем скрипте очищаете данные формы, пожалуйста, исправьте это, иначе целевая форма не может получить данные из отправленной формы.

29.03.2023 20:49

Другие вопросы по теме

Показать текст, если товар существует в корзине

Преобразование плоского ассоциативного массива в индексированный двумерный массив с ассоциативными строками

Пользовательская таксономия Pagination не работает

Держите подразделение активным после отправки формы с помощью localStorage

Преобразовать несколько входных значений в массив json на Php?

Преобразование объекта SplFileInfo в массив Проблемы

Пользовательское форматирование исключения PHP с собранными данными

Laravel тестирует другой код в одной базе данных

Изображение не отображается в таблице данных и показывает 404, не найденное при открытии

Как загрузить данные в несколько таблиц SQL

Live Search не передает переменные

Ответы 1

Другие вопросы по теме

Похожие вопросы