Помогите сократить скрипт
 

Вот такую конструкцию можно сделать меньше?

if (document.getElementById('standart').checked) {sum2 += 0;} 
  else if (document.getElementById('splen').checked) {
	   if (document.getElementById('100').checked) {sum2 += 150;} 
	   if (document.getElementById('200').checked) {sum2 += 250;}
	   if (document.getElementById('300').checked) {sum2 += 350;}
	   if (document.getElementById('400').checked) {sum2 += 450;}
	   if (document.getElementById('500').checked) {sum2 += 550;}
	   if (document.getElementById('600').checked) {sum2 += 650;}
	   if (document.getElementById('700').checked) {sum2 += 750;}
	   if (document.getElementById('800').checked) {sum2 += 850;}
	   if (document.getElementById('900').checked) {sum2 += 950;}
	   if (document.getElementById('1000').checked) {sum2 += 1050;}
  }
    else if (document.getElementById('designer').checked) {
	   if (document.getElementById('100').checked) {sum2 += 75;} 
	   if (document.getElementById('200').checked) {sum2 += 125;}
	   if (document.getElementById('300').checked) {sum2 += 235;}
	   if (document.getElementById('400').checked) {sum2 += 458;}
	   if (document.getElementById('500').checked) {sum2 += 569;}
	   if (document.getElementById('600').checked) {sum2 += 652;}
	   if (document.getElementById('700').checked) {sum2 += 758;}
	   if (document.getElementById('800').checked) {sum2 += 863;}
	   if (document.getElementById('900').checked) {sum2 += 912;}
	   if (document.getElementById('1000').checked) {sum2 += 1087;}
  }

  else if (document.getElementById('cover').checked) {
	   if (document.getElementById('100').checked) {sum2 += 12;} 
	   if (document.getElementById('200').checked) {sum2 += 28;}
	   if (document.getElementById('300').checked) {sum2 += 34;}
	   if (document.getElementById('400').checked) {sum2 += 47;}
	   if (document.getElementById('500').checked) {sum2 += 59;}
	   if (document.getElementById('600').checked) {sum2 += 65;}
	   if (document.getElementById('700').checked) {sum2 += 72;}
	   if (document.getElementById('800').checked) {sum2 += 88;}
	   if (document.getElementById('900').checked) {sum2 += 93;}
	   if (document.getElementById('1000').checked) {sum2 += 114;}
  }

<input type="checkbox" data-val="150">
и т.п.

Получаем все выбранные флажки и складываем значения из data-val.

PS. Если value флажков иным не задействовано, то хранить эти значения лучше в нем, а не в data-val.

laimas,
4 варианта для data-val не многовато?

На самом деле как-то странно: Это чекбоксы? И может быть множественный выбор вариантов? и все суммировать?

Судя по ID, это группы, так что нет проблем. Не зная, что все это значит, судить трудно, но чутье подсказывает, что нужно использовать value и группировать по классу или родителю, которого определяют ID.

Это типа калькулятора приведу весь скрипт, в зависимости от выбранных чекбоксов меняется сумма.

