@dmitriu256

Как проверить input на undefined?

Суть проблемы
Есть несколько форм которые имеют одинаковые поля ввода, условия валидации для них идентичны, но в одной форме есть поля:
Форма1
Имя,
Email,
Phone,
Textarea,
а в другой только
Форма2
Имя,
Phone
Такие формы отправляются AJAX запросом на сервер, одна функция отправки для всех форм.

Как в форме2 обойти ошибку undefined this.elements.textarea.value и this.elements.email.value
Естественно таких полей нет для формы2 ?
Исходный код

xhr.setRequestHeader('Content-type', 'application/json; charset = utf-8');

                data = {
                    name: this.elements.name.value,
                    email: this.elements.email.value, //undefined 
                    phone: this.elements.phone.value,
                    message: this.elements.textarea.value //undefined 
                };
        xhr.send(JSON.stringify(data));


Пробовал проверять через this.hasOwnProperty(`${this.elements.email}`)
Результат
Cannot read property 'value' of undefined (this.elements.email.value)
at HTMLFormElement.sendForm

Громоздил проверки следующего типа (ошибка но уже в последнем блоке else).
if(this.elements.email === 'undefined') {
                    data = {
                        name: this.elements.name.value,
                        email: '',
                        phone: this.elements.phone.value,
                        message: this.elements.textarea.value
                    };
                }else if(this.elements.textarea === 'undefined'){
                    data = {
                        name: this.elements.name.value,
                        email: this.elements.email.value,
                        phone: this.elements.phone.value,
                        message: ''
                    };
                }else if(this.elements.textarea === 'undefined' && this.elements.email === 'undefined'){
                    data = {
                        name: this.elements.name.value,
                        email: '',
                        phone: this.elements.phone.value,
                        message: ''
                    };
                }else{
                    data = {
                        name: this.elements.name.value,
                        email: this.elements.email.value,
                        phone: this.elements.phone.value,
                        message: this.elements.textarea.value
                    };
                }


Буду благодарен за помощь, не хочется делать несколько функций под каждую форму логика у них идентична, выборочно отсутствуют некоторые поля.
  • Вопрос задан
  • 68 просмотров
Решения вопроса 1
@Just__Den
FULL STACK
1) как выше тебе написали, но рабочий:

const data = Object.keys(this.elements).reduce((res, key)=>{
if(this.elements[key]) res[key] = this.elements[key].value;
  return res;
}, {});


2) проще:

let data = {}
for(let i in this.elements){
	if( this.elements.hasOwnProperty(i)){
		if( this.elements[i] ){
			data[i] = this.elements[i].value
		}
	}
}


data отправляется на сервер
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
а обычная FormData не подойдет? делаете валидацию в начале функции, если есть ошибки return false, если нет то формировать formdata и просто отсылать все что есть
Ответ написан
@Che603000
c 2011 javascript
...
const data = Object.keys(this.elements).reduce((res, key)=>{
  res[key] = this.elements[key].value;
  return res;
}, {});

xhr.send(JSON.stringify(data));
...
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы