如何保持两种形式的文本框属性？

我已经创建了2个文本输入字段，其中包含required = 1属性。但是，有两种形式可以重定向到两页。我有两个按钮，分别注册和登录，它们有两种形式，点击后可以重定向到他们需要的页面。但是，输入字段仅根据所放置的表单保留所需的属性。我希望输入字段始终对于这两种表单都是必需的。我确实试图将它们放在一切之外，但是这两种形式都没有要求输入。代码：如何保持两种形式的文本框属性？

<div class="button-container"> 

<form action="/login" method="get"> 

    <div> 
     <input placeholder="Username*" class="textbox" required=1 type="text" name="username" id="username" onkeypress="return alpha(event)" maxlength="15"> 
     <br> 
     <input placeholder="Password*" class="textbox" required=1 type="password" name="password" id="password" onkeypress="return pass(event)"> 
    </div> 

    <br><br> 

    <div> 
     <button class="btn " type="submit" >Login</button> 
    </div> 
</form> 

//Form 2, when i click the button, even if the boxes are empty, it redirects :(

<form action="/finishRegister" method="post"> 
    <div> 
     <button class="btn " >Register</button> 
    </div> 
</form> 

<script> 

function alpha(e) { 
var k; 
document.all ? k = e.keyCode : k = e.which; 
return ((k > 64 && k < 91) || (k > 96 && k < 123) || k == 8 || (k >= 48 && k <= 57)); 
} 
function pass(e) { 
var k; 
document.all ? k = e.keyCode : k = e.which; 
return ((k > 0 && k < 32) || (k > 32 && k < 222)); 
} 

</script> 

</div>

Here's a picture so you can see what I'm talking about. I would like, if the user presses register, to redirect to a new page to enter more account information. However, if you already have an account and press login, the username and password will suffice

来源

2016-01-22 dec0mpiled

您重新misundestanding形式是如何工作的。第二种形式将发布到“/ finishRegistering”，但其中没有输入，数据将为空。 – nicooga

有没有办法让这两种形式之一，但也许使用onclick（）注册按钮带我到/ finishRegister？ – dec0mpiled

我组合了这两种形式，并使它在onclick上做功能“redirect（）”，而在函数redirect（）中，我有'window.location.href ='/ finishRegister''。当我点击所有字段为空的注册按钮时，它显示'请填写此字段'消息一秒钟，然后重定向到我想要的页面。这不是我想要的：/ – dec0mpiled

我建议你改变形式的作用dinamicly。如果您检查下面的示例中的控制台，您将看到表单将根据您点击的按钮尝试点击“/ asdf”或“/ qwer”。

$("input[type=submit][data-action]").click(function() { 
 
    var 
 
    $this = $(this), 
 
    $form = $this.parents("form"); 
 

 
    $form.attr("action", $this.data("action")); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<h1>Jquery Way</h1> 
 
<form> 
 
    <input type="submit" data-action="/asdf" value="asdf"></input> 
 
    <input type="submit" data-action="/qwer" value="qwer"></input> 
 
</form> 
 

 
<h1> Angular Way 
 
<div ng-app> 
 
    <form action="{{action}}"> 
 
    <input type="submit" ng-click="action = '/asdf'" value="asdf"></input> 
 
    <input type="submit" ng-click="action = '/qwer'" value="qwer"></input> 
 
    </form> 
 
</div>

来源

2016-01-22 14:42:31 nicooga

你是否缺少一个e.preventDefault（） –

如果你阻止了默认（）'你防止表单提交！ – nicooga

如何保持两种形式的文本框属性？

回答

相关问题