Как изменить действие формы в соответствии с выбранным параметром? - PullRequest
Новая
       47

Как изменить действие формы в соответствии с выбранным параметром?

0 голосов
/ 19 сентября 2019

Когда я изменяю действие формы, используя javascript в файле login.ejs, но оно не переопределяет действие формы, может кто-нибудь объяснить, почему оно не работает? В бэкэнде я использовал nodejs express и на основе выбранной опции я хочу изменитьформа действия, но она не работает, она принимает по умолчанию то, что я дал в действии. 

<script>
function changeAction() {
    const location = document.getElementById("category_id").value;
    if (loction == "manager") {
        document.myform.formaction = "/manager/login";
        return true;

    }
    if (location == "admin") {
        document.myform.formaction  = "/admin/login";
        return true;
    }

    return false;
}
</script>
<div class="container" style="border: solid black; padding-top: 25px; margin-top: 25px">
    <div class="container-fliud d-flex justify-content-center">
        <h1><strong>Login</strong></h1>
    </div>
    <hr>
    <form id="form_id" action="/login" name="myform" method="POST" class="was-validated" onsubmit="return changeAction()">
        <div class="form-group">
            <label><strong>Category</strong></label>
            <select class="form-control" id="category_id" name="sellist" required>
                <option disabled selected value>select an option</option>
                <option value="admin">Admin</option>
                <option value="manager">Manager</option>
                <option value="user">User</option>
            </select>
        </div>
        <div class="form-group">
            <label><strong>Email</strong></label>
            <input type="email" class="form-control" id="fname" name="email" placeholder="enter your email name" required>
        </div>
        <div class="form-group">
            <label for="password"><strong>Password</strong></label>
            <input type="password" id="password" class="form-control" name="password" placeholder="enter your password" required>
        </div>
        <div class="form-group">
            <button type="submit" id="login" class="btn btn-primary" style="width: 100%">Login</button>
        </div>
        <div class="form-group">
            <h5>Don't have account ? <a href="/admin/register">Sign Up</a></h5>
        </div>
    </form>
</div>

1 Ответ

0 голосов
/ 19 сентября 2019

  1. Вы используете onsubmit и action оба. Обработчики событий запускаются перед действиями по умолчанию.Они могут отменить действия по умолчанию.

    Поскольку обработчик onsubmit всегда возвращает false, если не admin или manager, action = '/ login' никогда не работает.

    отправить и сформировать действие вместе

  2. Неправильное написание местоположения. 

<script>
function changeAction() {
    const location = document.getElementById("category_id").value;
    if (location == "manager") {
        document.myform.formaction = "/manager/login";
        console.log(document.myform.formaction )
        return true;

    }
    if (location == "admin") {
        document.myform.formaction  = "/admin/login";
        console.log(document.myform.formaction )
        return true;
    }

}
</script>
<div class="container" style="border: solid black; padding-top: 25px; margin-top: 25px">
    <div class="container-fliud d-flex justify-content-center">
        <h1><strong>Login</strong></h1>
    </div>
    <hr>
    <form id="form_id" action="/login" name="myform" method="POST" class="was-validated" onsubmit="return changeAction()">
        <div class="form-group">
            <label><strong>Category</strong></label>
            <select class="form-control" id="category_id" name="sellist" required>
                <option disabled selected value>select an option</option>
                <option value="admin">Admin</option>
                <option value="manager">Manager</option>
                <option value="user">User</option>
            </select>
        </div>
        <div class="form-group">
            <label><strong>Email</strong></label>
            <input type="email" class="form-control" id="fname" name="email" placeholder="enter your email name" required>
        </div>
        <div class="form-group">
            <label for="password"><strong>Password</strong></label>
            <input type="password" id="password" class="form-control" name="password" placeholder="enter your password" required>
        </div>
        <div class="form-group">
            <button type="submit" id="login" class="btn btn-primary" style="width: 100%">Login</button>
        </div>
        <div class="form-group">
            <h5>Don't have account ? <a href="/admin/register">Sign Up</a></h5>
        </div>
    </form>
</div>
...