[lammeR]

Привет всем!
Есть три поля:

<div id="infoWrapper">
    <p>Ширина: <input type="text" id="width"></p>
    <p>Высота: <input type="text" id="height"></p>
    <p>Площадь: <input type="text" id="area"></p>
</div>

Нужно выводить значения в данные поля при действии пользователя. Чтобы выводить значения в каждое поле я сохраняю каждый html-элемент поля в его переменную. Иногда нужно вывести значение только в 1 поле, иногда - в 2-х, иногда в 3-х, по-этому я сделал некую универсальную фун-я render(), в которую передаётся объект и в которой обрабатываются все случаи:

function render (data) {
   
   for ( var key in data ) {
     
      if ( key == "width" ) {
         widthInput.val( data[key] );
      }
      
      if ( key == "height" ) {
         heightInput.val( data[key] );
      }

      if ( key == "area" ) {
         areaInput.val( data[key] );
      }
   }

}

Это получается какой-то ужас, а если добавятся ещё 5 полей - функция растянется и тд. И выглядит некрасиво и вообще, пока это простые 3 поля, если усложнить всё - будет головная боль. Как можно по-нормальному организовать вывод значений? Может как-то используя шаблонизаторы? Посоветуйте.