diff --git a/app/views/admin/universal_tables/_column.html.erb b/app/views/admin/universal_tables/_column.html.erb
index e6b90f3..bdd1632 100644
--- a/app/views/admin/universal_tables/_column.html.erb
+++ b/app/views/admin/universal_tables/_column.html.erb
@@ -14,7 +14,7 @@
   <div class="control-group">
     <label class="control-label muted" for="key_0">Key</label>
     <div class="controls">
-      <%= f.text_field :key %>
+      <%= f.number_field :key, :autocomplete => "off", :'data-type' => 'key' %>
     </div>
   </div>   
   <div class="control-group">
diff --git a/app/views/admin/universal_tables/_table_form.html.erb b/app/views/admin/universal_tables/_table_form.html.erb
index 122044f..fec150a 100644
--- a/app/views/admin/universal_tables/_table_form.html.erb
+++ b/app/views/admin/universal_tables/_table_form.html.erb
@@ -100,13 +100,43 @@
       label.addClass("hide");
     }
   })
-
-  $("#attributes-area").sortable({
-     update: function( event, ui ) {
-      updateOrder();
-     }
-  });
-
+  function key_on_blur() {
+    $('input[data-type=key]').on('blur',function() {
+      var index_this = $(this).parents('.attributes').index()
+      console.log(index_this)
+      var input_this = parseInt($(this).val()) - 1
+      if (input_this > ($('#attributes-area>.attributes').length-1)){
+        input_this = $('#attributes-area>.attributes').length-1
+      }else if (input_this < 0){
+        input_this = 0
+      }
+      if (index_this > input_this){
+        $(this).parents('#attributes-area>.attributes').insertBefore($('#attributes-area>.attributes').eq(input_this))
+      }
+      else if (index_this < input_this){
+        $(this).parents('#attributes-area>.attributes').insertAfter($('#attributes-area>.attributes').eq(input_this))
+      }
+      update_key(this)
+    });
+  }
+  
+  function update_key(ele){
+    var ui_child=$(ele).parents('#attributes-area').find('.attributes');
+    for (var i=0;i<ui_child.length;i++){
+      var now_ele = ui_child.eq(i);
+      now_ele.find('input[data-type=key]').val(i+1);
+    }
+    updateOrder
+  }
+  $('#attributes-area').ready(function(){
+    $("#attributes-area").sortable({
+       update: function( event, ui ) {
+        update_key($(ui.item[0]).find('input[data-type=key]'))
+       }
+    });
+    $("#attributes-area").on('change',key_on_blur)
+    key_on_blur()
+  })
   var updateOrder = function(){
      var attributes = $("#attributes-area").find(".attributes:visible");
       attributes.each(function(i){