Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 22.01.2014, 15:51
Интересующийся
Отправить личное сообщение для Alex351960 Посмотреть профиль Найти все сообщения от Alex351960
 
Регистрация: 29.07.2013
Сообщений: 29

Получение информации из БД через Javascript
Добрый день Решил создать для себя небольшой проект (сразу говорю, что не в комерческих целях). Проект писал на php (Javascript редко использовался, потому что его очень плохо знаю). Но вот столкунлся с одной проблемкой . Опишу подробнее:
У меня есть маленькая форма с инпутом type='text'

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

После этого я из списка выбираю нужный мне город, название которого автоматически заполняет поле

Скажите, пожалуйста, можно это как-то реализовать? Есть ли готовые решения? Заранее большое спасибо!
Ответить с цитированием
  #2 (permalink)  
Старый 22.01.2014, 16:08
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,225

Сообщение от Alex351960
можно это как-то реализовать?
Разумеется!
Событие click срабатывает только при повторном нажатии (через ON)
Ответить с цитированием
  #3 (permalink)  
Старый 22.01.2014, 16:57
Интересующийся
Отправить личное сообщение для Alex351960 Посмотреть профиль Найти все сообщения от Alex351960
 
Регистрация: 29.07.2013
Сообщений: 29

Сообщение от ksa Посмотреть сообщение
Разумеется!
Событие click срабатывает только при повторном нажатии (через ON)
Спасибо большое! Буду разбираться.
Ответить с цитированием
  #4 (permalink)  
Старый 22.01.2014, 19:07
Интересующийся
Отправить личное сообщение для Alex351960 Посмотреть профиль Найти все сообщения от Alex351960
 
Регистрация: 29.07.2013
Сообщений: 29

Сообщение от ksa Посмотреть сообщение
Разумеется!
Событие click срабатывает только при повторном нажатии (через ON)
А как сделать так, чтобы города были записаны не в файле, а брались из базы данных?
Ответить с цитированием
  #5 (permalink)  
Старый 22.01.2014, 22:50
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,225

Сообщение от Alex351960
А как сделать так, чтобы города были записаны не в файле, а брались из базы данных?
Так ты же
Сообщение от Alex351960
Проект писал на php
Вот и бери их из БД.
Ответить с цитированием
  #6 (permalink)  
Старый 22.01.2014, 23:09
Интересующийся
Отправить личное сообщение для Alex351960 Посмотреть профиль Найти все сообщения от Alex351960
 
Регистрация: 29.07.2013
Сообщений: 29

Сообщение от ksa Посмотреть сообщение
Так ты же

Вот и бери их из БД.
Дело не в этом. Я имею в виду то, что города подгружались бы из бд после ввода первых букв города (как я понимаю это делается с помощью ajax). Такое можно как-то сделать?
Ответить с цитированием
  #7 (permalink)  
Старый 23.01.2014, 08:40
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,225

Сообщение от Alex351960
Я имею в виду то, что города подгружались бы из бд после ввода первых букв города (как я понимаю это делается с помощью ajax). Такое можно как-то сделать?
Начни хоть с этого...
Ответить с цитированием
  #8 (permalink)  
Старый 23.01.2014, 16:14
Интересующийся
Отправить личное сообщение для Alex351960 Посмотреть профиль Найти все сообщения от Alex351960
 
Регистрация: 29.07.2013
Сообщений: 29

Сообщение от ksa Посмотреть сообщение
Начни хоть с этого...
Спасибо. А если мне использовать вариант с тем, что все города будут записаны в отдельный файл js, дабы не захламлять я html код?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
.input_form { position:relative; float: left; width:387px;  margin-top:10px; height:50px;   }
.input_form input{ border: none; position:absolute; display:block; padding:0 5px; width:250px; line-height:23px; height:23px; font-family:Tahoma, Geneva, sans-serif; font-size:15px; background:#d9d9d9;}
.from_help { position:absolute; left:0; top:23px; border:1px solid #d9d9d9; padding:0 4px; width:250px; border-top:none; background:#fff; z-index:2; }
</style>
<script>
$(document).ready(function () {
    function like(str) {
        var town_from = [
            'Альметьевск',
            'Москва',
            'Армавир',
            'Артем',
            'Архангельск',
            'Астрахань',
            'Балаково',
            'Барнаул',
            'Белгород',
            'Березники',
            'Бийск',
            'Благовещенск',
            'Борисоглебск',
            'Братск',
            'Брянск',
            'Буденновск',
            'Великий Новгород',
            'Владивосток',
            'Волгоград',
            'Волжский',
            'Вологда',
            'Воронеж',
            'Дзержинск',
            'Екатеринбург',
            'Иваново',
            'Ижевск',
            'Иркутск',
            'Йошкар-Ола',
            'Казань',
            'Калининград',
            'Каменск-Уральский',
            'Кемерово',
            'Киров',
            'Кострома',
            'Краснодар',
            'Красноярск',
            'Курган',
            'Курск',
            'Липецк',
            'Магнитогорск',
            'Миасс',
            'Мурманск',
            'Набережные Челны'
        ],
            html = '',
            str = new RegExp("^" + str, "i");
        for (var i = 0; i < town_from.length; i++) {
            if (str.test(town_from[i])) html += '<div class="add">' + town_from[i] + '</div>'
        }
        return html
    }
    $("#from").on("input", function () {
        var val = this.value;
        $('#from_help').html(val.length ? like(val) : '')
    });

    $('#from_help').on('click', '.add', function () {
        $("#from").val($(this).text())
        $('#from_help').html('');
    });
})
</script>
</head>
<body>
<div class="input_form">
	<input id="from" type="text" />
	<div id="from_help" class="from_help "></div>
</div>
</body>
</html>

Можно ли как-то занести города в отдельный файл?
Ответить с цитированием
  #9 (permalink)  
Старый 24.01.2014, 11:13
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,225

Сообщение от Alex351960
А если мне использовать вариант с тем, что все города будут записаны в отдельный файл js, дабы не захламлять я html код?
Если ты правильно подключишь тот файл, для алгоритма - разницы не будет ни какой.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Вставка flash через javascript михаил123 Общие вопросы Javascript 1 17.11.2012 22:00
recaptcha через javascript KOLANICH Общие вопросы Javascript 1 11.10.2010 08:35
Обращение к именам, полученным через Javascript baal1988 Events/DOM/Window 1 31.08.2008 15:08
Поиск в массиве через JavaScript Noran Общие вопросы Javascript 0 10.08.2008 17:31
Получение расчетного листка через интранет StartingCoder Общие вопросы Javascript 2 02.07.2008 17:19