2

このプラグインを使用してフォームを検証しています。

私のフォームには、パスワード入力と「パスワードを表示」チェックボックスがあります。ユーザーが [パスワードの表示] をクリックすると、入力がパスワード タイプからテキストに変わります。

$('#show_password').off();
$('#show_password').on('click', function() {
  var change = '';
  var $input = $('#cpassword');
  if ($(this).is(':checked')) {
    change = 'text';
  } else {
    change = 'password';
  }
  var rep = $('<input type="' + change + '" />')
    .attr('id', $input.attr('id'))
    .attr('name', $input.attr('name'))
    .attr('class', $input.attr('class'))
    .val($input.val())
    .insertBefore($input);
  $input.remove();
  $input = rep;
  $('#frm_user_details').formValidation('revalidateField', 'password');
});

したがって、基本的に入力タイプが変更され（ただし、同じ名前が保持されます）、フィールドを再検証する必要がありますが、機能していません。

4

2 に答える 2

1

1 つの問題は、パスワード フィールドのすべての属性も複製していることが原因である可能性がありますid。また、w3 標準に従って、同じ ID 属性を持つ 2 つの要素を持つべきではありません。

したがって、以下のコードを試すことができます：

$('#show_password').off();
$('#show_password').on('click', function() {
  var change = '';
  var $input = $('#cpassword');
  if ($(this).is(':checked')) {
    change = 'text';
  } else {
    change = 'password';
  }
  var rep = $('<input type="' + change + '" />')
    .attr('id', $input.attr('id')+'_text')
    .attr('name', $input.attr('name'))
    .attr('class', $input.attr('class'))
    .val($input.val())
    .insertBefore($input);
  $input.remove();
  $input = rep;
  $('#frm_user_details').formValidation('revalidateField', 'password');
});
于 2015-06-16T18:22:55.813 に答える
1

複雑なフォームを操作する場合、フィールドがフォームに動的に追加 (またはフォームから削除) される場合があります。新しく追加されたフィールドも検証する必要があります。

したがって、フィールドを削除して新しいフィールドを作成した後formavalidation、メソッドを使用して追加する必要がありますaddField。

次のコードを参照してください。

$('#show_password').off();
$('#show_password').on('click', function () {
    var change = '';
    var $input = $('#cpassword');
    if ($(this).is(':checked')) {
        change = 'text';
    } else {
        change = 'password';
    }

    var rep = $('<input type="' + change + '" />')
        .attr('id', $input.attr('id'))
        .attr('name', $input.attr('name'))
        .attr('class', $input.attr('class'))
        .val($input.val())
        .insertBefore($input);

    $input.remove();
    $input = rep;

    // Add the new field to the plugin
    // For the second param, you can either use the field object or its name.
    // See
    //    http://formvalidation.io/api#add-field
    $('#frm_user_details').formValidation('addField', $input);

    // Finaly revalidate it
    $('#frm_user_details').formValidation('revalidateField', 'password');
});

作業例:

参考文献:

于 2015-06-16T20:12:07.903 に答える