#1
  1. No Profile Picture
    Super Moderator
    Devshed Intermediate (1500 - 1999 posts)

    Join Date
    Jun 2009
    Location
    Hartford, WI
    Posts
    1,540
    Rep Power
    112

    Cleaning file causing errors...


    Ignore this. Issue discovered and explained at end...

    Sorry the title is not clear, but this is kinda a multi-part. My goal is to group and tidy up my functions.js file. I found a way to clean up my if / else if section by just returning the intended action from my ajax.php file instead of running all the checks.
    Code:
    success : function(data) {
      alert(data[1]);
      eval(data[0]);
    /*  if((page == 'invoice' && action == 'add') || (page == 'invoice' && action == 'edit' && data[3] == 1) || (page == 'account' && action == 'add')) {
        location.reload(true);
      } else if(page == 'invoice' && action == 'select') {
        this.html(data[0]);
        this.append($('<input />', { type: 'hidden', value: values }));
      } else if(page == 'invoice') {
        $().updateTotals(data);
      } else if(page == 'login' && data[0] == 'success') {
        window.location.href='?page=invoice';
      }*/
    },
    The issue here seems to lie within my "Cancel" option, perhaps. My "Add" works perfectly fine, but my "Edit" doesn't work at all, so no chance to test my "Cancel". When running in Developer's Mode, I get the overall error "Assignment to read-only properties is not allowed in strict mode" in reference to my jquery.min.js file.

    Its breakdown:
    HTML1300: Navigation occurred.
    bills
    Current window: projects.hellzoneinc.com/bills
    jQuery.Deferred exception: Assignment to read-only properties is not allowed in strict mode TypeError: Assignment to read-only properties is not allowed in strict mode
    at r.event.add (https://ajax.googleapis.com/ajax/lib....min.js:3:8102)
    at Anonymous function (https://ajax.googleapis.com/ajax/lib....min.js:3:7988)
    at each (https://ajax.googleapis.com/ajax/lib....min.js:2:2710)
    at r.prototype.each (https://ajax.googleapis.com/ajax/lib...y.min.js:2:994)
    at ya (https://ajax.googleapis.com/ajax/lib....min.js:3:7860)
    at on (https://ajax.googleapis.com/ajax/lib...min.js:3:13832)
    at Anonymous function (http://projects.hellzoneinc.com/bill...ctions.js:98:3)
    at j (https://ajax.googleapis.com/ajax/lib...min.js:2:29992)
    at Anonymous function (https://ajax.googleapis.com/ajax/lib...min.js:2:30313) undefined
    jquery.min.js (2,31523)
    SCRIPT5045: Assignment to read-only properties is not allowed in strict mode
    jquery.min.js (2,31689)
    Now, if I comment out my Add/Cancel section, the error no longer exists, and I can click my "Edit" icon, but doing so also triggers an AJAX submit somewhere.

    I guess the 2 parts to this question are:
    1.) Why/Where do I get the error w/ my Add/Cancel in place, with Add working just fine?
    2.) What/Where/Why is a submit to AJAX happening when attempting to "Edit"? Edit should just turn text into inputs.

    The overall code in question:
    Code:
    // Add new item
    $('.account').on('click', '.add', basicAction('account', 'add'));
    $('.invoice').on('click', '.add', basicAction('invoice', 'add'));
    
    // Cancel editing
    $('.account').on('click', '.cancel', basicAction());
    $('.invoice').on('click', '.cancel', basicAction());
    
    // Basic function definitions
    function basicAction(page, action) {
      if(action == 'add') {
        return function() {
          $(this).actionCall(page, 'add', $(this).closest('form').serialize());
        }
      } else if(action == 'cancel') {
        $(this).closest('span.td').siblings().each(function(index, cell) {
          $(this).text($(this).find('input[type=hidden]').val());
        });
        $(this).closest('span.td').toggleClass('editing')
      }
    }
    
    // Edit this invoice
    $('.invoice').on('click', '.edit', function() {
      var i = 0;
      var name = ['paid', 'due', 'value', 'name', 'adj_value', 'comment'];
      $(this).closest('span.td').siblings().each(function(index, cell) {
        var $cell = $(cell);
        if($cell.is(':first-child')) {
          var orig = ($(this).text() === 'X') ? 'checked' : null;
          var edit = $(this).text();
          $(this).html($('<input />', { name: name[i], type: 'checkbox', checked: orig }));
          $(this).append($('<input />', { type: 'hidden', value: edit }));
        } else if($cell.is(':nth-child(3)') || $cell.is(':nth-child(5)')) {
          var orig = $(this).text();
          var edit = $(this).text().replace('$', '');
          $(this).html($('<input />', { class: 'currency', name: name[i], value: edit }));
          $(this).append($('<input />', { type: 'hidden', value: orig }));
        } else if($cell.is(':nth-child(4)')) {
          var v = $(this).text();
          $(this).actionCall('invoice', 'select', v);
        } else {
          var orig = $(this).text();
          $(this).html($('<input />', { name: name[i], value: orig }));
          $(this).append($('<input />', { type: 'hidden', value: orig }));
        }
        i++;
      });
      $(this).closest('span.td').toggleClass('editing')
    });
    Full current functions.js file: http://projects.hellzoneinc.com/devs...ors-979630.txt
    The part being commented out for testing is everything above the // Edit this invoice line.

    Edit1: Omg... *shoots himself* The whole issue with the 1st error was because I defined $('.account').on('click', '.cancel', basicAction()); instead of $('.account').on('click', '.cancel', basicAction); accidentally placing the parenthesis.
    But... Still need to figure out why 'Edit' is attempting to submit anything... Any "Submit" will be in relation to actionCall(), which does not even exist in the "Edit" action...

    Edit2: And now that I can get into "Edit" mode with the input boxes, even though it still throws an error for an attempted submit, I am able to test the "Cancel", which fails... (Nothing happens upon a click)

    Edit3: I placed the page/action in my 'success' portion of my AJAX call, and found out the issue is in :nth-child(4) via actionCall('invoice', 'select', v) when it simply made the request to populate the OPTIONs for my SELECT/drop-down menu, since I haven't made it to editing that portion, yet. *rolls eyes*
    Last edited by Triple_Nothing; December 13th, 2017 at 11:20 AM.
    He who knows not that he knows not is a fool, ignore him. He who knows that he knows not is ignorant, teach him. He who knows not that he knows is asleep, awaken him. He who knows that he knows is a leader, follow him.

IMN logo majestic logo threadwatch logo seochat tools logo