Добавление значений (пользователем) в выпадающий список, заполненный из базы данных

0

Я пытаюсь создать раскрывающийся список "editable". У меня есть раскрывающийся список, заполненный таблицей "город" в моем db, он отлично работает, но теперь я хочу, чтобы пользователь мог добавить новое значение в список, если он там не существует (и я хочу сохранить это значение, поэтому в следующий раз он появится в выпадающем списке). Есть идеи? спасибо

        <select name="city"> 
    <?php 
    // connecting to DB
    $con=  mysqli_connect('localhost','root','1234','e-sage');
    // enable hebrew input
    mysqli_set_charset($con,'utf8');
    // read the city table from DB
    $sql = mysqli_query($con,"SELECT CityName FROM city");
    while ($row = mysqli_fetch_array($sql)){
    // creating temporary variable for each row
    $city1=$row["CityName"];
    //assigning a value to each option in dropdown list
    echo "<option value=\"$city1\"> $city1 </option>";
    }
    ?>
    </select>
Теги:
database
drop-down-menu

3 ответа

0
Лучший ответ

Затем попробуйте следующее: согласен, что вы уже получили все города в массиве ОК?

<select name="city">
<?PHP
foreach($cities as $city)
{
echo '<option value="'.$city.'">'.$city.'</option>';
}
?>
</select>

<form method="post">
<label for="new_city">New city</label>
<input id="new_city" name="new_city" placeholder="Enter new city name" />
<input type="button" id="addCity" value="Insert city" />
</form>



  <script>
        $(document).on('click','#addCity',function()
                       {

                          var new_city=$("#new_city").val();
                          var e=0;
                           $("[name='city'] option").each(function(i,item)
                                                          {
                                                              var check_city=$(item).val();

                                                              if(check_city==new_city)
                                                              {
                                                                 e++;
                                                              }
                                                              else
                                                              {

                                                              }

                                                          });
                           if(e>0)
                           {
                               alert('The same');
                           }
                           else
                           {
                               /*Submit the form*/
alert('This city is fresh and new');

                           }


                       });
    </script>

Таким образом, скрипт проверяет, присвоено ли значение параметру. Если нет - позволяет отправить форму.

Проверьте это: http://jsfiddle.net/n47N2/1/

  • 0
    Большое спасибо, это решает проблему! Но мне все еще интересно, смогу ли я сделать это в том же текстовом поле, не имея дополнительного для вставки новой опции?
  • 0
    Ну что ж ... решение было бы добавить «Добавить новый» в качестве опции к этому полю выбора, а затем после того, как было выполнено его нажатие - запрос JavaScript, данные, сохраненные AJAX в БД, и затем перезагрузить список выбора;)
Показать ещё 1 комментарий
1

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

  • 0
    Это был один из моих вариантов, но потом я решил попробовать сделать это, не открывая новое текстовое поле ... Спасибо.
  • 0
    Так как ты хочешь это сделать?
0

использовать тег datalist

ссылка на учебник w3School

Ещё вопросы

Сообщество Overcoder
Наверх
Меню