diff --git a/seahub/templates/js/lib-op-popups.html b/seahub/templates/js/lib-op-popups.html
index d353461520..11d97090e3 100644
--- a/seahub/templates/js/lib-op-popups.html
+++ b/seahub/templates/js/lib-op-popups.html
@@ -39,6 +39,16 @@
     </form>
     </script>
 
+    <script type="text/template" id="dirent-rename-dialog-template">
+    <form id="rename-form" class="dirent-rename-dialog" action="" method="post">
+        <h3><%= form_title %></h3>
+        <input type="text" name="newname" value="<%- dirent_name %>" class="input vam" maxlength="{{max_file_name}}" />
+        <p class="error hide"></p>
+        <button type="submit" class="submit">{% trans "Submit" %}</button>
+        <button class="simplemodal-close">{% trans "Cancel" %}</button>
+    </form>
+    </script>
+
     <script type="text/template" id="mvcp-form-template">
     <form id="mv-form" action="" method="post" class="file-choose-form">{% csrf_token %}
         <h3><%= form_title %></h3>
diff --git a/seahub/templates/js/templates.html b/seahub/templates/js/templates.html
index 3cf14384b9..09bc312b0d 100644
--- a/seahub/templates/js/templates.html
+++ b/seahub/templates/js/templates.html
@@ -150,9 +150,6 @@
 
     <div class="switch-mode vam">
         <span class="list-view-icon-btn sf2-icon-list-view <% if (mode == 'list') { %>active<% } %>" id="js-switch-list-view"></span><span class="grid-view-icon-btn sf2-icon-grid-view <% if (mode == 'grid') { %>active<% } %>" id="js-switch-grid-view"></span>
-        <!-- <img src="{{ MEDIA_URL }}img/grid.png" title="{% trans "Grid View" %}" id="js-switch-grid-view" alt='' class="grid-view-btn cspt fright <% if (mode == 'grid') { %>active<% } %>" />
-        <img src="{{ MEDIA_URL }}img/list.png" title="{% trans "List View" %}" id="js-switch-list-view" alt='' class="list-view-btn cspt fright <% if (mode == 'list') { %>active<% } %>" />
-    -->
     </div>
 
     <% if (path == '/') { %>
diff --git a/static/scripts/app/models/dirent.js b/static/scripts/app/models/dirent.js
index eba5685094..258fae8de4 100644
--- a/static/scripts/app/models/dirent.js
+++ b/static/scripts/app/models/dirent.js
@@ -74,6 +74,49 @@ define([
                         options.error(xhr);
                 }
             });
+        },
+
+        rename: function(options) {
+            var dir = this.collection;
+            var _this = this;
+            options = options || {};
+
+            var opts = {
+                repo_id: dir.repo_id,
+                name: this.get('is_dir') ? 'rename_dir' : 'rename_file'
+            };
+
+            var post_data = {
+                'operation': 'rename',
+                'newname': options.newname
+            };
+
+            $.ajax({
+                url: Common.getUrl(opts) + '?p=' + encodeURIComponent(this.getPath()),
+                type: 'POST',
+                dataType: 'json',
+                beforeSend: Common.prepareCSRFToken,
+                data: post_data,
+                success: function(data) {
+                    var renamed_dirent_data = {
+                        'obj_name': options.newname,
+                        'last_modified': new Date().getTime()/1000,
+                        'last_update': gettext("Just now")
+                    };
+                    if (!_this.get('is_dir')) {
+                        $.extend(renamed_dirent_data, {
+                            'starred': false
+                        });
+                    }
+                    _this.set(renamed_dirent_data)
+                    if (options.success)
+                        options.success(data);
+                },
+                error: function(xhr) {
+                    if (options.error)
+                        options.error(xhr);
+                }
+            });
         }
 
     });
