Update UI Page.js

Author: raghavs046

Modern Development/Add Multiple Catalogs to Order Guide/UI Page.js

@@ -1,15 +1,21 @@
-// HTML of UI page
 <?xml version="1.0" encoding="utf-8" ?>
 <j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
-<g:evaluate var="jvar_items" expression="RP.getWindowProperties().get('items')" />
-<hr></hr>
-<label>Select Order Guide</label>
-<g:ui_reference name="order_guide" id="order_guide" table="sc_cat_item_guide" completer="AJAXTableCompleter" style="width:180px"/>
-<hr></hr>
-<label>Select Variable Set</label>
-<g:ui_reference name="var_set" id="var_set" table="item_option_new_set" completer="AJAXTableCompleter" style="width:180px"/>
-<hr></hr>
-<button style="margin-top:4px;background-color:crimson;color:white" onclick="addItems('${jvar_items}')"> Add to Order Guide</button>
+    <g:evaluate var="jvar_items" expression="RP.getWindowProperties().get('items')" />
+    <hr>
+    </hr>
+    <!--Select Order Guide Name-->
+    <label>Select Order Guide</label>
+    <g:ui_reference name="order_guide" id="order_guide" table="sc_cat_item_guide" completer="AJAXTableCompleter" style="width:180px" />
+    <hr>
+    </hr>
+    <hr>
+    </hr>
+    <!--Select varaible set name -->
+    <label>Select Variable Set</label>
+    <g:ui_reference name="var_set" id="var_set" table="item_option_new_set" completer="AJAXTableCompleter" style="width:180px" />
+    <hr>
+    </hr>
+    <button style="margin-top:4px;background-color:crimson;color:white" onclick="addItems('${jvar_items}')"> Add to Order Guide</button>
 </j:jelly>
 
 //Client Script of UI page
@@ -29,5 +35,5 @@ function addItems(catItems) {
 function addOrderGuide(response) {
     var answer = response.responseXML.documentElement.getAttribute("answer");
     alert(answer);
-	GlideDialogWindow.get().destroy(); 
+    GlideDialogWindow.get().destroy();
 }