Архив

Публикации с меткой ‘ajax’
26 февраля 2019 Нет комментариев

JS:

$(".input_place").autocomplete({
	source:"/?ajax_action=get_places",
	minLength:4,
	position:{my:"left top",at:"left bottom"},
	select:function(event,ui){
		var loc=$(this).closest('form').attr('action');
		if(ui.item.country_id){
			loc+='?country[]='+ui.item.country_id;
			$('#hidden_country').val(ui.item.country_id);
		}
		if(ui.item.district_id){
			loc+='&district[]='+ui.item.district_id;
			$('#hidden_district').val(ui.item.district_id);
		}
		if(ui.item.city_id){
			loc+='&city[]='+ui.item.city_id;
			$('#hidden_city').val(ui.item.city_id);
		}
		var selected=ui.item.country_name;
		if(ui.item.district_name!=''){
			selected=ui.item.district_name;
		}
		if(ui.item.city_name!=''){
			selected=ui.item.city_name;
		}
		$(this).val(selected);
		if($('#hidden_country').val()==undefined){
			window.location.href=loc;
		}
		return false;
	}
}).autocomplete("instance")._renderItem=function(ul,item){
	var li=item.country_name;
	if(item.district_name!=''){
		li+=' '+item.district_name;
	}
	if(item.city_name!=''){
		li+=' '+item.city_name;
	}
	return $("<li>").append(li).appendTo(ul);
};
if($_GET['ajax_action']=='get_places'){
	$places=array();
	$ajax_countries=get_from_base('*','countries',"shown=1 and (`name` LIKE '%".$_GET['term']."%' OR `id` IN (SELECT `parent` FROM `districts` WHERE`shown`=1 and (`name` LIKE '%".$_GET['term']."%' OR `id` IN (SELECT `parent` FROM `cities` WHERE`shown`=1 and `name` LIKE '%".$_GET['term']."%'))))",'pos');
	if(count($ajax_countries)>0){
		foreach($ajax_countries as $country){
			$places[]=array('country_id'=>$country['id'],'country_name'=>$country['name'],'district_id'=>0,'district_name'=>'','city_id'=>0,'city_name'=>'');
			$ajax_districts=get_from_base('*','districts',"`parent`=".$country['id']." and `shown`=1 and (`name` LIKE '%".$_GET['term']."%' OR `id` IN (SELECT `parent` FROM `cities` WHERE`shown`=1 and `name` LIKE '%".$_GET['term']."%'))",'pos');
			if(count($ajax_districts)>0){
				foreach($ajax_districts as $district){
					$places[]=array('country_id'=>$country['id'],'country_name'=>$country['name'],'district_id'=>$district['id'],'district_name'=>$district['name'],'city_id'=>0,'city_name'=>'');
					$ajax_cities=get_from_base('*','cities',"`parent`=".$district['id']." and `shown`=1 and `name` LIKE '%".$_GET['term']."%'",'pos');
					if(count($ajax_cities)>0){
						foreach($ajax_cities as $city){
							$places[]=array('country_id'=>$country['id'],'country_name'=>$country['name'],'district_id'=>$district['id'],'district_name'=>$district['name'],'city_id'=>$city['id'],'city_name'=>$city['name']);
						}
					}
				}
			}
		}
	}
	header('Content-Type: application/json');
	echo json_encode($places);
	exit();
}

https://jqueryui.com/autocomplete/#custom-data

Categories: Javascript, PHP Tags: , ,
9 декабря 2010 3 комментария

Часть формы где у нас инпут для логина:

echo "<input type='text' id='login' name='login' onblur='checkName(this.value, \"\")'/>";
	echo "&nbsp;&mdash;&nbsp;<label for='login'>LOGIN</label><br/>";
	echo "<span class='hidden' id='nameCheckFailed'>NOT AVAILABLE</span>";
	echo "<span class='hidden' id='nameCheckOK'>AVAILABLE</span><br/>";

Яваскрипт, подключенный например где-то в head:

function checkName(input,response) {
	if (response != '') {
		failtext=document.getElementById('nameCheckFailed');
		oktext=document.getElementById('nameCheckOK');
		if (response == '1') {
			failtext.className='failtext';
			oktext.className='hidden';
		}
		else {
			failtext.className='hidden';
			oktext.className='oktext';
		}
	}
	else {
		if (input != '') {
			url='http://hostname/xml/checkUserName.php?q='+input;
			loadXMLDoc(url);
		}
		else {
			failtext.className='hidden';
			oktext.className='hidden';
		}
	}
}
var req;
function loadXMLDoc(url) {
	if (window.XMLHttpRequest) {
		req = new XMLHttpRequest();
		req.onreadystatechange=processReqChange;
		req.open("GET",url,true);
		req.send(null);
	}
	else if (window.ActiveXObject) {
		req = new ActiveXObject("Micrisoft.XMLHTTP");
		if (req) {
			req.onreadystatechange=processReqchange;
			req.open("GET",url,true);
			req.send();
		}
	}
}
function processReqChange() {
	if (req.readyState == 4) {
		if (req.status == 200) {
			response=req.responseXML.documentElement;
			method=response.getElementsByTagName('method')[0].firstChild.data;
			result=response.getElementsByTagName('result')[0].firstChild.data;
			eval(method + '(\'\', result)');
		}
		else {
			alert("There was a problem retrieving the XML data:\n"+req.statusText);
		}
	}
}

Файл /xml/checkUserName.php (в первой строчке инклуд подключения к БД, если не знаем что там и как — гуглим, еще конечно должна существовать таблица users с полем username, в которое пишутся логины)

<?php
include ($_SERVER['DOCUMENT_ROOT']."/include/dbconfig.php");
header('Content-Type: text/xml');
echo '<?xml version="1.0" encoding="UTF-8" standalone="yes"?>';
function nameInUse($q) {
	$query=mysql_query("SELECT COUNT(*) FROM users WHERE username='".$q."'");
	$result=mysql_fetch_array($query);
	switch($result[0]) {
		case '1' :
			return '1';
			break;
		default:
			return '0';
	}
}
echo '<response>
	<method>checkName</method>
	<result>'.nameInUse($_GET['q']).'</result>
</response>';
?>

И CSS:

span.hidden {
	display:none;
}
span.failtext {
	display: inline;
	background: #ffebea;
}
span.oktext {
	display: inline;
	background-color: #efffea;;
}

На основе: http://wmdn.ru/javascript/example-of-check-login-using-ajax/
Вариант от WMDN: http://wmdn.ru/javascript/example-of-check-login-using-ajax/

Categories: Javascript, PHP Tags: , ,