function getOrderStampSum() {
  var sum = 0;
  var sum2 = 0;
  var sum3 = 0;
  var sum4 = 0;
  var sum5 = 0;
  
       if (document.getElementById('100').checked) {sum += 297;} 
  else if (document.getElementById('200').checked) {sum += 421;} 
  else if (document.getElementById('300').checked) {sum += 545;} 
  else if (document.getElementById('400').checked) {sum += 710;} 
  else if (document.getElementById('500').checked) {sum += 834;}
  else if (document.getElementById('600').checked) {sum += 958;}
  else if (document.getElementById('700').checked) {sum += 1123;}
  else if (document.getElementById('800').checked) {sum += 1247;}
  else if (document.getElementById('900').checked) {sum += 1371;}
  else if (document.getElementById('1000').checked) {sum += 1537;}
  
       if (document.getElementById('design1').checked) {sum5 += 0;} 
  else if (document.getElementById('design2').checked) {sum5 += 100;} 
  else if (document.getElementById('design3').checked) {sum5 += 300;} 
  else if (document.getElementById('design4').checked) {sum5 += 500;} 
  
       if (document.getElementById('sides1').checked) {sum3 += 0;} 
  else if (document.getElementById('sides2').checked) {
       if (document.getElementById('100').checked) {sum3 += 120;}
  else if (document.getElementById('200').checked) {sum3 += 187;}
  else if (document.getElementById('300').checked) {sum3 += 255;}
  else if (document.getElementById('400').checked) {sum3 += 345;}
  else if (document.getElementById('500').checked) {sum3 += 413;}
  else if (document.getElementById('600').checked) {sum3 += 480;}
  else if (document.getElementById('700').checked) {sum3 += 570;}
  else if (document.getElementById('800').checked) {sum3 += 638;}
  else if (document.getElementById('900').checked) {sum3 += 705;}
  else if (document.getElementById('1000').checked) {sum3 += 795;}
  }
  
       if (document.getElementById('standart').checked) {sum2 += 0;} 
  else if (document.getElementById('splen').checked) {
	   if (document.getElementById('100').checked) {sum2 += 103;} 
	   if (document.getElementById('200').checked) {sum2 += 165;}
	   if (document.getElementById('300').checked) {sum2 += 226;}
	   if (document.getElementById('400').checked) {sum2 += 309;}
	   if (document.getElementById('500').checked) {sum2 += 371;}
	   if (document.getElementById('600').checked) {sum2 += 433;}
	   if (document.getElementById('700').checked) {sum2 += 516;}
	   if (document.getElementById('800').checked) {sum2 += 578;}
	   if (document.getElementById('900').checked) {sum2 += 639;}
	   if (document.getElementById('1000').checked) {sum2 += 721;}
  }
    else if (document.getElementById('designer').checked) {
	   if (document.getElementById('100').checked) {sum2 += 0;} 
	   if (document.getElementById('200').checked) {sum2 += 0;}
	   if (document.getElementById('300').checked) {sum2 += 0;}
	   if (document.getElementById('400').checked) {sum2 += 0;}
	   if (document.getElementById('500').checked) {sum2 += 0;}
	   if (document.getElementById('600').checked) {sum2 += 0;}
	   if (document.getElementById('700').checked) {sum2 += 0;}
	   if (document.getElementById('800').checked) {sum2 += 0;}
	   if (document.getElementById('900').checked) {sum2 += 0;}
	   if (document.getElementById('1000').checked) {sum2 += 0;}
  }

  else if (document.getElementById('cover').checked) {
	   if (document.getElementById('100').checked) {sum2 += 218;} 
	   if (document.getElementById('200').checked) {sum2 += 349;}
	   if (document.getElementById('300').checked) {sum2 += 481;}
	   if (document.getElementById('400').checked) {sum2 += 656;}
	   if (document.getElementById('500').checked) {sum2 += 787;}
	   if (document.getElementById('600').checked) {sum2 += 918;}
	   if (document.getElementById('700').checked) {sum2 += 1093;}
	   if (document.getElementById('800').checked) {sum2 += 1224;}
	   if (document.getElementById('900').checked) {sum2 += 1356;}
	   if (document.getElementById('1000').checked) {sum2 += 1530;}
  }
  
         if (document.getElementById('krug1').checked) {sum4 += 0;} 
  else if (document.getElementById('krug2').checked) {
       if (document.getElementById('100').checked) {sum4 += 50;}
  else if (document.getElementById('200').checked) {sum4 += 100;}
  else if (document.getElementById('300').checked) {sum4 += 150;}
  else if (document.getElementById('400').checked) {sum4 += 200;}
  else if (document.getElementById('500').checked) {sum4 += 250;}
  }
  
  document.getElementById('order_stamp_sum').innerHTML = sum+sum2+sum3+sum4+sum5;
}

То есть получается, что 30 разных материалов типа 'cover', 'designer' и т.д. Но все в количествах 100, 200, 300 и т.д. Писать вот такую конструкцию 30-40 раз вроде не правильно и грамоздко

else if (document.getElementById('splen').checked) {
	   if (document.getElementById('100').checked) {sum2 += 103;} 
	   if (document.getElementById('200').checked) {sum2 += 165;}
	   if (document.getElementById('300').checked) {sum2 += 226;}
	   if (document.getElementById('400').checked) {sum2 += 309;}
	   if (document.getElementById('500').checked) {sum2 += 371;}
	   if (document.getElementById('600').checked) {sum2 += 433;}
	   if (document.getElementById('700').checked) {sum2 += 516;}
	   if (document.getElementById('800').checked) {sum2 += 578;}
	   if (document.getElementById('900').checked) {sum2 += 639;}
	   if (document.getElementById('1000').checked) {sum2 += 721;}

И кто владелец этих материалов? Надо полагать сервер. А где они содержатся на сервере? Надо полагать в базе. А есть проблемы с хранением этих данных в базе? И полагать не надо, ибо с этим проблем не должно быть. Так какие проблемы вывести эти данные на клиенте как набор флажков?

Проблемы возникают тогда, когда такие данные вываливают на клиенте в неудобном представлении, что у вас и наблюдается.

Открой для себя циклы, массивы и объекты... ;)

