PHP - Как я могу генерировать новые текстовые поля на основе значения поля выбора опции? - PullRequest
0 голосов
/ 01 ноября 2011

Как мне сделать выпадающий список, что при выборе значения будет создано столько же текстовых полей в той же форме.

У меня есть поле выбора опции, которое спрашивает "сколько категорий вынужно? 1-6 "Если пользователь выберет 3, он в той же форме создаст 3 новых текстовых поля с просьбой ввести имя каждой категории.Если это 6 категорий, то он сгенерирует 6 текстовых полей.

После нажатия кнопки отправки данные отправляются на страницу вставки и база данных обновляется.Моя проблема заключается в создании новых текстовых полей на основе значения параметра выбора.

<select name="num_cat" onchange="document.textbox.value=this.value">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
</select>

<input type="text" name="textbox" id="textbox">

<?php
If $_POST[num_cat] == 1{
echo ;
}else 
?>

, и именно здесь я теряюсь.В базе данных у меня есть поля для категорий 1, 2 и т. Д., И эти поля будут заполнены значениями сгенерированных текстовых полей.

Если у кого-либо есть предложения или примеры, я был бы очень признателен.Спасибо.

~ G ~

Ответы [ 4 ]

2 голосов
/ 01 ноября 2011

Кажется, вам действительно нужно использовать цикл для вывода количества полей, которые вам нужны.

Например:

У вас будет форма, в которой пользователю будет задано количество полей, которые ему нужны

form.php

<form action="category_form.php" method="get">
    Number of fields required:  
    <select id="num_cat" name="num_cat">
        <option value="0">0</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
        <option value="6">6</option>
    </select>
    <input type="submit" name="submit" value="Submit"/>
</form>

category_form.php

if(isset($_GET['submit']) && isset($_GET['num_cat'])){

    $num_of_fields = $_GET['num_cat']; //WARNING: Requires validation/sanitisation

    echo '<form method="post" action="action.php">';
    for($i=1; $i<=$num_of_fields; $i++){
        echo '<input type="text" name="category-'.$i.'" />';
    }
    echo '<input type="submit" name="submit" value="Submit"/>';
    echo '</form>';
}

ОДНАКО, это было бы намного проще, если бы вы использовали JQuery для динамического обновления количества полей, поскольку это избавило бы от необходимости обновлять страницу. Вы можете сделать это, используя код ниже.

index.html

<html>
<head>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" ></script>
    <script type="text/javascript">
        //when the webpage has loaded do this
        $(document).ready(function() {  
            //if the value within the dropdown box has changed then run this code            
            $('#num_cat').change(function(){
                //get the number of fields required from the dropdown box
                var num = $('#num_cat').val();                  

                var i = 0; //integer variable for 'for' loop
                var html = ''; //string variable for html code for fields 
                //loop through to add the number of fields specified
                for (i=1;i<=num;i++) {
                    //concatinate number of fields to a variable
                    html += 'Category ' + i + ': <input type="text" name="category-' + i + '"/><br/>'; 
                }

                //insert this html code into the div with id catList
                $('#catList').html(html);
            });
        }); 
    </script>
</head>
<body>
    <form method="post" action="action.php">
        Number of fields required:      
        <select id="num_cat" name="num_cat">
            <option value="0">- SELECT -</option>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option>
        </select>

        <div id="catList"></div>
        <input type="submit" name="submit" value="Submit"/>
    </form>
</body>
</html>

Это будет обновлять на лету вместо того, чтобы каждый раз перезагружать страницу PHP для генерации полей.

Очевидно, вам нужно будет добавить код CSS, но я не делаю этого для вас;).

P.S. Вместо использования .keyup вы можете использовать .change вместо ...

1 голос
/ 01 ноября 2011

Попробуйте что-то вроде этого:

<?php
if(isset($_POST[num_cat])) {
    $cats = intval($_POST[num_cat]);

    for(i=1;i>=$cats;i++) {
        echo '<input type="text" name="cat-'.i.'" />';
    }
?>

Это будет принимать значение поля выбора и отображать текстовое поле для x количества категорий. Вы можете заключить это в форму, а затем сможете отправить ее и записать данные в свою базу данных.

1 голос
/ 01 ноября 2011

Изучите использование jQuery для внедрения кода, сгенерированного в цикле, обратно в вашу форму.

0 голосов
/ 01 ноября 2011

Похоже, вам нужно подумать о своей схеме, чтобы убедиться, что она масштабируема для ваших целей.

Один из способов сделать это - вот так (вроде как у вас сейчас):

Таблица: сообщения id messagetext категория1 категория2 категория3 категория 4

Это удобнее, когда у вас есть огромные наборы данных, поскольку это устраняет необходимость выполнения нескольких объединений. Проблема в том, что происходит, когда вы хотите иметь пятую категорию?

Другой вариант будет таким:

Таблица: сообщения текст сообщения id

Таблица: категории идентификатор категории

Таблица: messages_categories идентификатор сообщения идентификатор категории ID

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

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

<select name="num_cat" onchange="addField(this.value)">...

function addField(num) {
  for (i=0; i<num; i++) {
    var newinput = document.createElement('text');
    /* If you use bracket notation like this (only on the name parameter), it will treat it like an array*/
    newinput.name = 'Cat[]';
  }
}

<?php

//This will now be an array you can loop over
$_POST['Cat']; 

?>
...