简单的前台登录

1. 页面

<body>
<div class="mod-page-body">
  <div class="mod-page-main wordwrap clearfix">
    <div class=x-page-container>
      <div class="mod-notfound grid-98">
        <div region="center" style="padding: 0px;" fit="true">
          <div class="error-page">
            <div class="error-page-container">
              <div class="row select-table table-striped error-page-main">
                <form class="form-horizontal " id="login_form">
                  <div class="form-group" style="padding-top: 30px ;" th:if="${userInfo.userUnIde} eq '1024'">
                    <label class="col-sm-3 control-label ">用户标识:</label>
                    <div class="col-sm-8">
                      <input class="form-control" type="text" name="userUnIde" id="input_userUnIde"/>
                    </div>
                  </div>
                  <div class="form-group" style="padding-top: 30px ;" th:if="${userInfo.userUnIde} ne '1024'">
                    <label class="col-sm-3 control-label ">用户唯一:</label>
                    <div class="col-sm-8">
                      <input class="form-control" type="text" name="userUnIde" id="input_userUnIde" th:value="${userInfo.userUnIde}"/>
                    </div>
                  </div>
                  <div class="form-group">
                    <label class="col-sm-3 control-label">代码:</label>
                    <div class="col-sm-8">
                      <input class="form-control" type="text" name="userInfoCode" id="input_userInfoCode" th:value="${userInfo.userInfoCode}"/>
                    </div>
                  </div>
                  <div class="form-group">
                    <label class="col-sm-3 control-label">姓名:</label>
                    <div class="col-sm-8">
                      <input class="form-control" type="text" name="userInfoName" id="input_userInfoName" th:value="${userInfo.userInfoName}"/>
                    </div>
                  </div>
                  <div class="form-group">
                    <label class="col-sm-3 control-label">用户所属机构:</label>
                    <div class="col-sm-8">
                      <input class="form-control" type="text" name="userInfoOrgUnitId" id="input_userInfoOrgUnitId" th:value="${userInfo.userInfoOrgUnitId}"/>
                    </div>
                  </div>
                  <div class="form-group">
                    <label class="col-sm-3 control-label">全部机构:</label>
                    <div class="col-sm-8">
                      <input class="form-control" type="text" name="userInfoOrgUnitIds" id="input_userInfoOrgUnitIds" th:value="${{userInfo.userInfoOrgUnitIds}}"/>
                    </div>
                  </div>
                  <div class="form-group">
                    <label class="col-sm-3 control-label">用户角色:</label>
                    <div class="col-sm-8">
                      <input class="form-control" type="text" name="userInfoOrgRole" id="input_userInfoRoleIds" th:value="${{userInfo.userInfoRoleIds}}"/>
                    </div>
                  </div>
               
                </form>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

2. js

<script>

  $("#button_submit").click(function () {
    var userUnIde= $("#input_userUnIde").val();
    var userInfoCode = $("#input_userInfoCode").val();
    var userInfoName = $("#input_userInfoName").val();
    var userInfoOrgUnitId = $("#input_userInfoOrgUnitId").val();
    var userInfoOrgUnitIds = $("#input_userInfoOrgUnitIds").val();
    var userInfoRoleIds =  $("#input_userInfoRoleIds").val();

    if (!userUnIde || userUnIde == "") {
      showMsg("请输入用户标识");
      return false;
    }
    if (!userInfoCode || userInfoCode == "") {
      showMsg("请输入编码");
      return false;
    }
    if (!userInfoName || userInfoName == "") {
      showMsg("请选择用户名");
      return false;
    }
    if (!userInfoOrgUnitId || userInfoOrgUnitId == "") {
      showMsg("用户所属机构");
      return false;
    }
    if (!userInfoOrgUnitIds || userInfoOrgUnitIds == "") {
      showMsg("所属全部机构");
      return false;
    }
    if (!userInfoRoleIds || userInfoRoleIds == "") {
      showMsg("用户角色");
      return false;
    }


    var user = {};
    user.userUnIde = userUnIde;
    use ["userInfoCode"] = userInfoCode;
    user["userInfoName"] = userInfoName;
    user["userInfoOrgUnitId"] = userInfoOrgUnitId;
    user["userInfoRoleIds"] = userInfoRoleIds;
    $.ajax({
      type: "post",//方法类型
      dataType: "json",//预期服务器返回的数据类型
      url: ctx + "userinfo/userlogin",//url
      data: user,
      success: function (result) {
        if (result.success) {
          alert(result.message);
        } else {
          alert(result.message);
        }
      }
    })

  });

  //错误信息提醒
  function showMsg(msg) {
    alert(msg);
  }
</script>

3.后台接受前台的传值并判断  

  

原文地址:https://www.cnblogs.com/zhukaixin/p/11974890.html