trustieforge/app/views/projects/_join_project.html.erb

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title><%= l('project.join.title')%></title>
  <style>
      #popbox{ font-size:12px; font-family:"微软雅黑","宋体"; line-height:1.9; background:#fff; font-style:normal;}
      #popbox div,html,img,ul,li,p,body,h1,h2,h3,h4,p,a,table,tr,td,fieldset,input,span{ margin:0; padding:0;}
      #popbox div,img,tr,td{ border:0;}
      #popbox table,tr,td{border:0; cellspacing:0; cellpadding:0;}
      #popbox ul,li{ list-style-type:none}
      #popbox .cl{ clear:both; overflow:hidden; }
      #popbox a{ text-decoration:none; }
      #popbox a:hover{ }

      .alert_box {width:400px;height:200px;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:400px;height:200px;}
      .alert .C{width:388px;height:200px;position:absolute;left:5px;top:5px;  }
      .C_top{ margin-top:20px; width:368px; height:100px; background:#e9e9e9; padding:0px 60px  !important;  }
      .C_top h2{ color:#1c1d1d; font-size:24px; font-style:normal; font-weight:normal;}
      .C_top p{ color:#a9aaaa; line-height:22px;}
      .C_form{ margin:20px 0 0 60px;}
      .C_form ul li{ font-size:14px; color:#3f3a39; line-height:30px; padding-left: 60px;}
      .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:140px;}
      .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;}
  </style>
  <script type="text/javascript">
      function submit_form(obj)
      {
          $("#new-watcher-form").submit();
//          alert("申请成功");
      }

      function hidden_join_course_form()
      {
          hideModal($("#popbox"));
      }
  </script>
</head>

<body>
<div id="popbox">
  <div class="C"  >
    <div class="C_top">
      <h2><%= l('project.join.title')%></h2>
      <p style="width: 385px"><%= l('project.join.description')%></p>
    </div>
    <div class="C_form">
      <%= form_tag({:controller => 'applied_project',
                  :action => 'applied_join_project'},
                  :remote => true,
                  :method => :post,
                  :id => 'new-watcher-form') do %>
          <ul>
            <li style="padding-top: 15px;">
              <span class="tips"><%= l('project.join.id.label')%></span>
              <input type="hidden" name="project_join" value="1">
              <input type="hidden" name="user_id" value="<%= User.current.id %>">
              <input class=" width190" name="project_id" id="project_id" type="text" value="" >
              <input type="text" style="display: none"/>
            </li>
            <li class="mB5" style="width: 260px"><%= l('project.join.id.tips')%></li>
            <li>
              <a href="#" class="btn" style="margin-left: 50px;" onclick="submit_form(this);">
                <%= l(:label_apply_project) %>
              </a>
              <a href="#" class="btn" style="margin-left: 20px;" onclick="hideModal(this);">
                <%= l(:button_cancel) %>
              </a>
            </li>
          </ul>
      <% end%>
    </div>
  </div><!---- C end---->
</div>
</body>
</html>