Autocomplete Search Magento Customer by API Call

Hi, today i’m gonna show you how to add ‘Autocomplete Search for Magento Customer by API Call‘. I assume you already read my first post about calling Magento API ‘Play with Magento API SOAP V1‘. This method using jQuery Autocomplete, here is the link.

As i mention in ‘Play with Magento API SOAP V1‘, first of all you gonna need is to make connection between our application and Magento API. Since post before use indonesian language i’ll repeat again here to make sure you follow correct instruction.

Connection

Setting SOAP Account

We need SOAP account to integrate with system and getting the roles we want.

  1. Login to backend magento
  2. System -> Web Services -> SOAP/XML-RPC – Roles
  3. Add New Role
  4. Resource Access -> All -> Save Role
  5. System -> Web Services -> SOAP/XML-RPC – Users
  6. Add New User
  7. On ‘User Role’ Tab, choose role we’ve made before
  8. Save User

Login with SOAP Account

In your host, create php file (ex. magehost.php) and put script below to login using SOAP account you’ve created.

$config=array();
$config["hostname"] = "namahost.com"; //ini adalah host magento anda
$config["login"] = "apiuser"; //ini adalah user API anda
$config["password"] = "apipassword"; //ini adalah password magento anda

$proxy = new SoapClient('http://'.$config["hostname"].'/index.php/api/soap/?wsdl', array('trace'=>1));
$sessionId = $proxy->login($config["login"], $config["password"]);

Hold it here, then we’re gonna make one file to handle autocomplete processing.

jQuery Autocomplete and API Call

jQuery Autocomplete

After we’ve done download jQuery UI, we need to include it on file processing. On this article, i’ll use “Default Functionality” method to request customer name and ID via API SOAP. You can see the full source example method here.
Remember to put jQuery file before jQuery and add css file.

API Call

To call customer data on magento we use ‘customer.list‘. This will allow you to retrieve all customer list on Magento.

Let’s create one file on host (ex. autocomplete.php) and put the code below.

<?php
	require_once('magehost.php');
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Autocomplete Customer Magento Call by API</title>
<link href="your_style.css" rel="stylesheet" type="text/css">
<link href="jquery-ui-1.10.4.custom.min.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="jquery-1.10.2.js"></script>
<script type="text/javascript" src="jquery-ui-1.10.4.custom.min.js"></script>
</head>

<body>
	<input type="text" class="input-text" id="fName" name="customerName" />
    <script type="text/javascript">
		$(document).ready(function() {
			var customerName = [
				<?php
					try { 
						$action = "customer.list"; // action for calling customer data
						$customers = $proxy->call($sessionId, $action);
						foreach($customers as $customer) {
							$lastname = str_replace("'", "", $customer['lastname']);
							echo "'".$customer['firstname'].' '.$lastname.' '.$customer['customer_id']."',";
						}
					}
					catch (Exception $e) { //while an error has occured
						echo "==> Error: ".$e->getMessage(); //we print this
						   exit();
					}
				?>
			];
			$( "#fName" ).autocomplete({
				source: customerName
			});
		});
	</script>
</body>
</html>

Explanation

In the code above , at first we will include our host which is magehost.php => require_once(‘magehost.php’).
Then we make textbox with id fName, the ID will use as identifier for jQuery Autocomplete. And we retrieve all customer list using customer.list and make loop for data. Please remember, the acceptable array format for ‘default fuctionality’ autocomplete is like this [“ActionScript”, “AppleScript”, “Asp”]. Other than that your script will show error. Use console log to debug the script. And to handled error from API call we use Exception something like $e->getMessage(). And if you succes all Magento Customer will retrieve on textbox as autocomplete.

Magento Customer Autocomplete

Magento Customer Autocomplete

Noted : This will make your website slower if you have thousands customer list. Use filter to manipulated it. For example you can use :

$filters = array( array('firstname' => array('like'=>'your_input_text%')));
$customers = $proxy->call($sessionId, $action, $filters);

Hope this help 😀

Play with Magento API SOAP V1

Sesuai judul, kali ini saya akan mencoba untuk berbagi tips dan trik bagaimana membuat Aplikasi di luar Magento tapi dengan mengandalkan API dari magento itu sendiri. Banyak sekali hal yang dapat kita lakukan pada penggunaan Magento API ini, seperti dijelaskan disini “The Magento SOAP v1 API provides you with the ability to manage your eCommerce stores by providing calls for working with resources such as customers, categories, products, and sales orders. It also allows you to manage shopping carts and inventory.” Kita juga bisa mengembangkan aplikasi iOS dan Android dengan menggunakan API SOAP method ini.

Koneksi

Setting SOAP account
Hal pertama yang harus dilakukan adalah membuat koneksi antara aplikasi yang kita buat dengan API dari magento. Untuk itu kita membutuhkan SOAP account yang terintegrasi dan mendapatkan role-role seperti yang kita inginkan. Caranya :

  1. Login ke backend magento
  2. System -> Web Services -> SOAP/XML-RPC – Roles
  3. Add New Role
  4. Resource Access -> All -> Save Role
  5. System -> Web Services -> SOAP/XML-RPC – Users
  6. Add New User
  7. Pada Tab ‘User Role’ pilih role yang kita buat tadi
  8. Save User

Sekarang kita sudah mempunyai username dan password yang akan kita gunakan untuk login nanti.

Login dengan SOAP account
Masuk ke server/hosting aplikasi anda, dan buat sebuah file baru dengan nama magehost.php. Kita akan membuat simple script untuk login dengan SOAP account.

$config=array();
$config["hostname"] = "namahost.com"; //ini adalah host magento anda
$config["login"] = "apiuser"; //ini adalah user API anda
$config["password"] = "apipassword"; //ini adalah password magento anda

$proxy = new SoapClient('http://'.$config["hostname"].'/index.php/api/soap/?wsdl', array('trace'=>1));
$sessionId = $proxy->login($config["login"], $config["password"]);

Tahan sampai disini, kemudian kita akan membuat sebuah file lagi untuk testing koneksi dan script kita apakah sukses atau gagal.

Get Customer via API SOAP
Untuk testing, kita akan mencoba memanggil data customer dengan sudah mengetahui ID dari customer tersebut. Buat file dengan nama getcustomer.php, dan isikan script di bawah :

require_once('magehost.php');
$customerId = '2';
$result = $proxy->call($sessionId, 'customer.info', $customerId);
var_dump($result);

Buka browser, masukkan url : namahost.com/getcustomer.php . Jika sukses data-data customer akan tampil pada browser anda dan jika gagal akan tampil juga pesan gagal. Pesan gagal bisa dilihat disini

Diatas adalah contoh yang sangat sederhana sekali pada penggunaan Magento API SOAP. Pada tulisan berikutnya kita akan mencoba hal yang lebih menantang yaitu memangil list customer dan memanfaatkan jQuery Autocomplete.

Semoga membantu 😀