Client side Form function and script not evaluating correctly.

Good day all.

TL;DR: I am having trouble getting an onLoad method to reliably print an evaluated value to a field.

The form is as follows: 

Stock message contains:

<span id='stock_msg'></span>

I have a javascript onLoad method that compares the minimum and current stock:

// Create min and current stock variables
var minStock = document.thisItem.getProperty("_minimum_stock");
var currStock = document.thisItem.getProperty("_current_stock");

// Bring in HTML field span
var field = document.getElementById("stock_msg");
// Create stockMsgValue variable
var stockMsgValue = null;

// if current stock is less than or equals to minimum stock
if(currStock <= minStock)
{
    stockMsgValue = "<p style='color: red'>Not enough Stock!</p>";
} else {
    stockMsgValue = "<p style='color: green'>Stock levels look good</p>";
}

// Write to HTML field span
field.innerHTML += stockMsgValue;

I did something similar with Stock message 2, but included the javascript in the HTML field directly:

<div id="Message"></div>
<div id="min"></div>
<div id="curr"></div>

<script>
var divText = document.getElementById("Message");
var divCurr = document.getElementById("curr");
var divMin = document.getElementById("min");
var currStock = document.thisItem.getProperty("_current_stock");
var minStock = document.thisItem.getProperty("_minimum_stock");

if(currStock <= minStock ) {
    var textVal = "<span style='color: red';>Insufficient</span>";
}
else {
    var textVal = "<span style='color: green';>Sufficient</span>";
}

divText.innerHTML += textVal;
divMin.innerHTML += "Minimum stock: " +minStock;
divCurr.innerHTML += "Current stock: " + currStock;

</script>

The problem is that it works for a little bit, and then the evaluation does not reflect the correct values.

Some examples:

Any ideas?

Thanks

Parents
  • In general I would use an "onLoad" Method instead of a "Form" script. Simply because Form script are easy to forget and hard to edit. For the Aras Update team a Method is easier to find and update than custom code somewhere hidden in the Form.

    Of course both variants work and sometimes you have to use Form scripts due to technical reasons. "Form" scripts are loaded before (!) your "onLoad" Method.

    I don´t see an obvious bug in your code. Maybe you just have timing issue. Instead of calling the code directly with the <script> tag, wrap it into a function:

    <script>
    function dosomthing()
    {
        // place your custom code here
    }

    dosometing();
    </script>

  • If it doesn´t work, add the "debugger" statement to your script and check with the browser debugger what happens on runtime. Than you should be able to find your error easily!

  • 0 オフライン in reply to AngelaIp

    HI Angela, thanks for your suggestion, however I am still stuck.

    I have added the debugger and function call on both the onLoad method and HTML field variants, but I'm still getting the same result.

    I even separated the if function as follows, to try and get a different result:

    if(currStock < minStock)
        {
            field.innerHTML += "<p style='color: red'>Not enough Stock!</p>";
            return;
        } 
        if(currStock > minStock){
            field.innerHTML += "<p style='color: green'>Stock levels look good</p>";
            return;
        }


    The second if statement is triggered every time.

  • Have you checked with the debugger if your values of "currStock" and "minStock" are correct?

    Which events will change this values? Maybe your Form already contains updated values, while in the database still the previous ones are used.

    If you don´t want to play around with the debugger - just add some alerts to check the values while testing.

    e.g.

    alert("Debug " + currStock + " " + minStock);

    if(currStock < minStock)
    {
    field.innerHTML += "<p style='color: red'>Not enough Stock!</p>";
    return;
    }
    if(currStock > minStock){
    field.innerHTML += "<p style='color: green'>Stock levels look good</p>";
    return;
    }

  • 0 オフライン in reply to AngelaIp

    Thanks for the quick reply.

    The function only evaluates the two fields and displays a message when the item is opened. The only time when the values might change is when a user or future feature, changes it.

    I added an ifmsg variable to show which is triggered more easily.

    Here is an image of the debugger.


  • Are your fields "string" or "integer" properties? According to your debugger, they look like strings! In this case greater and less may calculate based on wrong values.

    Try to parse the value  --> 

    parseInt(minStock, 10)

    And maybe use an onFormPopulated event instead of onLoad, when the fields shall also update when user edit the item.

  • 0 オフライン in reply to AngelaIp

    Ahh, that was it, thanks!

    The properties for those values are set to integer, but it's fine now.

    If I set the method to trigger onFormPopulated, it just adds to the existing text with each render of the form. Is there a way around that?

Reply Children
  • When using onFormPopulated your Method will be triggered on any refresh, so your custom html will then be appended to the existing elements.

    Some rocket science helps: Just erase the existing content before applying the new one:

    E.g.

    var field = document.getElementById("stock_msg");
    field.innerHTML ="" ;

    More efficient would be, to just update the affected fields instead of rebuilding the complete div. But as you only show limited information, performance and loading time should be an issue.