Question

我想通过我们的twig文件中的JavaScript函数添加checkPasswordMatch（），以便在注册表单中进行第一次第二次密码匹配。

简单的HTML FORM这是有效的，但在Twig Form中这不起作用。我以简单的形式添加如下： -

<div">
  <input type="password" id="txtNewPassword" />
</div>
<div>
  <input type="password" id="txtConfirmPassword" onKeyUp="checkPasswordMatch();" />
</div>

这很好。

和Java脚本： -

<script>
  function checkPasswordMatch() {
   var password = $("#txtNewPassword").val();
   var confirmPassword = $("#txtConfirmPassword").val();
   alert(password);
   if (password != confirmPassword)
    $("#divCheckPasswordMatch").html("Passwords do not match!");
   else
    $("#divCheckPasswordMatch").html("Passwords match.");
 }
</script>

这是我的Twig文件，我希望这个功能添加： -

<label for="username"><strong>Password</strong>
{{ form_widget(form.plainPassword.first,{'id':'txtNewPassword' }) }}
</label>
<label for="username"><strong>Confirm Password</strong>
{{ form_widget(form.plainPassword.second,{'id':'txtConfirmPassword', 'onKeyUp'  :'checkPasswordMatch()' }) }}
</label>

任何人都知道如何以这种树枝形式添加这个onKeyUp函数？

谢谢！

Answer 1

  $("#txtNewPassword, $txtConfirmPassword").on(function(event) {
    var matchMsg = $("#txtNewPassword").val() == $("#txtConfirmPassword").val() 
                   ? 'Passwords match.'
                   : 'Passwords do not match';
    $("#divCheckPasswordMatch").html(matchMsg);
  });

你不应该在twig模板中绑定JS功能，而应该在你的javascripts中绑定代码未在所有部分上进行测试，但应该向您展示这个想法。

如果此代码看起来很奇怪，请检查http://api.jquery.com/on/以更好地理解javascript事件和绑定。

html.twig表单功能

1 个答案: