diff --git a/erpnext/public/js/controllers/transaction.js b/erpnext/public/js/controllers/transaction.js
index dc6d4cd..9e2bd22 100644
--- a/erpnext/public/js/controllers/transaction.js
+++ b/erpnext/public/js/controllers/transaction.js
@@ -8,6 +8,7 @@
 erpnext.TransactionController = erpnext.taxes_and_totals.extend({
 	onload: function() {
 		var me = this;
+		this.frm.show_print_first = true;
 		if(this.frm.doc.__islocal) {
 			var today = get_today(),
 				currency = frappe.defaults.get_user_default("currency");
@@ -81,7 +82,7 @@
 				me.calculate_taxes_and_totals();
 		}
 		if(frappe.meta.get_docfield(this.frm.doc.doctype + " Item", "item_code")) {
-			cur_frm.get_field("items").grid.set_multiple_add("item_code", "qty");
+			this.setup_item_selector();
 		}
 	},
 
@@ -890,7 +891,16 @@
 			rate = flt(item.rate) * flt(this.frm.doc.conversion_rate || 1);
 			item.gross_profit = flt(((rate - item.valuation_rate) * item.qty), precision("amount", item));
 		}
+	},
+
+	setup_item_selector: function() {
+		if(!this.item_selector) {
+			this.item_selector = new erpnext.ItemSelector({frm: this.frm});
+		}
 	}
+
+
+
 });
 
 frappe.ui.form.on(cur_frm.doctype + " Item", "rate", function(frm, cdt, cdn) {
diff --git a/erpnext/public/js/pos/pos.html b/erpnext/public/js/pos/pos.html
index d12b9b2..36ef7c9 100644
--- a/erpnext/public/js/pos/pos.html
+++ b/erpnext/public/js/pos/pos.html
@@ -47,7 +47,10 @@
     			</div>
     		</div>
     	</div>
-    	<div class="col-sm-7 pos-item-area">
+    	<div class="col-sm-7 pos-items-section">
+			<div class="row pos-item-area">
+
+			</div>
             <div class="row pos-item-toolbar">
             	<div class="search-area col-xs-12"></div>
             </div>
diff --git a/erpnext/public/js/pos/pos.js b/erpnext/public/js/pos/pos.js
index a239bbc..60801e6 100644
--- a/erpnext/public/js/pos/pos.js
+++ b/erpnext/public/js/pos/pos.js
@@ -131,7 +131,9 @@
 							item_code: obj.name,
 							item_price: format_currency(obj.price_list_rate, obj.currency),
 							item_name: obj.name===obj.item_name ? "" : obj.item_name,
-							item_image: obj.image ? "url('" + obj.image + "')" : null
+							item_image: obj.image ? "url('" + obj.image + "')" : null,
+							color: frappe.get_palette(obj.item_name),
+							abbr: frappe.get_abbr(obj.item_name)
 						})).tooltip().appendTo($wrap);
 					});
 				}
diff --git a/erpnext/public/js/pos/pos_item.html b/erpnext/public/js/pos/pos_item.html
index 1235db9..aec36a7 100644
--- a/erpnext/public/js/pos/pos_item.html
+++ b/erpnext/public/js/pos/pos_item.html
@@ -1,9 +1,13 @@
-<div class="pos-item" data-item-code="{%= item_code %}" title="{%= item_name || item_code %}">
-	<div class="pos-item-image {% if (!item_image) { %} no-image {% } %}"
-		 style="{% if (item_image) { %} background-image: {%= item_image %} {% } %}">
+<div class="pos-item-wrapper col-xs-3">
+	<div class="pos-item" data-item-code="{%= item_code %}" title="{%= item_name || item_code %}">
+		<div class="pos-item-image"
+			 style="{% if (item_image) { %} background-image: {{ item_image }} {% }
+			 	else { %} background-color: {{ color }} {% } %}">
+			{% if (!item_image) { %}{{ abbr }}{% } %}
+		</div>
+		<div class="pos-item-text">
+			<h6 class="item-code text-ellipsis">{%= item_name ? (item_name + " (" + item_code + ")") : item_code %}</h6>
+			<div class="small text-ellipsis">{%= item_price %}</div>
+		</div>
 	</div>
