Подтверждение пароля jqGrid

Question

Я пытаюсь создать подтверждение ввода пароля в форме jqGrid, но я считаю, что я делаю это неправильно.Причина этого в том, что в моей реализации, когда вы редактируете уже определенного пользователя, оба поля (password и password_confirm) содержат пароль пользователя со звездочками.

В этом нет ничего плохого, но я считаю, что лучше иметь оба поля пустыми при редактировании и проверять их только тогда, когда они содержат значения.Это часть кода:

colNames: ["Имя", "Имя пользователя", "Электронная почта", "Пароль", "Подтверждение пароля"],

colModel: [{имя: «имя», индекс: «имя», редактируемые: истина, правила редактирования: {обязательный: истина}},

другие поля ....

{имя: «пароль», индекс: «пароль», редактируемый: истина, тип редактирования: «пароль», скрытый: истина, правила редактирования: {edithidden: истина, обязательный: истина}}, {имя: «пароль подтверждения», индекс: «Подтверждение пароля ", редактируемый: true, edittype:" пароль ", hidden: true, editrules: {edithidden: true, обязательный: true}},

Как вы можете видеть, я определил 2 объекта,один для действительного пароля и другой для подтверждения, и когда я заполняю сетку, я возвращаю для обоих полей одно и то же значение.

Есть мысли по улучшению реализации?

Большое спасибо.

Answer 1

долго искали ответ на этот вопрос, и я придумал собственное решение.Я не хотел добавлять поле в БД - Redis в моем случае - поэтому мне нужно было создать поле для проверки пароля на лету и убедиться, что оно соответствует первому полю пароля.Поле проверки пароля будет отправлено на сервер, это не ошибка, а особенность.

Вкл с кодом.

Первая функция, которую мы определили, это та, которая будетсоздайте поле проверки пароля и добавьте его к полю исходного пароля:

    function createPassCheck(el) {
            // Create the containing table row
            var passCheck = $("<tr></tr>").addClass("FormData")
                    .attr({
                            id: "tr_passwordCheck",
                            rowpos: 20
                    });
            // Create a cell for the label and add it to the row
            var passCheckLabelTd = $("<td></td>")
                    .addClass("CaptionTD").text("Password Check");
            passCheck.append(passCheckLabelTd);
            // Prepare the cell for the input box. All
            // the cells have a non breaking space, we add
            // one as well to keep aligned. We then add it to the row.
            var passCheckTd = $("<td>&nbsp;</td>")
                    .addClass("DataTD");
            passCheck.append(passCheckTd);
            // Create an input box, and add it to the input cell 
            var passCheckInput = $("<input></input>")
                    .addClass("FormElement ui-widget-content ui-corner-all")
                    .attr({
                            id: "passwordCheck",
                            name: "passwordCheck",
                            role: "textbox",
                            type: "password"
                    });
            passCheckTd.append(passCheckInput);
            // Finally append the row to the table, we have been called after
            // the creation of the password row, it will be appended after it.
            var tbodyEl = el.parentNode.parentNode.parentNode;
            tbodyEl.appendChild(passCheck[0]);
    }

Прежде чем мы сможем двигаться дальше, нам нужно добавить еще одну функцию, ключевую: именно она будет проверять, если два пароляmatch.

    function customPassCheck(cellvalue, cellname) {
            // Get a reference to the password check input box. You see
            // the 'tr_passwordCheck' id we are using? We set that id in
            // the function "createPassCheck".
            var passCheckVal = $("#tr_passwordCheck input").val()

            // If both fields are empty or the passwords match
            // we can submit this form.
            if (
                    (cellvalue == "" && passCheckVal == "")
                    ||
                    cellvalue == passCheckVal      
               ) {
                    return [true, ""];
            }

            // Can you guess why we are here?
            return [false, "Password and password check don't match."];
    }

Наконец, функция, которую мы будем использовать, чтобы при редактировании пароль был пустым, мы сделаем это, зарегистрировавшись в качестве пользовательского средства форматирования.

    function customPassFormat(cellvalue, options, rowObject) {
            // When asked to format a password for display, simply
            // show a blank. It will make it a bit easier when
            // we editing an object without changing the password.
            return "";
    }

Теперь мы можем определитьВведите поле пароля в jqGrid и сделайте его особенным:

jQuery("#crud").jqGrid({
....
....
colModel:[
  ....
  {
     name:'password',
     index:'password', 
     width:80,
     align:"right",
     editable:true,
     // It is hidden from the table view... 
     hidden: true,
     editrules:{
       // ...but we can edit it from the panel
       edithidden: true, 
       // We are using a custom verification
       custom:true, 
       // This is the function we have created
       // to verify the passwords
       custom_func: customPassCheck
     },
     edittype: 'password',
     // Our custom formatter that will blank the 
     // password when editing it
     formatter: customPassFormat,
     editoptions: {
       // This is where the magic happens: it will add
       // the password check input on the fly when editing
       // from the editing panel.
       dataInit: createPassCheck  
     }
   },
....
....

Вот и все!

Фабио