如何使用JavaScript获取表字段值?

时间:2016-11-01 07:48:49

标签: javascript

目前我使用javascript创建了一个表,并在其上设置了一些值。现在我用用户输入更改总价格的值。 例如,我为标准包装2,它的总价格将变为8,000.00,子总计和总计将自动更改。 有人可以指导我吗? TQ

这是代码的打印屏幕。

enter image description here

这是我的代码

function capacityMaintenance() {
  var tab = document.createElement('table');
  tab.id = 'capacityTable';
  tab.style.paddingBottom = '10px';
  tab.style.margin = '2% auto 0';
  tab.style.width = '50%';
  tab.classname = "cssTable";
  var tbo = document.createElement('tbody');
  var title, No, titleItemDesc, titlequantity, titleUnitPrice, titleTotalPrice, row;

  title = document.createElement('tr');
  title.className = "cssSubTitleC";

  No = document.createElement('td');
  titleItemDesc = document.createElement('td');
  titlequantity = document.createElement('td');
  titleUnitPrice = document.createElement('td');
  titleTotalPrice = document.createElement('td');

  No.style.width = '30px';
  titleItemDesc.style.width = '500px';
  titlequantity.style.width = '375px';
  titleUnitPrice.style.width = '500px';
  titleTotalPrice.style.width = '500px';

  No.appendChild(document.createTextNode('No'));
  titleItemDesc.appendChild(document.createTextNode('Item Description'));
  titlequantity.appendChild(document.createTextNode('Quantity'));
  titleUnitPrice.appendChild(document.createTextNode('Unit Price (MYR)'));
  titleTotalPrice.appendChild(document.createTextNode('Total Price (MYR)'));

  title.appendChild(No);
  title.appendChild(titleItemDesc);
  title.appendChild(titlequantity);
  title.appendChild(titleUnitPrice);
  title.appendChild(titleTotalPrice);
  tbo.appendChild(title);

  var standardFontSize = "10pt";
  var standardFontFamily = "Verdana, Arial, Helvetica, sans-serif";

  for (var i = 1; i < 6; i++) {

    var inputbox_Quantity = new Array(6);
    var inputbox_GrandToTal = new Array(6);

    var page = #this.pageName#
    var value_Sun = page.fields.STANDARD.getValue();
    var value_Mon = page.fields.ADDITIONAL.getValue();
    var value_Tue = page.fields.SUBTOTAL.getValue();
    var value_Wed = page.fields.GST.getValue();
    var value_Thur = page.fields.GRANDTOTAL.getValue();

    var value_Quantity = "";
    var value_Price = "";
    var value_Total = "";

    if (i == 1) {
      var Sun_Value = value_Sun.split(",");
      for (j = 0; j < Sun_Value.length; j++) {
        if (j == 1) {
          value_Quantity = Sun_Value[j];
        } else if (j == 3) {
          value_Total = Sun_Value[j];
        }
      }
    } else if (i == 2) {
      var Mon_Value = value_Mon.split(",");
      for (j = 0; j < Mon_Value.length; j++) {
        if (j == 1) {
          value_Quantity = Mon_Value[j];
        } else if (j == 3) {
          value_Total = Mon_Value[j];
        }
      }
    } else if (i == 3) {
      var Tue_Value = value_Tue.split(",");
      for (j = 0; j < Tue_Value.length; j++) {
        if (j == 3) {
          value_Total = Tue_Value[j];
        }
      }
    } else if (i == 4) {
      var Wed_Value = value_Wed.split(",");
      for (j = 0; j < Tue_Value.length; j++) {
        if (j == 3) {
          value_Total = Wed_Value[j];
        }
      }
    } else if (i == 5) {
      var Thur_Value = value_Thur.split(",");
      for (j = 0; j < Thur_Value.length; j++) {
        if (j == 3) {
          value_Total = Thur_Value[j];
        }
      }
    }

    row = document.createElement('tr');
    row.className = i % 2 ? "cssLine2C" : "cssLine1C";

    No = document.createElement('td');
    No.setAttribute('style', 'font-weight: bold');
    No.style.fontFamily = standardFontFamily;
    No.style.fontSize = standardFontSize;

    titleItemDesc = document.createElement('td');
    titleItemDesc.setAttribute('style', 'font-weight: bold');
    titleItemDesc.style.fontFamily = standardFontFamily;
    titleItemDesc.style.fontSize = standardFontSize;

    titlequantity = document.createElement('td');
    titlequantity.style.textAlign = "center";

    titleUnitPrice = document.createElement('td');
    titleUnitPrice.setAttribute('style', 'font-weight: bold');
    titleUnitPrice.style.fontFamily = standardFontFamily;
    titleUnitPrice.style.fontSize = standardFontSize;
    titleUnitPrice.style.textAlign = "right";

    titleTotalPrice = document.createElement('td');
    titleTotalPrice.setAttribute('style', 'font-weight: bold');
    titleTotalPrice.style.fontFamily = standardFontFamily;
    titleTotalPrice.style.fontSize = standardFontSize;
    titleTotalPrice.style.textAlign = "right";

    if (i == 1) {
      value_Price = 4000;
      value_Price1 = value_Price.toLocaleString('en-US', {
        minimumFractionDigits: 2
      });
      No.appendChild(document.createTextNode('1'));
      titleItemDesc.appendChild(document.createTextNode('Standard Package'));
      titleUnitPrice.appendChild(document.createTextNode(value_Price1));

      inputbox_Quantity[i] = document.createElement('input');
      inputbox_Quantity[i].type = "number";
      inputbox_Quantity[i].setAttribute('maxlength', '2');

      inputbox_Quantity[i].style.fontFamily = standardFontFamily;
      inputbox_Quantity[i].style.fontSize = standardFontSize;
      inputbox_Quantity[i].style.width = "40%";

      inputbox_Quantity[i].id = "inputbox_Quantity" + i;

      if (value_Quantity == '') {
        inputbox_Quantity[i].value = 0;
        titlequantity.appendChild(inputbox_Quantity[i]);
      } else {
        inputbox_Quantity[i].value = value_Quantity;
        titlequantity.appendChild(inputbox_Quantity[i]);
      }

      var quantity = inputbox_Quantity[i].value;
      var Price = value_Price;
      var total = quantity * Price;
      total = total.toLocaleString('en-US', {
        minimumFractionDigits: 2
      })
      titleTotalPrice.appendChild(document.createTextNode(total));

    } else if (i == 2) {
      value_Price = 2000;
      value_Price2 = value_Price.toLocaleString('en-US', {
        minimumFractionDigits: 2
      });

      No.appendChild(document.createTextNode('2'));
      titleItemDesc.appendChild(document.createTextNode('Aditional Package'));
      titleUnitPrice.appendChild(document.createTextNode(value_Price2));

      inputbox_Quantity[i] = document.createElement('input');
      inputbox_Quantity[i].type = "number";
      inputbox_Quantity[i].setAttribute('maxlength', '2');

      inputbox_Quantity[i].style.fontFamily = standardFontFamily;
      inputbox_Quantity[i].style.fontSize = standardFontSize;
      inputbox_Quantity[i].style.width = "40%";

      inputbox_Quantity[i].id = "inputbox_Quantity" + i;

      if (value_Quantity == '') {
        inputbox_Quantity[i].value = 0;
        titlequantity.appendChild(inputbox_Quantity[i]);
      } else {
        inputbox_Quantity[i].value = value_Quantity;
        titlequantity.appendChild(inputbox_Quantity[i]);
      }

      var quantity = inputbox_Quantity[i].value;
      var Price = value_Price;
      var total = quantity * Price;
      total = total.toLocaleString('en-US', {
        minimumFractionDigits: 2
      })
      titleTotalPrice.appendChild(document.createTextNode(total));

    } else if (i == 3) {
      titleUnitPrice.appendChild(document.createTextNode('Sub Total'));
    } else if (i == 4) {
      titleUnitPrice.appendChild(document.createTextNode('GST'));
      <!--- titleTotalPrice.appendChild(document.createTextNode('240.00')); --->
    } else if (i == 5) {
      titleUnitPrice.appendChild(document.createTextNode('Grand Total (RM)'));


    };

    //second column text box
    <!--- inputbox_ManHour[i] = document.createElement('input');
    inputbox_ManHour[i].type = "Text";
    inputbox_ManHour[i].setAttribute('maxlength', '10');

    inputbox_ManHour[i].style.fontFamily = standardFontFamily;
    inputbox_ManHour[i].style.fontSize = standardFontSize;

    inputbox_ManHour[i].id = "inputbox_ManHour" + i;
    inputbox_ManHour[i].value = value_ManHr;
    titlequantity.appendChild(inputbox_ManHour[i]);
    --- >

    <!--- //fourth column text box
    inputbox_TimeEnd[i] = document.createElement('input');
    inputbox_TimeEnd[i].type = "Text";
    inputbox_TimeEnd[i].setAttribute('maxlength', '5');

    inputbox_TimeEnd[i].style.fontFamily = standardFontFamily;
    inputbox_TimeEnd[i].style.fontSize = standardFontSize;

    inputbox_TimeEnd[i].id = "inputbox_TimeEnd" + i;
    inputbox_TimeEnd[i].value = value_EndTime;
    //attach_calendar(inputbox_TimeEnd[i], 'images/', 'Select Date');
    titleTotalPrice.appendChild(inputbox_TimeEnd[i]);
    --- >

    tbo.appendChild(row);
    row.appendChild(No);
    row.appendChild(titleItemDesc);
    row.appendChild(titlequantity);
    row.appendChild(titleUnitPrice);
    row.appendChild(titleTotalPrice);
  }
  tab.appendChild(tbo);
  document.getElementById('content').appendChild(tab);
}

0 个答案:

没有答案