В данном случае они тут как собаке пятая лапа. :)

raspin,

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
</head>

<body>
<form action="http://" >
<input id="standart" name="item" type="radio"> standart
<input id="splen" name="item" type="radio"> splen
<input id="designer" name="item" type="radio"> designer
<input id="cover" name="item" type="radio"> cover
<br>
<input id="100" name="kol" type="radio"> 100
<input id="200" name="kol" type="radio"> 200

</form>

<div id="out"></div>
 <script>
var data = {
    splen: {
        100: 150,
        200: 250
    },
    designer: {
        100: 75,
        200: 125
    },
    cover: {
        100: 12,
        200: 28
    }
};
document.querySelector("form").addEventListener("change", function() {
    var sum = 0;
    var elem = document.querySelector('[name="item"]:checked');
    var obj;
    if (elem && (obj = data[elem.id])) {
        elem = document.querySelector('[name="kol"]:checked');
        if (elem && (obj = obj[elem.id])) sum += obj
    }
    document.querySelector("#out").innerHTML = sum
});
 </script>
</body>
</html>

рони,
это зря. ;)

почему?

Потому, что это калькулятор, а значит данные предоставляет сервер из БД. Если калькулятор бы запрашивал данные асинхронно, тогда да, объект, в противном случае это не оправдано. Да и крайне неудобно в плане редактирования/обновления данных.

else if (document.getElementById('designer').checked) {
	   if (document.getElementById('100').checked) {sum2 += 0;} 
	   if (document.getElementById('200').checked) {sum2 += 0;}
	   if (document.getElementById('300').checked) {sum2 += 0;}
	   if (document.getElementById('400').checked) {sum2 += 0;}
	   if (document.getElementById('500').checked) {sum2 += 0;}
	   if (document.getElementById('600').checked) {sum2 += 0;}
	   if (document.getElementById('700').checked) {sum2 += 0;}
	   if (document.getElementById('800').checked) {sum2 += 0;}
	   if (document.getElementById('900').checked) {sum2 += 0;}
	   if (document.getElementById('1000').checked) {sum2 += 0;}
  }

улыбнуло :)

Рони огромное спасибо это прям то, что нужно.
laimas данные как раз не хранятся в базе, они отдельно в файле

Это тест скрипт и там просто не проставлены цены )))

laimas,
не понимаю причём тут сервер ...

laimas,
Там вряд ли сервер судя по коду, там клиент скрипя зубами

А откуда данные тогда?

j0hnik,
хрень пороть то зачем? Если бы это было локальное приложение, тогда и бы вопросов не было.

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

что за файл?

Всем кто захочет предложить очередной пример из 1000 и одного, надо на это обратить внимание:

if (document.getElementById('splen').checked) {
       if (document.getElementById('100').checked) ...
       .....
}

А значит удобнее, выгоднее, это select. Тут явно кверху каком связан клиент с сервером.

конечно getElementById в коде убивает, но select никак не изменит алгоритм предложенного варианта решения. :)

А зачем в вашем варианте объект? Этот "рудимент" лишний даже в том случае, если данные сервером не по уму хранятся, в базе, а все это ручками описано. :)

Изначально косяк в представлении, к этому косяку предлагаются решения, и что в итоге будет? ;)

Или range.
Объект с данными - действительно лишнее, нужные данные могут содержаться в самих элементах.
Так что нужно начинать с html - скрипт в результате сам минимизируется.
Я и сам вначале сделал вариант с массивом массивов типа [['cover','100',125]..... и разместил ответ - но подумал, и почти сразу же удалил.

Нет, в данном случае это неудобно. А вот костомизированный список со множественным выбором у которых интерфейс имеет флажки, это как раз. А есть же и такие, у которых выбранные опции помещаются в начале списка, в случае множества опций, это будет дополнительным плюсом.

Насколько я понял, в приведенных примерах по спискам выбираются количества определенного вида, так что какой тут множественный выбор?

Вид или материал как пишет автор, это ведь "черный", "белый", ..., то есть кроме значений еще и описание. Значит range уже неудобно.

Один флажок определяет "опрашивать или нет" группу подчиненных, а это значит список.

А подчиненные ведь флажки, а значит выбор множества из множества, поэтому и multiple. В противном случае радиокнопки были бы.

А что там на самом деле я также как и вы не знаю. :)

Это не означает, что сервер должен "выплюнуть" все, а клиент карячиться. У вас мягко говоря, все через задницу, соответственно и на клиенте тоже самое. ;)