diff --git a/@overflow/discovery/component/discovery/search-filter/search-filter.component.html b/@overflow/discovery/component/discovery/search-filter/search-filter.component.html
index ffa9f93..2906917 100644
--- a/@overflow/discovery/component/discovery/search-filter/search-filter.component.html
+++ b/@overflow/discovery/component/discovery/search-filter/search-filter.component.html
@@ -4,28 +4,10 @@
     <input type="hidden" >
   </div>
   <div class="ui-g-12">
-    <div class="ui-inputgroup">
-      <span style="margin-right: 18px">Start </span>
-      <input type="text" pInputText placeholder="127" maxlength="3">
-      <span class="ui-inputgroup-addon">.</span>
-      <input type="text" pInputText placeholder="0" maxlength="3">
-      <span class="ui-inputgroup-addon">.</span>
-      <input type="text" pInputText placeholder="0" maxlength="3">
-      <span class="ui-inputgroup-addon">.</span>
-      <input type="text" pInputText placeholder="1" maxlength="3">
-    </div>
+    <of-ip-input [hostIp]="startHostIp" (inputIp)="onInputIP($event, 0)" [title]="'Start'"></of-ip-input>
   </div>
   <div class="ui-g-12 ui-bottom-space-20">
-    <div class="ui-inputgroup">
-      <span style="margin-right: 24px">End </span>
-      <input type="text" pInputText placeholder="127" maxlength="3">
-      <span class="ui-inputgroup-addon">.</span>
-      <input type="text" pInputText placeholder="0" maxlength="3">
-      <span class="ui-inputgroup-addon">.</span>
-      <input type="text" pInputText placeholder="0" maxlength="3">
-      <span class="ui-inputgroup-addon">.</span>
-      <input type="text" pInputText placeholder="1" maxlength="3">
-    </div>
+    <of-ip-input [hostIp]="endHostIp" (inputIp)="onInputIP($event, 1)" [title]="'End'"></of-ip-input>
   </div>
 
   <div class="ui-g">
diff --git a/@overflow/discovery/component/discovery/search-filter/search-filter.component.ts b/@overflow/discovery/component/discovery/search-filter/search-filter.component.ts
index da235cd..98837d6 100644
--- a/@overflow/discovery/component/discovery/search-filter/search-filter.component.ts
+++ b/@overflow/discovery/component/discovery/search-filter/search-filter.component.ts
@@ -9,6 +9,8 @@ import {
 })
 export class SearchFilterComponent implements OnInit, AfterContentInit {
 
+  startHostIp: string;
+  endHostIp: string;
 
   constructor(
   ) {
@@ -19,4 +21,8 @@ export class SearchFilterComponent implements OnInit, AfterContentInit {
 
   ngAfterContentInit() {
   }
+
+  onInputIP(event, idx) {
+
+  }
 }