diff --git a/app/views/courses/_join_private_course.html.erb b/app/views/courses/_join_private_course.html.erb
index 4cc8b9fbf..8e1e1c421 100644
--- a/app/views/courses/_join_private_course.html.erb
+++ b/app/views/courses/_join_private_course.html.erb
@@ -11,10 +11,10 @@
       ul,li{ list-style-type:none}
       .cl{ clear:both; overflow:hidden; }
       a{ text-decoration:none; }
-      a:hover{ }
+      a:hover{}
 
       .alert_box {width:488px;height:550px;position:fixed;z-index:1002;left:50%;top:40%;margin:-215px 0 0 -300px;  background:#fff; -moz-border-radius:5px;  -webkit-border-radius:5px;  border-radius:5px; box-shadow:0px 0px 8px #194a81; padding:5px; overflow:auto; }
-      #popbox{width:488px;height:308px;}
+      #popbox{width:488px;height:368px;}
       .alert .C{width:476px;height:296px;position:absolute;left:5px;top:5px;  }
       .C_top{ margin-top:20px; width:368px; height:100px; background:#e9e9e9; padding:0px 60px; }
       .C_top h2{ color:#1c1d1d; font-size:24px; font-style:normal; font-weight:normal;}
@@ -22,12 +22,15 @@
       .C_form{ margin:20px 0 0 60px;}
       .C_form ul li{ font-size:14px; color:#3f3a39; line-height:30px; }
       .C_form ul li input{ margin-left:20px; border:0px; border:1px solid #e1e1e1; color:#898989; padding-left:5px; -moz-border-radius:5px;  -webkit-border-radius:5px;  border-radius:5px; padding: 0 !important; }
-      .C_form ul li.mB5{ color:#898989; font-size:12px; padding-left:90px;}
+      .C_form ul li.mB5{ color:#898989; font-size:12px; padding-left:97px;}
       .width190{ width:190px; height:26px; border-color:#e1e1e1;}
       .C_form a{ font-size:12px; color:#15bccf; float:left; display:block; height:40px; width:200px;  margin-top:25px;}
       .C_form a:hover{ text-decoration:underline;}
-      .C_form a.btn{ display:block; width:100px; height:36px; padding-top:4px; text-align: center; background:#15bccf; color:#fff; font-size:14px; margin:20px 20px 0 95px;}
-      .C_form a.btn:hover{ background:#ff821d;}
+      .C_form a.btn_join{ display:block; width:100px; height:36px; padding-top:4px; text-align: center; background:#269ac9; color:#fff; font-size:14px; margin:20px 20px 0 95px;}
+      .C_form a.btn_join:hover{ background:#297fb8; text-decoration: none;}
+      .C_form a.btn_cancel{ display:block; width:100px; height:36px; padding-top:4px; text-align: center; background:#c1c1c1; color:#fff; font-size:14px; margin:20px 20px 0 95px;}
+      .C_form a.btn_cancel:hover{ background:#717171; text-decoration: none;}
+      .IDType {border:1px solid #e1e1e1; outline: none; width: 65px; height: 25px;}
   </style>
   <script type="text/javascript">
       function submit_form(obj)
@@ -59,7 +62,7 @@
             <li>
               <input type="text" style="display: none"/> <!--阻止表单自动填充 -->
               <input type="password" style="display: none"/> <!--阻止表单自动填充 -->
-              <span class="tips">课&nbsp;程&nbsp;ID：</span>
+              <span class="tips" style="width: 72px; display: inline-block;">课&nbsp;程&nbsp;ID：</span>
               <input class=" width190" name="object_id" id="object_id" type="text" value="" >
               <input type="text" style="display: none"/>
             </li>
@@ -68,11 +71,19 @@
               <span class="tips">密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码：</span>
               <input class=" width190" type="password" name="course_password" id="course_password" value="" >
             </li>
+            <li style="margin-top: 30px;">
+              <span style="margin-right: 20px;">身&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;份：</span>
+              <select class="IDType">
+                <option>教师</option>
+                <option>教辅</option>
+                <option>学生</option>
+              </select>
+            </li>
             <li>
-              <a href="javascript:" class="btn" style="margin-left: 50px;" onclick="submit_form(this);">
+              <a href="javascript:" class="btn_join" style="margin-left: 50px;" onclick="submit_form(this);">
                 <%= l(:label_new_join)  %>
               </a>
-              <a href="javascript:" class="btn" style="margin-left: 20px;" onclick="hideModal(this);">
+              <a href="javascript:" class="btn_cancel" style="margin-left: 20px;" onclick="hideModal(this);">
                 <%= l(:button_cancel)%>
               </a>
             </li>
diff --git a/app/views/courses/join_private_courses.js.erb b/app/views/courses/join_private_courses.js.erb
index d1bce7d86..8a1680030 100644
--- a/app/views/courses/join_private_courses.js.erb
+++ b/app/views/courses/join_private_courses.js.erb
@@ -1,6 +1,6 @@
 $('#ajax-modal').html('<%= escape_javascript(render :partial => 'join_private_course') %>');
 showModal('ajax-modal', '540px');
-$('#ajax-modal').css('height','330px');
+$('#ajax-modal').css('height','390px');
 //$('#ajax-modal').siblings().remove();
 $('#ajax-modal').siblings().hide();
 $('#ajax-modal').before("<span style='float: right;cursor:pointer;padding-left: 513px;'>" +