diff --git a/static/scripts/app/views/dialogs/dirent-mvcp.js b/static/scripts/app/views/dialogs/dirent-mvcp.js
index cf1ab0ec13..d366501805 100644
--- a/static/scripts/app/views/dialogs/dirent-mvcp.js
+++ b/static/scripts/app/views/dialogs/dirent-mvcp.js
@@ -162,8 +162,7 @@ define([
 
         formSubmit: function() {
             var _this = this;
-            var form_id = this.$form.attr('id'),
-                path = this.dir.path,
+            var path = this.dir.path,
                 repo_id = this.dir.repo_id,
                 obj_name = this.dirent.get('obj_name'),
                 obj_type = this.dirent.get('is_dir') ? 'dir' : 'file';
@@ -216,7 +215,7 @@ define([
                 'post_url': post_url,
                 'post_data': post_data,
                 'after_op_success': after_op_success,
-                'form_id': form_id
+                'form_id': this.$form.attr('id')
             });
             return false;
         }
diff --git a/static/scripts/app/views/dialogs/dirent-rename.js b/static/scripts/app/views/dialogs/dirent-rename.js
new file mode 100644
index 0000000000..ad6cd1fbfd
--- /dev/null
+++ b/static/scripts/app/views/dialogs/dirent-rename.js
@@ -0,0 +1,79 @@
+define([
+    'jquery',
+    'underscore',
+    'backbone',
+    'common',
+], function($, _, Backbone, Common) {
+    'use strict';
+
+    var DirentRenameDialog = Backbone.View.extend({
+
+        template: _.template($("#dirent-rename-dialog-template").html()),
+
+        initialize: function(options) {
+            this.dirent = options.dirent;
+            this.dir = options.dir;
+
+            this.render();
+            this.$el.modal({appendTo:'#main', autoResize:true, focus:false});
+            $('#simplemodal-container').css({'width':'auto', 'height':'auto'});
+
+            this.$error = this.$('.error');
+            this.$form = this.$('form');
+        },
+
+        render: function() {
+            var title = this.dirent.get('is_dir') ?
+                gettext("Rename Folder") : gettext("Rename File");
+
+            this.$el.html(this.template({
+                form_title: title,
+                dirent_name: this.dirent.get('obj_name')
+            }));
+
+            return this;
+        },
+
+        events: {
+            'submit form': 'formSubmit'
+        },
+
+        formSubmit: function() {
+            var _this = this;
+            var new_name = $.trim(this.$('[name="newname"]').val());
+
+            if (!new_name) {
+                return false;
+            }
+            if (new_name == this.dirent.get('obj_name')) {
+                $.modal.close();
+                return false;
+            }
+
+            var $submit_btn = this.$('[type="submit"]');
+            Common.disableButton($submit_btn);
+
+            this.dirent.rename({
+                newname: new_name,
+                success: function() {
+                    $.modal.close();
+                },
+                error: function(xhr, textStatus, errorThrown) {
+                    var err;
+                    if (xhr.responseText) {
+                        err = $.parseJSON(xhr.responseText).error;
+                    } else {
+                        err = gettext("Failed. Please check the network.");
+                    }
+                    _this.$error.html(err).removeClass('hide');
+                    $("#simplemodal-container").css({'height':'auto'});
+                    Common.enableButton($submit_btn);
+                }
+            });
+            return false;
+        }
+
+    });
+
+    return DirentRenameDialog;
+});
diff --git a/static/scripts/app/views/dirent-grid.js b/static/scripts/app/views/dirent-grid.js
index 6f2d3fc7c0..22947f9716 100644
--- a/static/scripts/app/views/dirent-grid.js
+++ b/static/scripts/app/views/dirent-grid.js
@@ -6,9 +6,10 @@ define([
     'file-tree',
     'app/views/share',
     'app/views/folder-perm',
-    'app/views/dialogs/dirent-mvcp'
+    'app/views/dialogs/dirent-mvcp',
+    'app/views/dialogs/dirent-rename'
 ], function($, _, Backbone, Common, FileTree, ShareView, FolderPermView,
-    DirentMvcpDialog) {
+    DirentMvcpDialog, DirentRenameDialog) {
     'use strict';
 
     app = app || {};
@@ -22,6 +23,7 @@ define([
         dirOpTemplate: _.template($('#grid-view-dir-op-tmpl').html()),
         fileTemplate:  _.template($('#grid-view-file-item-tmpl').html()),
         fileOpTemplate: _.template($('#grid-view-file-op-tmpl').html()),
+        renameTemplate: _.template($("#dirent-rename-dialog-template").html()),
 
         // renameTemplate: _.template($("#grid-rename-form-template").html()),
         // mvcpTemplate: _.template($("#mvcp-form-template").html()),
@@ -86,21 +88,11 @@ define([
         highlight: function() {
             this.$('.img-link').addClass('hl');
             this.$('.text-link').addClass('hl');
-            /*
-            if (!$('.grid-hidden-op:visible').length && !$('#grid-rename-form').length) {
-                this.$('.grid-img-inner-container').addClass('hl');
-            }
-            */
         },
 
         rmHighlight: function() {
             this.$('.img-link').removeClass('hl');
             this.$('.text-link').removeClass('hl');
-            /*
-            if (!$('.grid-hidden-op:visible').length && !$('#grid-rename-form').length) {
-                this.$('.grid-img-inner-container').removeClass('hl');
-            }
-            */
         },
 
         showPopupMenu: function(event) {
@@ -139,6 +131,7 @@ define([
             this.$el.on('click', '.share', _.bind(this.share, this));
             this.$el.on('click', '.mv', _.bind(this.mvcp, this));
             this.$el.on('click', '.cp', _.bind(this.mvcp, this));
+            this.$el.on('click', '.rename', _.bind(this.rename, this));
 
             return false;
         },
@@ -193,6 +186,16 @@ define([
             new DirentMvcpDialog(options);
             this._closeMenu();
             return false;
+        },
+
+        rename: function() {
+            this._closeMenu();
+            var options = {
+                'dir': this.dir,
+                'dirent': this.model
+            };
+            new DirentRenameDialog(options);
+            return false;
         }
 
     });
diff --git a/static/scripts/app/views/dirent.js b/static/scripts/app/views/dirent.js
index ef49ca4aef..1202f1a22d 100644
--- a/static/scripts/app/views/dirent.js
+++ b/static/scripts/app/views/dirent.js
@@ -227,9 +227,7 @@ define([
             };
             $('.cancel', form).click(cancelRename);
 
-            var form_id = form.attr('id');
             var _this = this;
-            var dir = this.dirView.dir;
             form.submit(function() {
                 var new_name = $.trim($('[name="newname"]', form).val());
                 if (!new_name) {
@@ -239,27 +237,10 @@ define([
                     cancelRename();
                     return false;
                 }
-                var post_data = {
-                    'oldname': dirent_name,
-                    'newname': new_name
-                };
-                var post_url = Common.getUrl({
-                    name: is_dir ? 'rename_dir' : 'rename_file',
-                    repo_id: dir.repo_id
-                }) + '?parent_dir=' + encodeURIComponent(dir.path);
-                var after_op_success = function(data) {
-                    var renamed_dirent_data = {
-                        'obj_name': data['newname'],
-                        'last_modified': new Date().getTime()/1000,
-                        'last_update': gettext("Just now")
-                    };
-                    if (!is_dir) {
-                        $.extend(renamed_dirent_data, {
-                            'starred': false
-                        });
-                    }
-                    _this.model.set(renamed_dirent_data); // it will trigger 'change' event
-                };
+
+                var submit_btn = $('[type="submit"]', form);
+                Common.disableButton(submit_btn);
+
                 var after_op_error = function(xhr) {
                     var err_msg;
                     if (xhr.responseText) {
@@ -270,16 +251,8 @@ define([
                     Common.feedback(err_msg, 'error');
                     Common.enableButton(submit_btn);
                 };
-
-                var submit_btn = $('[type="submit"]', form);
-                Common.disableButton(submit_btn);
-                $.ajax({
-                    url: post_url,
-                    type: 'POST',
-                    dataType: 'json',
-                    beforeSend: Common.prepareCSRFToken,
-                    data: post_data,
-                    success: after_op_success,
+                _this.model.rename({
+                    newname: new_name,
                     error: after_op_error
                 });
                 return false;
diff --git a/static/scripts/common.js b/static/scripts/common.js
index ea24b7a349..97bdd6e21c 100644
--- a/static/scripts/common.js
+++ b/static/scripts/common.js
@@ -70,8 +70,8 @@ define([
                 case 'unstar_file': return siteRoot + 'ajax/repo/' + options.repo_id + '/file/unstar/';
                 case 'del_dir': return siteRoot + 'api2/repos/' + options.repo_id + '/dir/';
                 case 'del_file': return siteRoot + 'api2/repos/' + options.repo_id + '/file/';
-                case 'rename_dir': return siteRoot + 'ajax/repo/' + options.repo_id + '/dir/rename/';
-                case 'rename_file': return siteRoot + 'ajax/repo/' + options.repo_id + '/file/rename/';
+                case 'rename_dir': return siteRoot + 'api2/repos/' + options.repo_id + '/dir/';
+                case 'rename_file': return siteRoot + 'api2/repos/' + options.repo_id + '/file/';
                 case 'mv_dir': return siteRoot + 'ajax/repo/' + options.repo_id + '/dir/mv/';
                 case 'cp_dir': return siteRoot + 'ajax/repo/' + options.repo_id + '/dir/cp/';
                 case 'mv_file': return siteRoot + 'ajax/repo/' + options.repo_id + '/file/mv/';