-	<div class="pos-item-text">
-		<h6 class="item-code text-ellipsis">{%= item_name ? (item_name + " (" + item_code + ")") : item_code %}</h6>
-		<div class="small text-ellipsis">{%= item_price %}</div>
-	</div>
-</div>
+</div>
\ No newline at end of file
diff --git a/erpnext/public/js/templates/item_selector.html b/erpnext/public/js/templates/item_selector.html
new file mode 100644
index 0000000..47da67c
--- /dev/null
+++ b/erpnext/public/js/templates/item_selector.html
@@ -0,0 +1,16 @@
+<div class="row pos-item-area">
+{% for (var i=0; i < data.length; i++) { var item = data[i]; %}
+<div class="col-xs-3 pos-item-wrapper">
+	<div class="pos-item" data-name="{{ item.name }}">
+		<div class="pos-item-image"
+			{% if(item.image) { %}style="background-image: url({{ item.image }});"{% }
+			else { %}style="background-color: {{ item.color }};"{% } %}>
+			{% if(!item.image) { %}{{ item.abbr }}{% } %}
+		</div>
+		<div class="pos-item-text">
+			<h6 class="item-code text-ellipsis">{{ item.name }}</h6>
+		</div>
+	</div>
+</div>
+{% } %}
+</div>
\ No newline at end of file
diff --git a/erpnext/public/js/utils/item_selector.js b/erpnext/public/js/utils/item_selector.js
new file mode 100644
index 0000000..7d0bd15
--- /dev/null
+++ b/erpnext/public/js/utils/item_selector.js
@@ -0,0 +1,94 @@
+erpnext.ItemSelector = Class.extend({
+	init: function(opts) {
+		$.extend(this, opts);
+
+		this.grid = this.frm.get_field("items").grid;
+		this.setup();
+	},
+
+	setup: function() {
+		var me = this;
+		if(!this.grid.add_items_button) {
+			this.grid.add_items_button = this.grid.add_custom_button(__('Add Items'), function() {
+				if(!me.dialog) {
+					me.make_dialog();
+				}
+				me.dialog.show();
+				me.render_items();
+			});
+		}
+	},
+
+	make_dialog: function() {
+		this.dialog = new frappe.ui.Dialog({
+			title: __('Add Items')
+		});
+		var body = $(this.dialog.body);
+		body.html('<div><p><input type="text" class="form-control"></p>\
+			<br><div class="results"></div></div>');
+
+		this.dialog.input = body.find('.form-control');
+		this.dialog.results = body.find('.results');
+
+		var me = this;
+		this.dialog.results.on('click', '.pos-item', function() {
+			me.add_item($(this).attr('data-name'))
+		});
+
+		this.dialog.input.on('keyup', function() {
+			if(me.timeout_id) {
+				clearTimeout(me.timeout_id);
+			}
+			me.timeout_id = setTimeout(function() {
+				me.render_items();
+				me.timeout_id = undefined;
+			}, 500);
+		});
+	},
+
+	add_item: function(item_code) {
+		// add row or update qty
+		var added = false;
+
+		// find row with item if exists
+		$.each(this.frm.doc.items || [], function(i, d) {
+			if(d.item_code===item_code) {
+				frappe.model.set_value(d.doctype, d.name, 'qty', d.qty + 1);
+				show_alert(__("Added {0} ({1})", [item_code, d.qty]));
+				added = true;
+				return false;
+			}
+		});
+
+		if(!added) {
+			var d = this.grid.add_new_row();
+			frappe.model.set_value(d.doctype, d.name, 'item_code', item_code);
+
+			// after item fetch
+			frappe.after_ajax(function() {
+				setTimeout(function() {
+					frappe.model.set_value(d.doctype, d.name, 'qty', 1);
+					show_alert(__("Added {0} ({1})", [item_code, 1]));
+				}, 100);
+			});
+		}
+
+	},
+
+	render_items: function() {
+		var args = erpnext.queries.item();
+		args.txt = this.dialog.input.val();
+		args.as_dict = 1;
+
+		var me = this;
+		frappe.link_search("Item", args, function(r) {
+			$.each(r.values, function(i, d) {
+				if(!d.image) {
+					d.abbr = frappe.get_abbr(d.item_name);
+					d.color = frappe.get_palette(d.item_name);
+				}
+			});
+			me.dialog.results.html(frappe.render_template('item_selector', {'data':r.values}));
+		});
+	}
+})
\ No newline at end of file