<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
  <!-- Content Header (Page header) -->
  <section class="content-header">
    <h1>
      roles
      <small>roles manager</small>
    </h1>
    <ol class="breadcrumb">
      <li><a href="/"><i class="fa fa-dashboard"></i> 首页</a></li>
      <li class="active">权限管理</li>
    </ol>
  </section>

  <!-- Main content -->
  <section class="content">
    <% if @role.errors.any? %>
        <div class="alert alert-danger alert-dismissible">
          <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
          <h4><i class="icon fa fa-ban"></i> 有<%= @role.errors.count %>个错误:</h4>
          <% errors = "" %>
          <% @role.errors.messages.values.each_with_index { |message, index| errors = errors +
              "#{index+1}.#{message.join(";")}; " } %>
          <%= errors %>
        </div>
    <% end %>
    <!-- /.row -->
    <div class="row">
      <div class="col-md-12">
        <!-- Horizontal Form -->
        <div class="box box-info">
          <div class="box-header with-border">
            <h3 class="box-title">权限管理</h3>
          </div>
          <!-- /.box-header -->
          <!-- BEGIN FORM-->
          <%= form_for(@role, :html => {:class => "form-horizontal", :id => "productform"}) do |f| %>
              <div class="box-body">
                <div class="form-group">
                  <label class="col-sm-3 control-label">*权限名称:</label>
                  <div class="col-md-6">
                    <%= f.text_field :name, class: "form-control", placeholder: "权限名称" %>
                  </div>
                </div>
              </div>
              <div class="form-body">
                <div class="form-group">
                  <label class="col-sm-3 control-label">*权限代码:</label>
                  <div class="col-md-6">
                    <%= f.text_field :code, class: "form-control", placeholder: "权限代码" %>
                  </div>
                </div>
              </div>
              <div class="box-footer">
                <button type="button" onclick="javascript:history.back();" class="btn btn-default">返回</button>
                <button type="submit" class="btn btn-info pull-right">提交</button>
              </div>
              <!-- /.box-footer -->
          <% end %>
          <!-- END FORM-->
        </div>
        <!-- /.box -->
      </div>
    </div>
    <!-- /.row -->
  </section>
  <!-- /.content -->
</div>

<%= content_for :js_bottom do %>
    <!-- END PAGE CONTENT-->
    <script type="text/javascript" charset="utf-8">
      $(function () {
        $("#productform").validate({
          errorElement: 'span', //default input error message container
          errorClass: 'help-block help-block-error', // default input error message class
          focusInvalid: false, // do not focus the last invalid input
          ignore: "",  // validate all fields including form hidden input
          rules: {
            "role[name]": {
              required: true,
              rangelength: [2, 10]
            }
          },
          messages: {
            "role[name]": {
              required: "请输入用户名",
              rangelength: "用户名长度必须是5~15"
            }
          },
          highlight: function (element) { // hightlight error inputs
            $(element).closest('.form-group').addClass('has-error'); // set error class to the control group
          },
          unhighlight: function (element) { // revert the change done by hightlight
            $(element).closest('.form-group').removeClass('has-error'); // set error class to the control group
          },
          success: function (label) {
            label.closest('.form-group').removeClass('has-error'); // set success class to the control group
          },
          submitHandler: function (form) {
            $(form).find(":submit").attr("disabled", true).text("提交中...");
            form.submit();
          }
        });
      });
    </script>
<% end %>