связать 2 текстовых поля через чистый js

179

07 марта 2019, 07:10

у меня такой вопрос, есть 2 поля которые нужно связать, оставляю код:

<span>Номер отделения</span>
<input  type="text" required  size="90px" id="departament" oninput="input()">
<span>Адрес отделения</span>
<input  type="text" required  size="90px" id="address" disabled>

задание такое, человек пишет в поле "номер отделения", например номер отделения 1, ему сразу в поле "адрес отделения" вбивается адрес этого отделения. то есть допустим есть 5 отделений, и у каждого свой адрес, поле "адрес отделения" не доступен для редактирования, туда автоматически вбивается адрес, я пытался сделать с помощью oninput, но что то не зашло, сказано что номер отделения и адрес берется из массива, и подставляется, подскажите варианты решения, возможно через цикл как то подставлять, спасибо

  var dep_address=new Array();
        dep_address[0]=1;
        dep_address[1]="address 1 departament";
        dep_address[2]=2;
        dep_address[3]="address 2 departament";
        dep_address[4]=3;
        dep_address[5]="address 3 departament";
        dep_address[6]=4;
        dep_address[7]="address 4 departament";
        dep_address[8]=5;
        dep_address[9]="address 5 departament";

Answer 1

function inputDep(el) { 
  var dep_address = [ 
    { number: 1, address: "address 1 departament" }, 
    { number: 2, address: "address 2 departament" }, 
    { number: 3, address: "address 3 departament" }, 
    { number: 4, address: "address 4 departament" }, 
    { number: 5, address: "address 5 departament" }, 
    { number: 6, address: "address 6 departament" }, 
  ]; 
  var item = dep_address.find(function(i) { return i.number == el.value; }); 
  if (item) 
    document.getElementById("address").value = item.address; 
}

<span>Номер отделения</span> 
<input  type="text" required  size="90px" id="departament" oninput="inputDep(this)"> 
<span>Адрес отделения</span> 
<input  type="text" required  size="90px" id="address" disabled>

dep_adress - это массив объектов,

почему тогда в этом массиве у переменной number значение не через "=" а через ":"

object literal - https://www.w3schools.com/js/js_objects.asp
find - это метод типа Array, который принимает в качестве параметра функцию - https://www.w3schools.com/jsref/jsref_find.asp