opensourcepos/application/views/people/form_basic_info.php

<div class="field_row clearfix">	
<?php echo form_label($this->lang->line('common_first_name').':', 'first_name',array('class'=>'required')); ?>
	<div class='form_field'>
	<?php echo form_input(array(
		'name'=>'first_name',
		'id'=>'first_name',
		'value'=>$person_info->first_name)
	);?>
	</div>
</div>
<div class="field_row clearfix">	
<?php echo form_label($this->lang->line('common_last_name').':', 'last_name',array('class'=>'required')); ?>
	<div class='form_field'>
	<?php echo form_input(array(
		'name'=>'last_name',
		'id'=>'last_name',
		'value'=>$person_info->last_name)
	);?>
	</div>
</div>

<div class="field_row clearfix">	
<?php echo form_label($this->lang->line('common_email').':', 'email'); ?>
	<div class='form_field'>
	<?php echo form_input(array(
		'name'=>'email',
		'id'=>'email',
		'value'=>$person_info->email)
	);?>
	</div>
</div>

<div class="field_row clearfix">	
<?php echo form_label($this->lang->line('common_phone_number').':', 'phone_number'); ?>
	<div class='form_field'>
	<?php echo form_input(array(
		'name'=>'phone_number',
		'id'=>'phone_number',
		'value'=>$person_info->phone_number));?>
	</div>
</div>

<div class="field_row clearfix">	
<?php echo form_label($this->lang->line('common_address_1').':', 'address_1'); ?>
	<div class='form_field'>
	<?php echo form_input(array(
		'name'=>'address_1',
		'id'=>'address_1',
		'value'=>$person_info->address_1));?>
	</div>
</div>

<div class="field_row clearfix">	
<?php echo form_label($this->lang->line('common_address_2').':', 'address_2'); ?>
	<div class='form_field'>
	<?php echo form_input(array(
		'name'=>'address_2',
		'id'=>'address_2',
		'value'=>$person_info->address_2));?>
	</div>
</div>

<div class="field_row clearfix">	
<?php echo form_label($this->lang->line('common_city').':', 'city'); ?>
	<div class='form_field'>
	<?php echo form_input(array(
		'name'=>'city',
		'id'=>'city',
		'value'=>$person_info->city));?>
	</div>
</div>

<div class="field_row clearfix">	
<?php echo form_label($this->lang->line('common_state').':', 'state'); ?>
	<div class='form_field'>
	<?php echo form_input(array(
		'name'=>'state',
		'id'=>'state',
		'value'=>$person_info->state));?>
	</div>
</div>

<div class="field_row clearfix">	
<?php echo form_label($this->lang->line('common_zip').':', 'zip'); ?>
	<div class='form_field'>
	<?php echo form_input(array(
		'name'=>'zip',
		'id'=>'postcode',
		'value'=>$person_info->zip));?>
	</div>
</div>

<div class="field_row clearfix">	
<?php echo form_label($this->lang->line('common_country').':', 'country'); ?>
	<div class='form_field'>
	<?php echo form_input(array(
		'name'=>'country',
		'id'=>'country',
		'value'=>$person_info->country));?>
	</div>
</div>

<div class="field_row clearfix">	
<?php echo form_label($this->lang->line('common_comments').':', 'comments'); ?>
	<div class='form_field'>
	<?php echo form_textarea(array(
		'name'=>'comments',
		'id'=>'comments',
		'value'=>$person_info->comments,
		'rows'=>'5',
		'cols'=>'17')		
	);?>
	</div>
</div>

<script type='text/javascript' language="javascript">
//validation and submit handling
$(document).ready(function()
{
		
	var handle_auto_completion = function(fields) {
		return function(event, results, formatted) {
			if (results != null && results.length > 0) {
				// handle auto completion
				for(var i in fields) {
					$("#" + fields[i]).val(results[i]);
				}
		        return false;
			}
			return true;
		};
	};

	var set_field_values = function(results) {
		return results[0] + ' - ' + results[1];
	};

	var create_parser = function(field_name, parse_format)
	{
		return function(data)
		{
            var parsed = [];
            $.each(data, function(index, value)
            {
                var address = value.address;
                var row = [];
                $.each(parse_format, function(key, value)
                {
                    row.push(address[value]);
                });
                parsed[index] = {
        	        data: row,
    	            value: address[field_name],
    	            result: address[field_name]
                };
            });
            return parsed;
		};
	};

	var request_params = function() 
	{
		return {
			 format: 'json',
             limit: 5,
		     street: $("#address_1").val(),
		     city: $("#city").val(),
		     postalcode: $("#postcode").val(),
		     addressdetails: 1,
		     country: 'Belgium',
		     state: $("#state").val()
		};
	};

	var url = 'http://nominatim.openstreetmap.org/search';
	
	var handle_city_completion = handle_auto_completion(["postcode", "city", "state", "country"]);
	$("#postcode").autocomplete(url,{
		max:100,
		minChars:3,
		delay:500,
		formatItem: set_field_values,
		type: 'GET',
		dataType:'json',
		extraParams: request_params,
		parse: create_parser('postcode', ["postcode", "city", "state", "country"])
	});
    $("#postcode").result(handle_city_completion);

	$("#city").autocomplete(url,{
		max:100,
		minChars:5,
		delay:500,
		formatItem: set_field_values,
		type: 'GET',
		dataType:'json',
		extraParams: request_params,
		parse: create_parser('city', ["postcode", "city", "state", "country"])
	});
   	$("#city").result(handle_city_completion);

	$("#state").autocomplete(url, {
		max:100, 
		minChars:0, 
		delay:500,
		type: 'GET',
		dataType:'json',
		extraParams: request_params,
		parse: create_parser('state', ["state", "country"]),
		formatItem: function(results) {
			return results[1] + ' - ' + results[3];
		}
	});
	$("#state").result(handle_auto_completion(["state", "country"]));

	$("#country").autocomplete(url,{
		max:100,
		minChars:3,
		delay:500,
		type: 'GET',
		dataType:'json',
		extraParams: request_params,
		parse: create_parser('country', ["country"]), 
		formatItem: function(results) {
			return results[1];
		}
	});
	$("#country").result(handle_auto_completion(["country"]));

});
</script>