diff --git a/media/css/seahub.css b/media/css/seahub.css
index e9bf7ef291..8233665ddc 100644
--- a/media/css/seahub.css
+++ b/media/css/seahub.css
@@ -573,13 +573,19 @@ p {
 #email,
 #email_or_group,
 #share-link,
-#added-member-name,
-#recommend-msg {
+#added-member-name {
     width:260px;
     height:80px;
 }
-#groups {
-    width:260px;
+#recommend-msg,
+#recommend-groups {
+    width:450px;
+}
+#recommend-groups {
+    margin-bottom:5px;
+}
+#recommend-msg {
+    height:55px;
 }
 /* group, org */
 .group-list {
diff --git a/templates/repo.html b/templates/repo.html
index cd726ba8d2..7eac2eb086 100644
--- a/templates/repo.html
+++ b/templates/repo.html
@@ -267,20 +267,6 @@ $("table tr:gt(0)").hover(
     }
 );
 
-$(function() {
-    // recommend form autocomplete
-    var group_list = []
-    {% for group in groups %}
-        group_list.push('{{ group.props.group_name }} <{{ group.props.creator_name }}>');
-    {% endfor %}
-    if (group_list.length == 1) {
-       $('#recommend-form #groups').val(group_list[0]);
-    }
-    addAutocomplete('#groups', '#recommend-form', group_list);
-    $('.ui-autocomplete').css({'max-height': window.innerHeight - $('.ui-autocomplete-input').offset().top - $('.ui-autocomplete-input').height() - 10, 'overflow': 'auto'});
-    
-});        
-
 $('#main-panel').removeClass('ovhd');
 var Hide = '';
 $('.more-op').hover(
@@ -456,20 +442,7 @@ $('#upload-file, #add-new-dir, #add-new-file').hover(
     }
 );
 
-$('#recommend-submit').click(function() {
-    if (!$('#groups').val()) {
-        apply_form_error('recommend-form', '小组名称不能为空。');
-        return false;    
-    }
-    if (!$('#recommend-msg').val()) {
-        apply_form_error('recommend-form', '推荐语不能为空。');
-        return false;   
-    }
-});
-
 {% include "snippets/bottom_bar.html" %}
 {% endif %}
-
-
 </script>
 {% endblock %}
diff --git a/templates/repo_view_file.html b/templates/repo_view_file.html
index c66de8075c..0818e2f22d 100644
--- a/templates/repo_view_file.html
+++ b/templates/repo_view_file.html
@@ -214,19 +214,6 @@ $("#link-send-form").submit(function(event) {
    return false;
 });
 
-$(function() {
-    // recommend form autocomplete
-    var group_list = []
-    {% for group in groups %}
-        group_list.push('{{ group.props.group_name }} <{{ group.props.creator_name }}>');
-    {% endfor %}
-    if (group_list.length == 1) {
-       $('#recommend-form #groups').val(group_list[0]);
-    }
-    addAutocomplete('#groups', '#recommend-form', group_list);
-    $('.ui-autocomplete').css({'max-height': window.innerHeight - $('.ui-autocomplete-input').offset().top - $('.ui-autocomplete-input').height() - 10, 'overflow': 'auto'});
-    
-});        
 {% include "snippets/bottom_bar.html" %}
 {% endif %}
 
@@ -300,17 +287,5 @@ $('#open-local').click(function () {
         }
     }, 2000);
 });
-
-
-$('#recommend-submit').click(function() {
-    if (!$('#groups').val()) {
-        apply_form_error('recommend-form', '小组名称不能为空。');
-        return false;    
-    }
-    if (!$('#recommend-msg').val()) {
-        apply_form_error('recommend-form', '推荐语不能为空。');
-        return false;   
-    }
-});
 </script>
 {% endblock %}
diff --git a/templates/snippets/bottom_bar.html b/templates/snippets/bottom_bar.html
index a0d05b8a0f..518f5816ca 100644
--- a/templates/snippets/bottom_bar.html
+++ b/templates/snippets/bottom_bar.html
@@ -1,13 +1,30 @@
-{% if groups %}
-var Bottom_bar = '<div id="bottom-bar"><button id="recommend">推荐到小组</button> <button>发送到私信</button></div>';
-{% else %}
-var Bottom_bar = '<div id="bottom-bar"><button>发送到私信</button></div>';
-{% endif %}
-
+var Bottom_bar = '<div id="bottom-bar">{% if groups %}<button id="recommend">推荐到小组</button> {% endif %}<button>发送到私信</button></div>';
 $('#wrapper').append(Bottom_bar);
-$('#bottom-bar').css({'position':'fixed', 'bottom':0, 'left':$('#main').offset().left + $('#main').width() + 15});
-$('#recommend').click(function() {
-    $('#recommend-form').modal({appendTo: '#main'});
-});
+$('#bottom-bar').css({'position':'fixed', 'bottom':0, 'right':'10px'});
 $('#main-panel').css('margin-bottom', '28px');
 $('#footer').addClass('hide');
+
+{% if groups %}
+var group_list = []
+{% for group in groups %}
+group_list.push('{{ group.props.group_name }} <{{ group.props.creator_name }}>');
+{% endfor %}
+if (group_list.length == 1) {
+    $('#recommend-groups').val(group_list[0]);
+}
+$('#recommend').click(function() {
+    $('#recommend-form').modal({appendTo: '#main'});
+    addAutocomplete('#recommend-groups', '#recommend-form', group_list);
+    $('.ui-autocomplete').css({'max-height': window.innerHeight - $('.ui-autocomplete-input').offset().top - $('.ui-autocomplete-input').height() - 10, 'overflow': 'auto'});
+});
+$('#recommend-submit').click(function() {
+    if (!$.trim($('#recommend-groups').val())) {
+        apply_form_error('recommend-form', '小组名称不能为空。');
+        return false;    
+    }
+    if (!$.trim($('#recommend-msg').val())) {
+        apply_form_error('recommend-form', '推荐语不能为空。');
+        return false;   
+    }
+});
+{% endif %}
diff --git a/templates/snippets/group_recommend_form.html b/templates/snippets/group_recommend_form.html
index 7efe191cba..9ff606a164 100644
--- a/templates/snippets/group_recommend_form.html
+++ b/templates/snippets/group_recommend_form.html
@@ -2,15 +2,14 @@
     <form action="{% url 'group_recommend' %}" method="post" id="recommend-form" class="hide">{% csrf_token %}
         <h3>推荐
         {% for name, link in zipped %}
-            {% if not forloop.last %}
-               {{ name }} /               
-            {% else %}
+            {% if forloop.last %}
                 {{ name }}
             {% endif %}
-        {% endfor %} 到小组
+        {% endfor %}
+        到小组
         </h3>
         <label>小组名称：</label><br />
-        <input type="input" name="groups" id="groups" value="" /><br />
+        <input type="input" name="groups" id="recommend-groups" value="" /><br />
         <label>推荐语：</label><br />
         <textarea name="message" id="recommend-msg"></textarea><br />
         <input type="hidden" name="repo_id" value="{{ repo.id }}" />