Why are autogenerated fields being removed when I use an event listener in jQuery JS

54 views Asked by At

I am using jQuery on Sage Intacct and am trying to have this grid update live time when information is entered, this information being quantity and price, these two will be multiplied to update the total amount field. [![picture1][1]][1] as seen in the picture above this works fine. Once I add another line, and select an item from a combobox that is populated based off of first selecting a project which is pulled from the API, the fields that have been populated automatically are removed, the ones that I have entered in stay. [![picture2][2]][2] Here is a picture of the drop down boxes. [![pic][3]][3]The code for the text fields to change on enter is as follows:

jq('#' + qtyid).on('change', function() {
var qty = jq('#' + qtyid)[0].value;
                    
var rate = jq('#' + rateid)[0].value;
                    
var oriamt = jq('#' + amtid)[0].value;

var totamnt = jq('#' + totalid)[0].value;

var newamt = 0;
if(qty == '')
    qty = 0;
if(rate == '')
    rate = 0;
try{
    qty = parseFloat(qty.replace(',',''));
}catch(e){
    qty = parseFloat(qty);
}
                    
try{
    rate = parseFloat(rate.replace(',',''));
}catch(e){
    rate = parseFloat(rate);
  }
                    
  newamt = qty * rate;

  jq(row).find('#' + amtid).val(newamt.toFixed(2));
  jq(row).find('#' + totalid).val(qty);

  window.editor.data.view.ENTRIES[0].AMOUNT_CONVERTED = qty;
  window.editor.data.view.ENTRIES[0].TOTAL_AMOUNT = newamt;
  window.editor.data.view.ENTRIES[0].UIPRICE = rate;
                    

  });

  jq('#' + rateid).on('change', function() {
  console.log('rate changed');

  var qty = jq('#' + qtyid)[0].value;
                    
  var rate = jq('#' + rateid)[0].value;
                    
  var oriamt = jq('#' + amtid)[0].value;

  var totamnt = jq('#' + totalid)[0].value;

  var newamt = 0;
  if(qty == '')
     qty = 0;
  if(rate == '')
     rate = 0;
  qty = parseFloat(qty.replace(',',''));
  rate = parseFloat(rate.replace(',',''));
  newamt = qty * rate;

  jq(row).find('#' + amtid).val(newamt.toFixed(2));
  jq(row).find('#' + price).val(rate);
  jq(row).find('#' + grandtotal).val(totamnt * rate);
                    

  });
  jq('#' + totalid).on('input', function() {
  var qty = jq('#' + qtyid)[0].value;
                    
  var rate = jq('#' + rateid)[0].value;
                    
  var oriamt = jq('#' + amtid)[0].value;

  var totamnt = jq('#' + totalid)[0].value;

  jq(row).find('#' + grandtotal).val(totamnt * rate);
  });
                

The code for detecting a change in the project and task is as follows:

                    jq(row).find('#' + projectid).on('change', function() {
                    var project = "";
                    var temp = jq(row).find('#' + projectid).val();
                    if (temp.includes("--")) {
                        project = temp.split("--")[0];
                    } else {
                        project = temp;
                    }
                    var selproject = _projectlist.find(x => x.PROJECTID == project);
                    var state = _statelist.find(x => x.id == selproject.RSTATE);
                    var optype = _optypelist.find(x => x.id == selproject.ROPPORTUNITY_TYPE_TEST);
                    var opvertical = _opverticallist.find(x => x.id == selproject.ROPPORTUNITY_VERTICAL_TEST);

                    jq(row).find('#' + stateid).val(state.name);
                    window.editor.data.view.ENTRIES[rowind].GLDIMSTATE_disp = state.name;
                    window.editor.data.view.ENTRIES[rowind].GLDIMSTATE = state.id;

                    jq(row).find('#' + optypeid).val(optype.name);
                    window.editor.data.view.ENTRIES[rowind].GLDIMOPPORTUNITY_TYPE_TEST_disp = optype.name;
                    window.editor.data.view.ENTRIES[rowind].GLDIMOPPORTUNITY_TYPE_TEST = optype.id;

                    jq(row).find('#' + opverticalid).val(opvertical.name);
                    window.editor.data.view.ENTRIES[rowind].GLDIMOPPORTUNITY_VERTICAL_TEST_disp = opvertical.name;
                    window.editor.data.view.ENTRIES[rowind].GLDIMOPPORTUNITY_VERTICAL_TEST = opvertical.id;
                });

                jq(row).find('#' + itemid).on('change', function() {
                    var item = "";
                    var temp = jq(row).find('#' + itemid).val();
                    if (temp.includes("--")) {
                        item = temp.split("--")[0];
                    } else {
                        item = temp;
                    }
                    var selitem = _itemlist.find(x => x.ITEMID == item);
                    if (selitem != undefined) {
                        var task = selitem.TASK_MAPPING;

                        jq(row).find('#' + taskid).val(task);
                        window.editor.data.view.ENTRIES[rowind].TASKID = task;        
                    }
                });

As you see this function is the same as the other functions so I am unsure as to why the fields are being removed ONLY when a task is selected.

EDIT: Here is where the ID values are coming from, thank you James for pointing out that this was left out.

     jq('#tbody__obj__ENTRIES').each(function(i, tb){
        //console.log(i, tb);
        jq('#tbody__obj__ENTRIES > tr').each(function(rowind, row) {
            var qtyid = '_obj__ENTRIES_' + rowind + '_-_obj__AMOUNT_CONVERTED';
            var rateid = '_obj__ENTRIES_' + rowind + '_-_obj__KERRPRICE';
            var amtid = '_obj__ENTRIES_' + rowind + '_-_obj__TOTAL_AMOUNT';
            var totalid = '_obj__ENTRIES_' + rowind + '_-_obj__TOTAL_CONVERTED';
            var price = '_obj__ENTRIES_' + rowind + '_-_obj__UIPRICE';
            var extprice = '_obj__ENTRIES_' + rowind + '_-_obj__UIVALUE';
            var grandtotal = '_obj__ENTRIES_' + rowind + '_-_obj__GRAND_TOTAL';

            var projectid = '_obj__ENTRIES_' + rowind + '_-_obj__PROJECTID';
            var itemid = '_obj__ENTRIES_' + rowind + '_-_obj__ITEMID';
            var stateid = '_obj__ENTRIES_' + rowind + '_-_obj__GLDIMSTATE';
            var opverticalid = '_obj__ENTRIES_' + rowind + '_-_obj__GLDIMOPPORTUNITY_VERTICAL_TEST';
            var optypeid = '_obj__ENTRIES_' + rowind + '_-_obj__GLDIMOPPORTUNITY_TYPE_TEST';
            var taskid = '_obj__ENTRIES_' + rowind + '_-_obj__TASKID';

As shown here it finds each id based off of the amount of rows, so each row will created will add a new id by incrementing rowind by one.

PS: I did not write any of this code I was tasked to fix it and am struggling as to me this seems messy. Thanks for the help in advance. [1]: https://i.stack.imgur.com/Pxaqf.png [2]: https://i.stack.imgur.com/E9ihE.png [3]: https://i.stack.imgur.com/SPD3h.png

0

There are 0 answers