Как добавить отправленные данные из моей базы данных в форму текстовой области в html

#javascript #php #html #jquery #mysql

#javascript #php #HTML #jquery #mysql

Вопрос:

У меня есть страница профиля, и один из разделов — это созданный мной раздел «Обо мне». Я решил создать таблицу внутри моей таблицы данных под названием «Предложения», где у меня есть списки предложений, которые пользователь использует для своего раздела «Обо мне»..Мне удалось отобразить данные из моей таблицы и текстовой области в моей форме рядом, но я хочу создать функцию, в которой, как только я нажму на конкретное предложение, оно будет перенесено непосредственно в мое поле текстовой области для пользователя

* Редактировать С текущим кодом, только первое предложение при нажатии отправляется в текстовую область, двойной щелчок по первому предложению снова ничего не делает. Результатом должно было стать то, что любое из предложений при нажатии будет отправлено в текстовую область.

 <head lang="en">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title><?php if(isset($page_title)) echo $page_title; ?></title>
    
    <!--Bootstrap--->
     <link href="../img/faviconn.png" rel="icon">
    <link href="css/bootstrap.min.css" rel="stylesheet">
    
   <link href="css/custom.css" rel="stylesheet">
   
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
    <script src="js/sweetalert.min.js"></script>
    <link rel="stylesheet" type="text/css" href="css/sweetalert.css">
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
  
    <link href="css/intlTelInput.css" rel="stylesheet" type="text/css">
    <script src="js/bootstrap-tagsinput.js"></script>
<link rel="stylesheet" href="css/bootstrap-tagsinput.css">
</head>


<table width="891" height="80" align="center" class="table table-condensed">
    <tr>
        <td width="50%" height="74">
            <div class="form-group" style="overflow-y:scroll; width: 100%;height: 400px;">
                <div class="form-group" align="center">
                    <h4 style="background-color:darkseagreen;color: whitesmoke;width: 190px;">Suggestions</h4>
                </div><br><br>
                <div class="row">
                    <table class="table">
                        

<tr>
                <?php
 
require_once('config/connect.php');

$sql = "SELECT * FROM aboutsug";
$res = mysqli_query($connection, $sql);


?></tr>
            <?php 
                while ($r = mysqli_fetch_assoc($res)) {
            ?>
            <tr>
                <td><?php echo $r['id']; ?></td>
                    <td style="padding:25px;" onclick="fillTextArea('<?php echo $r['suggest']; ?>')"><?php echo $r['suggest']; ?></td>
                
            </tr>
            <?php } ?>
        </table>
                </div>
            </div>
        </td>
        <td width="5%">amp;nbsp;</td>
        <td width="45%"> 
            <div class="form-group" style="height: 400px;">
                <div class="form-group" align="center">
                    <h4 style="background-color:darkseagreen;color: whitesmoke;width: 190px;">About Me</h4>
                </div>
                <textarea name="about" class="form-control" id="about" spellcheck="true" style="height: 400px;"></textarea>
            </div> 
        </td>
    </tr>
</table>
<script type="text/javascript">
     function fillTextArea(data){
         document.getElementById('about').value=data;
     }
 </script>
  

введите описание изображения здесь

Оригинал до внесения изменений

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

1. покажите нам часть вашего кода, и мы постараемся вам помочь. что вы пробовали? и что пошло не так? по крайней мере, покажите фрагмент кода вашей страницы.

2. Очень сожалею, я неправильно отформатировал страницу

3. Привет, Абрахам. Просто дружеское предложение. И я тоже постоянно допускаю эту ошибку 🙂 Что касается комментариев типа «Я пытался использовать data-list для моей текстовой области, но не сработало». Вам следует подумать, действительно ли эта информация полезна для людей, помогающих с проблемой. Если это полезно, включите дополнительную информацию, объясняющую, почему это актуально. В противном случае просто опустите это. И хорошего дня 🙂

4. @ Martin Nielsen Спасибо

5. @Martin Nielsen, есть какое-нибудь решение моей проблемы?

Ответ №1:

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

  1. в вашем <td> теге, который содержит $r['suggest'] установленный атрибут onclick="fillTextArea('<?php echo $r['suggest']; ?>')"

измените <td style="padding:25px;"><?php echo $r['suggest']; ?></td> на <td style="padding:25px;" onclick="fillTextArea('<?php echo $r['suggest']; ?>')"><?php echo $r['suggest']; ?></td>

  1. перейдите в нижнюю часть вашего документа и добавьте следующий код javascript

      <script type="text/javascript">
         function fillTextArea(data){
             document.getElementById('about').value=data;
         }
     </script>
      

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

1. Пробовал, но на этот раз не сработало .. раздел не смог отобразить данные из таблицы.. Редактирую свой исходный пост и загружаю изображение проблемы

2. вы хотите, чтобы $r['suggest'] содержимое было в текстовой области правильно?

3. какая первая пустая фотография с новым кодом?

4. Да, первая фотография была пустой после нового кода, и да, я хочу, чтобы $ r [‘предложить’] в текстовой области

5. Пожалуйста, есть ли способ это исправить?