2

struts2 を使用して Web ページを開発しています。ユーザー ID/パスワードのテキストフィールドを赤い枠で強調表示し、ユーザー名/パスワードが間違っている場合にエラーメッセージを表示したい

<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<html>
<head>
<title>Stock Portfolio Management</title>
</head>
<FONT COLOR=black><marquee BEHAVIOR=ALTERNATE><h1 ALIGN="center">STOCK PORTFOLIO</h1></marquee></FONT>
 <style type="text/css">
body
{
/* background: url(./image/9.jpg) no-repeat fixed;  */
    /* -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover; */
    postion:fixed
}
img
{
position:fixed;
bottom: 20%;
left: 20%;
margin-top: -50px;
margin-left: -100px;
}
#login
{
position:fixed;
top: 20%;
left: 50%;
margin-top: -50px;
margin-left: -100px;
} 
.errors {
background-color:#FFCCCC;
    border:1px solid #CC0000;
    width:350px;
    margin-bottom:2px;
    position:relative;
    left:0pt;
    bottom:10pt;

}

.errors li{ 
    list-style: none; 
}
</style>
<body>
<img src="image/9.jpg" height="250" width="300">
<s:form id="login" action="authenticate" method="post">
    <s:textfield name="userid" key="User Id" size="25" />
    <s:password name="password" label="Password" size="25" />

    <s:if test="hasActionErrors()">
    <div class="errors">
      <s:actionerror/>
   </div>
   </s:if> 

   <s:submit method="CheckUser" value="Login" align="center" />  <s:reset value="Reset" align="center" />
    <a href="<s:url action="moveregister" method="execute"/>">New User?</a>
    &nbsp
    <a href="<s:url action="forgotpassword" method="forgot"/>">Forgot Password?</a>
</s:form>
</body>
</html>

これは私のアクションクラスにあるものです:

addActionError(getText("User Id which you provided doesnt exists"));
return "error";

.errorsご覧のとおり、エラーをキャッチし、上記の CSS を使用してフォーマットし、 を使用して画面に表示しています。

userIDしかし、それがエラーの場合は赤い枠のフィールド、エラーの場合はパスワードフィールドでエラーフィールドを強調表示したいと思います。グーグルを試してみたところ、テンプレートの編集class/<s:fielderror>など、多くのことがわかりましたが、作成できませんでした。

4

1 に答える 1

3

まず、すべてのHTMLを本来あるべき場所に配置します。

次に、フィールドを赤い境界線で装飾することは、通常、検証エラーを示すための規則です。たとえば、不正な形式の(または範囲外の)日付、数値フィールドの文字、空のままの必須フィールドなどです。 Struts2は、タグValidationInterceptorのフィールドごとに1つのエラーを追加して、できればXMLを介して実行する必要があります。<s:fielderrors/>ケースは異なります。検証に合格し、アクションのメソッドを実行しますが、結果は「ユーザーが認証されていません」です。ほとんどのWebアプリケーションでは、ユーザー名とパスワードのフィールドを装飾せずに、赤いエラーメッセージが表示されます。 (空のままにした場合は、代わりにそれらをデコアする必要があります...)。

しかし、それらをデコアしたい場合は、Javascriptを使用しないのはなぜですか?

これをCSSスタイルで追加します。

.decoratedErrorField{
    border:2px solid red;
}

フィールドにIDを追加します。

<s:textfield name="userid" id="userid" key="User Id" size="25" />
<s:password name="password" id="password" label="Password" size="25" />

エラーが発生した場合は、IDでフィールドを取得し、エラークラスを追加してフィールドをデコアします。ページの最後、直前にこれを追加します</body>

<s:if test="hasActionErrors()">
    <script type="text/javascript">
        //<![CDATA[                 
            document.getElementById("userid").className += " decoratedErrorField ";
            document.getElementById("password").className += " decoratedErrorField ";
        //]]>
    </script>       
</s:if>
于 2012-12-17T09:39:30.330 に答える