Validate plugin
ГУРУ!
Помогите пожалуйста. Никак не могу понять, как в js накидать правила, в php без проблем, а вот с js никак не получается((( 1)в index.php сделал так $jsParams = array( 'REQ_NAME' => $arResult["REQ_NAME"], 'REQ_EMAIL' => $arResult["REQ_EMAIL"], 'REQ_MESSAGE' => $arResult["REQ_MESSAGE"], ); <script> var fm_fb_array = <?=\Bitrix\Main\Web\Json::encode($jsParams, $options = null);?> </script> 2) получил : https://yadi.sk/i/kQAyTLj43GJz3u 3) теперь в файле script.js хочу сделать проверку $( document ).ready( function () {
$( "#fm-feedback-form" ).validate( {
rules: {
//если if(fm_fb_array['REQ_NAME'] == Y) тогда :
user_name: "required",
//если if(fm_fb_array['REQ_EMAIL'] == Y) тогда :
user_email: {
required: true,
email: true
},
//если if(fm_fb_array['REQ_MESSAGE'] == Y) тогда :
MESSAGE: {
required: true,
minlength: 3
}
}
});
});
//но при попытке сделать например так:
if(fm_fb_array['REQ_NAME'] == Y)
{
user_name: "required",
}
//не работает(((
помогите плз, в js почти ничего не понимаю((( |
Agapkin, не совсем понятно как связать, созданный тобой, объект fm_fb_array (а не массив, как ты предполагал, судя по названию переменной) и валидацию, как я предполагаю, формы с ИД=fm-feedback-form... :blink:
|
ksa,
Подскажите пожалуйста , как правильно сделать ? 1) я так понимаю, можно проверяемым инпутам формировать класс или ид и потом проверять их на наличие? Не знаю на сколько это правильно... Или 2) в битриксе видел как то передают массив и дальше с ним работают, только как это сделать не знаю(( может подскажете? |
Agapkin,
если $( "#fm-feedback-form" ).validate({ это подключение плагина к форме, а rules: { ... это его параметры, то зачем такая дикость на стороне сервера как REQ_NAME => "Y" и т.д., ведь можно задать этим ключам сразу значения согласно синтаксиса параметров плагина, которому просто затем передать объект fm_fb_array. |
Цитата:
Цитата:
шо там куда и как передать... Если бы что нибудь понимал в js не задавалбы глупых вопросов.... |
Цитата:
user_name: "required", user_email: { required: true, email: true }, и т.д. То есть, если пользователь устанавливает параметры полей, а не скопом кучу параметров или один в зависимости от поля, то такого в принципе быть не должно. |
Цитата:
|
объясню по подробнее...
в битриксе компоненты реализованы примерно так, вкратце: 1)есть файл component.php в этом файле заложена вся логика компонента 2)есть template.php это шаблон вывода/отображения компонента 3)есть script.js - собственно там весь js 4)и куча другого брахла, к делу отношения не имеет Так вот, создаю я компонент обратная связь, в файле component.php заложил всю логику этого компонента. В файле template.php та самая форма обратной связи. Есть настройки у компонента, где можно указать какие поля являются обязательными для заполнения какие нет. КАкбэ с php проблем нет все работает, то есть если какое то поле не заполнить component.php вернет ошибку что поле не заполнено и тд и тп . То есть на стороне сервера все ОК . ЗАдача моя заключается в следующем: прикрутить плагин валидатор форм, "для красоты"! сейчас если ручками установить настройки(правила) этого плагина то все работает без проблем. А мне надо чтобы я сделал настройки component.php и в зависимости от этих настроек настраивался бы плагин валидатор форм (его правила). соответственно настройки это компонента можно получить например php массивом или переменными а дальше проверять их в этом валидаторе форм например если "инпут-нейм = y" тогда в плагине валидатор форм тоже будет включена проверка этого поля если нет - значит нет и тд . собственно вопрос как это все написать поправильному в файле script.js можно конечно это сделать без проблем в файле template.php в тегах script и там соответственно через php проверять все настройки компонента и устанавливать правила для плагина, но хочется именно это сделать в script.js а там php не напишешь(( |
Agapkin,
$( function () {
var data = {rules : {}};
if(fm_fb_array['REQ_NAME'] == Y) data.rules.user_name = "required"
if(fm_fb_array['REQ_EMAIL'] == Y) data.rules.user_email = {
required: true,
email: true
}
if(fm_fb_array['REQ_MESSAGE'] == Y) data.rules.MESSAGE = {
required: true,
minlength: 3
}
$( "#fm-feedback-form" ).validate( data );
});
|
Agapkin,
возможно нужны кавычки == "Y" |
Цитата:
user_name: "required" и user_email: { required: true не так ли? Не знаю что у вас там за плагин, но если user_email, это поле, которое указывается для проверки, а required: true и прочее, это параметры проверки, значит required, это один из наборов проверки описанный в плагине. Следовательно данный параметр может принимать значения true/false, и т.п. по остальным параметрам. Если component.php, это логика описывающая и компонент, и правила его проверки, а проверка на сервере также обязательна, то это должно быть, типа: $components = [
'user_name' => [
'type' => 'text',
'label' => 'Ваше имя',
'placeholder' => 'Только русские, 3-12 символов',
'pattern' => '^[а-яёА-ЯЁ]{3,12}$',
'required' => true,
'check' => ['flt'=>FILTER_VALIDATE_REGEXP, 'opt'=>['options'=>['regexp' =>'/^[а-яё]{3,12}$/iu']]],
'error' => 'Сообщение....',
'default' => false,
],
'user_email' => [
//
]
];
что и отдается клиенту как готовый объект, и если не все для плагина, то выборка параметров. Собственно по описанию компонентов должна строится и сама форма. Вряд ли вам по четвергам потребуется проверка поля имени пользователя, а по понедельникам нет, и данные условия в описаниях компонентов постоянно изменяются, а поэтому возникли какие-то "Y". Получается какой-то сумбур - на сервере вроде бы серьезный подход, чего-то там описали, при этом на клиенте в задании параметров плагина: if("Y") .... Как это можно понять? |
рони,
ТЫ ЛУЧШИЙ !! КАК ВСЕГДА ПО СУЩЕСТВУ ! ОГРОМНОЕ СПАСИБО! РАБОТАЕТ. только вот теперь не могу понять как запихать остальной код messages: {
user_name: "Укажите ваше имя",
user_email: "E-mail имеет неверный формат",
MESSAGE: {
required: "Напишите сообщение",
minlength: "Минимальное количество символов 3"
}
},
errorElement: "em",
errorPlacement: function ( error, element ) {
error.addClass( "error-message" );
if ( element.prop( "type" ) === "checkbox" ) {
error.insertAfter( element.parent( "label" ) );
} else {
error.insertAfter( element );
}
if ( !element.next( "span" )[ 0 ] ) {
$(element).addClass("set-icon");
$( "<span class='glyphicon glyphicon-remove form-control-feedback'></span>" ).insertAfter( element );
}
},
success: function ( label, element ) {
if ( !$( element ).next( "span" )[ 0 ] ) {
$(element).addClass("set-icon");
$( "<span class='glyphicon glyphicon-ok form-control-feedback'></span>" ).insertAfter( $( element ) );
}
},
highlight: function ( element, errorClass, validClass ) {
$( element ).parents( ".input-group" ).addClass( "has-error" ).removeClass( "has-success" );
$( element ).next( "span" ).addClass( "glyphicon-remove" ).removeClass( "glyphicon-ok" );
},
unhighlight: function ( element, errorClass, validClass ) {
$( element ).parents( ".input-group" ).addClass( "has-success" ).removeClass( "has-error" );
$( element ).next( "span" ).addClass( "glyphicon-ok" ).removeClass( "glyphicon-remove" );
}
Изначально было так: $( "#fm-feedback-form" ).validate( {
rules: {
user_name: "required",
user_email: {
required: true,
email: true
},
MESSAGE: {
required: true,
minlength: 3
}
},
messages: {
user_name: "Укажите ваше имя",
user_email: "E-mail имеет неверный формат",
MESSAGE: {
required: "Напишите сообщение",
minlength: "Минимальное количество символов 3"
}
},
errorElement: "em",
errorPlacement: function ( error, element ) {
error.addClass( "error-message" );
if ( element.prop( "type" ) === "checkbox" ) {
error.insertAfter( element.parent( "label" ) );
} else {
error.insertAfter( element );
}
if ( !element.next( "span" )[ 0 ] ) {
$(element).addClass("set-icon");
$( "<span class='glyphicon glyphicon-remove form-control-feedback'></span>" ).insertAfter( element );
}
},
success: function ( label, element ) {
if ( !$( element ).next( "span" )[ 0 ] ) {
$(element).addClass("set-icon");
$( "<span class='glyphicon glyphicon-ok form-control-feedback'></span>" ).insertAfter( $( element ) );
}
},
highlight: function ( element, errorClass, validClass ) {
$( element ).parents( ".input-group" ).addClass( "has-error" ).removeClass( "has-success" );
$( element ).next( "span" ).addClass( "glyphicon-remove" ).removeClass( "glyphicon-ok" );
},
unhighlight: function ( element, errorClass, validClass ) {
$( element ).parents( ".input-group" ).addClass( "has-success" ).removeClass( "has-error" );
$( element ).next( "span" ).addClass( "glyphicon-ok" ).removeClass( "glyphicon-remove" );
}
});
|
Agapkin,
так добавьте data все остальные ключи без изменений var data = {rules : {}, messages : ... , errorElement: ...}; |
рони,
Класс!!! Еще раз СПАСИБО ! Получилось! То, что надо! |
рони,
Класс!!! Еще раз СПАСИБО ! Получилось! То, что надо! |
| Часовой пояс GMT +3, время: 07:16. |