2

シンプルな HTML ページで JavaScript 検証を実行しています。エラーが発生した場合、を使用してページを Error.html にリダイレクトしようとしていますwindow.location.href="Error.html"。

JavaScript ポップにエラーが表示されますが、ページがリダイレクトされません。

JS:

function checkifFormIsFilled() {

    var txtUserName = document.getElementById("txtUserName").value;
    var txtFirstName = document.getElementById("txtFirstName").value;
    var txtLastName = document.getElementById("txtLastName").value;
    var txtEmail = document.getElementById("txtEmail").value;
    var txtArea = document.getElementById("txtArea").value;

    var errMessage = "";
    var errorInForm = false;

    if (txtUserName === "") {
        errMessage = "UserName";
        errorInForm = true;
    }
    if (txtFirstName === "") {
        errMessage += ", First Name";
        errorInForm = true;
    }
    if (txtLastName === "") {
        errMessage += ", Last Name";
        errorInForm = true;
    }
    if (txtEmail === "") {
        errMessage += ", Email";
        errorInForm = true;
    }
    if (txtArea === "") {
        errMessage += ", Address";
        errorInForm = true;
    }


    if (errorInForm == true) {
        errMessage += " are required fields";
        window.alert(errMessage);
        //window.location.href = "Error.html";        
        window.navigate("Error.html");
    }
}

HTML:

<form method="post" style="width: 560px; height: 850px; margin-left: 10px; margin-top:10px">
    <fieldset>
        <legend>New User</legend>
        <table>
            <tr>
                <td>
                    <label>User Name:</label></td>
                <td>
                    <input type="text" id="txtUserName" name="User Name" onblur="checkRequired(this)" maxlength="10" /></td>
            </tr>

            <tr>
                <td>
                    <label>First Name:</label></td>
                <td>
                    <input type="text" id="txtFirstName" name="First Name" maxlength="10" onblur="checkRequired(this)" /></td>
            </tr>

            <tr>
                <td>
                    <label>Last Name:</label></td>
                <td>
                    <input type="text" id="txtLastName" name="Last Name" maxlength="10" onblur="checkRequired(this)" /></td>

            </tr>
            <tr>
                <td>
                    <label>Email: </label>
                </td>
                <td>
                    <input type="text" name="emailInput" id="txtEmail" onblur="checkRequired(this)" /></td>
            </tr>

            <tr>

                <td>
                    <label for="lblAddress">Address</label></td>
                <td>
                    <textarea id="txtArea" name="txtAddress" cols="50" rows="5" maxlength="1000" onblur="checkRequired(this)"></textarea></td>
            </tr>


            <tr>
                <td>Groups</td>
                <td>
                    <select name="selGroups">
                        <option value="c1">Employee</option>
                        <option value="c1">HR</option>
                        <option value="c1">Director</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>Status</td>
                <td>
                    <select name="selStatus">
                        <option value="c1">Active</option>
                        <option value="c2">Inactive</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>
                    <input id="btnSubmit" value="Add User" type="submit" onclick="checkifFormIsFilled();" />
                </td>
                <td>
                    <button id="btnCancel">Cancel</button>
                </td>
            </tr>

        </table>
    </fieldset>

</form>
4

3 に答える 3

2

これは次のことを行う必要があります。

  if (errorInForm == true) {
            errMessage += " are required fields";
            window.alert(errMessage);
            window.location = "Error.html";
        }
于 2012-10-27T12:36:09.797 に答える
1

代わりonsubmitに、要素の属性に関数呼び出しを入れてください。formエラーが見つかった場合は、エラー ページではなく同じページに移動しないように、false を返さなければならない場合もあります。

于 2012-10-27T14:44:02.657 に答える
0

これを試して：

<input id="btnSubmit" value="Add User" type="button" onclick="checkifFormIsFilled();" />

フォームがそれ自体に送信されていたため、リダイレクトは発生していませんでした。

デモ

于 2012-10-27T12:27:59.100 に答える