Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Помогите заполнить input (https://javascript.ru/forum/events/84737-pomogite-zapolnit-input.html)

firsmember 02.12.2022 19:59

Помогите заполнить input
 
Здравия вам господа!
Имею:
<input class="inputname">
<input class="inputlname">
<input class="inputotname">
<input class="inputlogin">


нужно на основе вводимых данных в inputname, inputlname и inputotname заполнить поле inputlogin транслетирированной строчкой (писаться слова должны через дефис)

в итоге должно получиться слкдующее:
<input class="inputlogin" value="inputname-inputlname-inputotname">


Например если в поле Имя, Фамилия и Отчество были введены следующие данные: Тестов Тест Тестович - то поле inputlogin должно заполниться в таком виде testov-test-testovich

Заранее премного вам БЛАГОДАРЕН!

Nexus 02.12.2022 20:02

Цитата:

Сообщение от firsmember
Помогите заполнить input

Чем помочь то? Что у вас не получается?

firsmember 02.12.2022 20:24

Не понятно как это делать в режиме реального времени еще и с транслитерацией

voraa 02.12.2022 20:55

Пишешь функцию транслитерации.
На инпуты в которые вводишь вешаешь событие oninput. По событию берешь value из каждого интута, транслитерируешь их, склеиваешь и помещаешь куда нужно.

firsmember 03.12.2022 00:15

Ну если вы не заметили, я тоже самое расписал в вопросе, т.е. в логике и алгоритме проблем нет, есть проблема в знании языка...

Nexus 03.12.2022 06:09

Цитата:

Сообщение от firsmember
есть проблема в знании языка

Вот учебник: https://learn.javascript.ru

Если вам нужно, чтобы за вас кто-то выполнил работу, то можете создать тему в разделе форума "Работа". Не забудьте указать сумму, которую готовы заплатить за реализацию ваших требований.

Если вы все же хотите, чтобы вам помогли - приложите какие-то усилия сами и задавайте вопросы по ходу дела.

firsmember 03.12.2022 11:15

Вы меня не так поняли) Ну да ладно)
Смотрите - я получаю данные и заполняю поле следующим образом
<form id="formtest">
<input type="text" id="input1" placeholder="1">
<input type="text" id="input2" placeholder="2">
<input type="text" id="input3" placeholder="3">
<input type="text" id="input4" placeholder="4"> oninput: <span id="result"></span>
</form>

function translit(word){
	var answer = '';
	var converter = {
		'а': 'a',    'б': 'b',    'в': 'v',    'г': 'g',    'д': 'd',
		'е': 'e',    'ё': 'e',    'ж': 'zh',   'з': 'z',    'и': 'i',
		'й': 'y',    'к': 'k',    'л': 'l',    'м': 'm',    'н': 'n',
		'о': 'o',    'п': 'p',    'р': 'r',    'с': 's',    'т': 't',
		'у': 'u',    'ф': 'f',    'х': 'h',    'ц': 'c',    'ч': 'ch',
		'ш': 'sh',   'щ': 'sch',  'ь': '',     'ы': 'y',    'ъ': '',
		'э': 'e',    'ю': 'yu',   'я': 'ya',
 
		'А': 'A',    'Б': 'B',    'В': 'V',    'Г': 'G',    'Д': 'D',
		'Е': 'E',    'Ё': 'E',    'Ж': 'Zh',   'З': 'Z',    'И': 'I',
		'Й': 'Y',    'К': 'K',    'Л': 'L',    'М': 'M',    'Н': 'N',
		'О': 'O',    'П': 'P',    'Р': 'R',    'С': 'S',    'Т': 'T',
		'У': 'U',    'Ф': 'F',    'Х': 'H',    'Ц': 'C',    'Ч': 'Ch',
		'Ш': 'Sh',   'Щ': 'Sch',  'Ь': '',     'Ы': 'Y',    'Ъ': '',
		'Э': 'E',    'Ю': 'Yu',   'Я': 'Ya'
	};
 
	for (var i = 0; i < word.length; ++i ) {
		if (converter[word[i]] == undefined){
			answer += word[i];
		} else {
			answer += converter[word[i]];
		}
	}
 
	return answer;
}


$("#formtest").change(function(){

  var value1 = translit($('#input1').val);
  
var value2 = $('#input2').val();
var value3 = $('#input3').val();
$("#input4").val(value1 + '-' + value2 + '-' + value3);
});


в данном примере я попытался транслитерировать #input1 но у меня не вышло - поможете с этим?)

Кроме того - мне не нравится - что данные передаются из поля в поля не в режиме реального времени - а только при совершении следующего действия =) Если и тут поправите меня - буду рад ! Спасибо!)

Nexus 03.12.2022 11:34

У вас в 35-й строке ошибка - скобочек не хватает:
Цитата:

var value1 = translit($('#input1').val());
<form id="formtest">
  <input type="text" placeholder="1">
  <input type="text" placeholder="2">
  <input type="text" placeholder="3">
  <input type="text" id="result" placeholder="4">
</form>
<script>
function translit(word){
	var answer = '';
	var converter = {
		'а': 'a',    'б': 'b',    'в': 'v',    'г': 'g',    'д': 'd',
		'е': 'e',    'ё': 'e',    'ж': 'zh',   'з': 'z',    'и': 'i',
		'й': 'y',    'к': 'k',    'л': 'l',    'м': 'm',    'н': 'n',
		'о': 'o',    'п': 'p',    'р': 'r',    'с': 's',    'т': 't',
		'у': 'u',    'ф': 'f',    'х': 'h',    'ц': 'c',    'ч': 'ch',
		'ш': 'sh',   'щ': 'sch',  'ь': '',     'ы': 'y',    'ъ': '',
		'э': 'e',    'ю': 'yu',   'я': 'ya',
 
		'А': 'A',    'Б': 'B',    'В': 'V',    'Г': 'G',    'Д': 'D',
		'Е': 'E',    'Ё': 'E',    'Ж': 'Zh',   'З': 'Z',    'И': 'I',
		'Й': 'Y',    'К': 'K',    'Л': 'L',    'М': 'M',    'Н': 'N',
		'О': 'O',    'П': 'P',    'Р': 'R',    'С': 'S',    'Т': 'T',
		'У': 'U',    'Ф': 'F',    'Х': 'H',    'Ц': 'C',    'Ч': 'Ch',
		'Ш': 'Sh',   'Щ': 'Sch',  'Ь': '',     'Ы': 'Y',    'Ъ': '',
		'Э': 'E',    'Ю': 'Yu',   'Я': 'Ya'
	};
 
	for (var i = 0; i < word.length; ++i ) {
		if (converter[word[i]] == undefined){
			answer += word[i];
		} else {
			answer += converter[word[i]];
		}
	}
 
	return answer;
}

document.querySelector('#formtest').addEventListener('input', function () {
  this.querySelector('#result').value = [].map.call(
    this.querySelectorAll('input:not(#result)'), 
    input => translit(input.value)
  ).filter(Boolean).join('-');
});
</script>

firsmember 03.12.2022 14:14

Супер! Большое спасибо! То что нужно ! Лайк! Подписка! Комментарий!


Часовой пояс GMT +3, время: 19:17.