Страница самостоятельной обработки с использованием PHP, HTML и MySQL

#html #forms

#HTML #формы

Вопрос:

Привет, итак, я пытаюсь создать панель поиска, которая запрашивает базу данных в MySQL, используя номер продукта, и когда товар найден, его соответствующие числовые значения под заголовками («Стоимость товара», «Налоги» и т.д.) помещаются в поля формы, Которые будут использоваться в качестве входных данных для моего графика HighCharts. Это было длинное предложение, извините, надеюсь, мой JSFiddle объяснит, что я имею в виду!

У меня есть небольшой опыт работы с Python, и на моем курсе в колледже меня учили, как создать страницу с самостоятельной обработкой, используя его, но я не смог заставить его работать, и поскольку единственные результаты онлайн для такого рода вещей были для PHP, я сказал, что попробую вместо этого!

Изначально я использовал PHP для выполнения поиска по базе данных, но при нажатии на поиск он переходил на 2-ю страницу, поэтому я бы предпочел, чтобы это было сделано на той же странице

JSFiddle

Побочный вопрос: Как бы я установил кнопку сброса, чтобы сбросить значения в 0 в полях? (Ничего страшного, если это слишком много, я бы сказал, я могу разобраться сам)

Заранее спасибо!

Он просит меня включить код с отступом, поскольку у меня есть ссылка JSFiddle, поэтому здесь:

 <!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>Pricer.ie</title>
        <link rel="stylesheet" href="homepage.css"/>
        <link href="https://fonts.googleapis.com/css2?family=B612amp;display=swap" rel="stylesheet">
        <script src="https://code.highcharts.com/highcharts.js"></script>
        <script src="/js/themes/gray.js"></script>
        <script src="highcharts.js"></script>
        <meta name="viewport" content="initial-scale=1.0, width=device-width"/>
    </head>
    <body>
        <nav class="navbar">
            <ul>
                <li class="logo">
                    <a href=""><img src="logopricerv2.png" alt="logo" id="logo" ></a>
                </li>
                <li>
                    <a href="login.py" class="logintopright" >Login</a>
                </li>
                <li>
                    <a href="logout.py" class="logouttopright" >Logout</a>
                </li>
                <li>
                    <button class="darkmodebutton" onclick="darkFunction()">Toggle dark mode</button>
                </li>
            </ul>
        </nav>
        <main>
            <figure class="highcharts-figure">
                <div id="container" style="width:100%; height:400px;"></div>
                <script>
                    
                </script>
            </figure>
            <section>
                <form action="search.php" method="POST" id="search_form" autocomplete="off">
                    <label for="query">SKU :  </label>
                    <input type="text" id="query" name="query"><br><br>
                    <input type="submit" id="search_box" value="Search">
                </form>
            </section>
            <section>
                <form id="mainForm" autocomplete="off">
                    <label>Item Cost:</label>
                    <input type="number" id="icost" name="icost" step="0.01"/><br><br>
                    <label>Shipping Cost:</label>
                    <input type="number" id="scost" name="scost" step="0.01"/><br><br>     <!-- names and ids are incorrect just like this for now -->
                    <label>Taxes:</label>
                    <input type="number" id="taxes" name="taxes" step="0.01"/><br><br>     <!-- shouldnt exist as taxes is from database but sure look-->
                    <label>Listing Fee:</label>
                    <input type="number" id="listfee" name="listfee" step="0.01"/><br><br>
                    <label>Profit Margin:</label>
                    <input type="number" id="pmargin" name="pmargin" step="0.01"/><br><br>
                    <input type="submit" value="Reset">
                    <input type="submit" value="Save Changes">
                </form>
            </section>
        </main>
        <footer>
        </footer>
    </body>
</html>  

Легче понять в JSFiddle

Комментарии:

1. «при нажатии на поиск он переходит на 2-ю страницу, поэтому я бы предпочел, чтобы это было сделано на той же странице» — это именно то, что делает action атрибут в <form> элементе. У вас уже есть форма, <form> для которой не action указано, поэтому она отправляется на текущую страницу. Что мешает вам сделать то же самое в вашей форме поиска?

2. @David извините, я не совсем уверен, что вы имеете в виду

3. Где php и mysql? Вы помечены как таковые.

4. Вы могли бы удалить php и mysql и заменить их на «html», видя, что это все, что здесь есть, и, возможно, «javascript». Однако, если приведенные ответы не решают вопрос, то в конечном итоге это может быть проблема на стороне сервера, если в любой области будут ошибки. Трудно сказать, Дэн, но я не любитель «JS» вещей.

5. @FunkFortyNiner в любом случае спасибо за совет! Я здесь довольно новичок и все еще пытаюсь убедиться, что добавляю нужное количество информации и тегов, сейчас я отредактирую свой вопрос