5/16 近期工作 ajax实时监测input内容并返回id对应名称 添加不同身份的特殊后台入口 完成教师课程内容管理部分

一、ajax实时监测input内容并返回id对应名称：

rails中实现ajax的原理就是通过jquery来监测需要监测的组件的动作，一般是按钮和click，通过js发送一个请求到某一个路径，rails再通过路由表路由到对应的controller方法，其中调用一个同名js.erb模板文件，通过里面的js代码来刷新页面。下面简单说一下我的实现过程：

之前后台里的各种表单都是通过输入对应的id来完成的，不过这样给用户带来了一定的不便，id不小心填错了就比较麻烦，我希望在输入框后面添加一个动态的提示，输入id后在旁边显示这个id对应的资源的名称。以将关键字添加到某一课程这一页面的表单为例，输入课程id，提示课程名：

先在表单页面加入jquery代码，完成监测和请求功能，这里因为是监测输入框变化，所以是bind函数，监测到变化后记录文本框中的值，并发送一个get请求，把id值传递到指定路径：

<script>
  $(function(){  
  
    $('#course_keyword_association_course_id').bind('input propertychange', function() {
      var course_id = $(this).val()
      $.get("/keywords/ajaxnames/"+course_id,
      function(data,status){}); 
    }); 
  });
  
</script>

路由部分省略不写了，路由到了我所指定的函数：

  def ajaxnames
    @course_id = params[:id]
    respond_to do |format|
        format.js{}
    end
  end

这里的操作非常简单，只需要解析一下传过来的值，并且调用js就可以，这样rails会自动执行这个函数的同名js.erb文件：

$("#course_name").html("<%= escape_javascript(render(:partial => "keywords/names", :locals => {:course_id => @course_id})) %>");

其中的代码通过使原来页面的指定部分修改局部变量重新渲染的方式来完成刷新：

编辑局部模板：

<%if !course_id.nil?%>
<%  if !Course.where("id=?",course_id).empty?%>
<%    course = Course.find(course_id)%>
        <span>
            <%= course.course_name%>
        </span>
<%  else%>
        <span>
            无此课程
        </span>
<%  end%>
<%else%>
    <span>
    </span>
<%end%>

这样就完成了这一功能。

二、添加不同身份的特殊后台入口

管理员后台基本完成了，但是现在的问题是还需要通过在地址栏输入特定地址来进入界面，这显然是不靠谱的，所以需要在管理员登录后的个人空间界面添加一个入口按钮，观察了一下直接放在侧边栏就好了。

代码：

<%if @user.user_role == "teacher"%>
	<hr/>
	<li><a href="<%= teachers_teachers_space_path(@user.id)%>"><i class="icon-cog"></i><span class="hidden-tablet"> 课程内容管理</span></a></li>
<%end%>
<%if @user.user_role == "admin"%>
	<hr/>
	<li><a href="<%= admins_own_space_path%>"><i class="icon-cog"></i><span class="hidden-tablet"> 平台管理后台</span></a></li>
<%end%>

通过判断当前用户的身份来决定展示哪些按钮，这里也写了接下来要用到的教师的课程管理。

同时在adminsController里添加了拦截器来保证用户权限：

三、完成教师课程内容管理部分

这一块说起来并不难，进入后展示一个授课列表，每个课程后面跟三个按钮，分别定向到指定课程的问答、专栏、资源，教师可以查看详情，可以删除不合规的知识。

技术上，通过局部渲染对应的局部模板来实现这一功能。

<% provide(:title, "#{@course.course_name}—问答管理") %>
<div id="container-fluid-full"> 

    <div id="row-fluid">
      <%= render :partial => "users/aside" %>
      <div id="content" class="span8">
        <p id="notice"><%= notice %></p>
        
        <h1><%=@course.course_name%>—全部问答</h1>
        <hr>
        
        <%= render :partial => "questions/question_list", :locals => { :questions => @question } %>
        
        <br>
        <hr>
        <%= link_to '返回',  teachers_teachers_space_path(@teacher.id) %>
      </div>
    </div>
    
    
</div> 

<div class="clearfix"></div>

（css还没调好）