Концепция - Создание проверки на стороне клиента из объекта PHP

Question

Я создаю свою собственную структуру MVC, и я думал о способе «автоматического» контроля валидации на стороне клиента.

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

$this->addElement('text', 'myInput'); 
$this->elements['myInput']->addValidators(array 
    'length' => array('min' => 5, 'max' => 10), 
    'number' => array('decimals' => 0) 
)); 

В приведенном выше примере, я создал ввод текста с именем «myInput» величина которого, в соответствии с валидаторов я добавил:

• Должно быть> = чем 5 символов
• Должно быть < = чем 10 символов
• должно быть числом
• не должны иметь десятичных (ИНТ только)

Когда я получаю представление формы и вызвать функцию проверки, все хорошо работает на стороне сервера. Однако меня беспокоило необходимость повторной проверки на стороне клиента вручную. Мне не нравится дублировать одну и ту же функциональность, поэтому я придумал способ создания моей проверки на стороне клиента из объекта формы PHP, который уже существует.

Это связано с тем, что функции проверки подлинности JS имеют ту же функциональность, что и валидаторы PHP, и вызывают функцию getClientValidatiors() для элементов, чтобы создать соответствующий объект в теле, который присоединяет события JS.

ПРИМЕЧАНИЕ: Пожалуйста, игнорируйте ошибки JS, я написал это как концепцию и ничего не тестировал.

функции валидатор

JS будет выглядеть так:

function lengthValidator(options, value, id){ 
    //Validate according to the options. Return true if valid or false otherwise as well as calling printError function with the message and the id 
} 

function numberValidator(options, value, id){ 
    //Validate according to the options. Return true if valid or false otherwise as well as calling printError function with the message and the id 
} 

function printError(error, id){ 
    //Might add more functionality later 
    document.getElementById(id).innerHTML = error; 
} 

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

<?php echo $this->form->elements['myInput]; //The HTML ?> 
<?php echo $this->form->elements['myInput]->getClientValidators(); //The JS ?> 

До формирования представления, то результат будет выглядеть например:

<input type="text" name="myInput" id="myInput"/> 
<span class="error" id="myInput-error"></span> 

<script> 
document.getElementById('myInput').addEventListener('blur', function(e){ 
    var value = e.value; 
    var id = e.id + '-error'; 

    if(lengthValidator({min:5, max:10}, value, id) != true){ 
     return; 
    } 
    if(numberValidator({decimals:0}, value, id) != true){ 
     return; 
    } 
}); 
</script> 

Я ищу большие пальцы или предложения о том, как это может работать с другой метод. Если у вас есть какие-то мысли, я бы хотел их услышать!

Answer 1

Рассмотрите возможность написания спецификации валидации таким образом, чтобы ее можно было автоматически проверить в JavaScript и PHP.

$input_schema = array(
    "foo" => array(
     "type" => "number", 
     "decimals" => 0, 
     "length" => array(
      "min" => 5, 
      "max' => 10 
     ) 
    ) 
); 

Тогда в JS вы можете сделать:

var input_schema = <?php echo json_encode($input_schema);?>; 
function validate_input(form_values) { 
    for (var key in input_schema) { 
     validate_property(input_schema[key], form_values[key]); 
    } 
} 

function validate_property(schema_property, value) { 
    if (schema_property.type === "number") { 
     validate_number(schema_property, value); // etc 
    } 
} 

И вы можете сделать подобную реализацию в PHP.