флажок формы калькулятора на 10% больше - как снять флажок и 10% - PullRequest
Новая
       34

флажок формы калькулятора на 10% больше - как снять флажок и 10%

0 голосов
/ 02 мая 2019

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

Затем я добавил флажок, чтобы клиент мог добавить 10% к общей сумме на клике.

Однако onclick - это не то же самое, что true и false, и когда клиент снимает флажок, он воспринимается как новый onclick и добавляет еще 10% вместо удаления первых 10%.

(10% на самом деле * 1.1 в расчете).

Может кто-нибудь сказать мне, как у меня должен быть код, чтобы флажок выполнял способ, которым я намереваюсь это работать. 

function MM_findObj(n, d) { //v4.01
  var p, i, x;
  if (!d) d = document;
  if ((p = n.indexOf("?")) > 0 && parent.frames.length) {
    d = parent.frames[n.substring(p + 1)].document;
    n = n.substring(0, p);
  }
  if (!(x = d[n]) && d.all) x = d.all[n];
  for (i = 0; !x && i < d.forms.length; i++)
    x = d.forms[i][n];
  for (i = 0; !x && d.layers && i < d.layers.length; i++)
    x = MM_findObj(n, d.layers[i].document);
  if (!x && d.getElementById) x = d.getElementById(n);
  return x;
}

function KW_getVal(o) { //v1.2
  var retVal = "0";
  if (o.type == "select-one") {
    retVal = (o.selectedIndex == -1) ?
      0 : o.options[o.selectedIndex].value;
  } else if (o.length > 1) {
    for (var i = 0; i < o.length; i++)
      if (o[i].checked) retVal = o[i].value;
  } else if (o.type == "checkbox") {
    retVal = (o.checked) ? o.value : 0;
  } else {
    retVal = Number(o.value)
  }
  return parseFloat(retVal);
}

function KW_calcForm() { //v1.2
  var str = "",
    a = KW_calcForm.arguments;
  for (var i = 3; i < a.length; i++)
    str += (a[i].indexOf("#") == -1) ? a[i] : KW_getVal(MM_findObj(a[i].substring(1)));
  t = Math.ceil(a[1] * eval(str)) / a[1];
  tS = t.toString();
  if (a[2] > 0) {
    tSp = tS.indexOf(".");
    if (tSp == -1) tS += ".";
    tSp = tS.indexOf(".");
    while (tSp != (tS.length - 1 - a[2])) {
      tS += "0";
      tSp = tS.indexOf(".");
    }
  }
  MM_findObj(a[0]).value = tS;
}
<h3>Tile Calculator</h3>
<form id="form1" name="form1" method="post">
  <p> <label 
  onclick="KW_calcForm('number of tiles',1,-1,'#squaremeters','*','50')">square meters                       <input name="square meters" type="text" id="squaremeters"             
  onkeyup="KW_calcForm('number of tiles',1,-1,'#squaremeters','*','50')" />
            </label>
  </p>
  <p>
    <label>number of tiles
            <input type="text" name="number of tiles" id="numberoftiles" 
             readonly />
              </label>
  </p>

  <p><strong>Remember! We always recommend to add 10% extra for cuts</strong></p>


  <input name="10pecent" type="checkbox" id="myCheck" 
  onClick="KW_calcForm('number of tiles',1,-1,'#numberoftiles','*','1.1')" value="plus10percent"> <label>add 10% extra to total.</label>

</form>

1 Ответ

0 голосов
/ 09 мая 2019

На сайте вместо числа 50 будет использоваться метаполе {{product.metafields.cal.sqm}}, но для этого примера я использовал число. 

function MM_findObj(n, d) { //v4.01
  var p, i, x;
  if (!d) d = document;
  if ((p = n.indexOf("?")) > 0 && parent.frames.length) {
    d = parent.frames[n.substring(p + 1)].document;
    n = n.substring(0, p);
  }
  if (!(x = d[n]) && d.all) x = d.all[n];
  for (i = 0; !x && i < d.forms.length; i++)
    x = d.forms[i][n];
  for (i = 0; !x && d.layers && i < d.layers.length; i++)
    x = MM_findObj(n, d.layers[i].document);
  if (!x && d.getElementById) x = d.getElementById(n);
  return x;
}

function KW_getVal(o) { //v1.2
  var retVal = "0";
  if (o.type == "select-one") {
    retVal = (o.selectedIndex == -1) ?
      0 : o.options[o.selectedIndex].value;
  } else if (o.length > 1) {
    for (var i = 0; i < o.length; i++)
      if (o[i].checked) retVal = o[i].value;
  } else if (o.type == "checkbox") {
    retVal = (o.checked) ? o.value : 0;
  } else {
    retVal = Number(o.value)
  }
  return parseFloat(retVal);
}

function KW_calcForm() { //v1.2
  var str = "",
    a = KW_calcForm.arguments;
  for (var i = 3; i < a.length; i++)
    str += (a[i].indexOf("#") == -1) ? a[i] :
    KW_getVal(MM_findObj(a[i].substring(1)));
  t = Math.ceil(a[1] * eval(str)) / a[1];
  tS = t.toString();
  if (a[2] > 0) {
    tSp = tS.indexOf(".");
    if (tSp == -1) tS += ".";
    tSp = tS.indexOf(".");
    while (tSp != (tS.length - 1 - a[2])) {
      tS += "0";
      tSp = tS.indexOf(".");
    }
  }
  MM_findObj(a[0]).value = tS;
}
<form id="form1" name="form1" method="post">


  <div class="product-form--atc-qty form-fields--qty" data-quantity- wrapper="">

    <div class="form-field form-field--qty-input">


      <input class="form-field-input form-field-number form-field-filled" value="" type="text" pattern="\d*" name="square meters" type="text" id="squaremeters" onkeyup="KW_calcForm('quantity',1,-1,'#square meters','*','50')" />
      <label class="form-field-title">Sq metres</label>

    </div>

  </div>

</form>
<form>

  <input name="id" value="{{ product.variants[0].id }}" type="hidden">


  <div class="product-form--atc">
    <div class="product-form--atc-qty form-fields--qty">

      <div class="form-field form-field--qty-input">
        <input class="form-field-input form-field-number form-field-filled" value="0" id="Quantity" name="quantity" type="text" pattern="\d*" onkeyup="KW_calcForm('square meters',10,-1,'#Quantity','/','50')" aria-label="{{ 'general.general.quantity' | t }}" data-quantity-input>
        <label class="form-field-title">Quantity</label>

      </div>


    </div>


  </div>




</form>
<p>
...