Strange Java script issue

[DataMiser]

I am running into an issue passing a variable into a routine.

The data comes down from the server and is treated as an array.
The var recordid is pulled from that array and passed into another routine which populates a table on the html page. At this point everything is fine.

There is a button created within the table that is to pass the value and others to another function when the button is pressed.

onclick=\"ActionButton(" + recordid + "," + jobid + "," + qty + ",'S');\"

Now when it gets into the ActionButton() we have a problem where the value is different.

The value of recordid has a - in it so for example let's say the recordid=123456-1 when the value is displayed in the table it is correct. If I place an alert in the code to show the "ActionButton(" + recordid + "," + jobid + "," + qty that too is correct.

When the code enters the ActionButton() routine the value is different. It seems that it is treating the value as an expession so 123456-1 becomes 123455 instead and I can't for the life of me figure out why this is happening or what I need to do to get the proper value passed into the routine.

Is there some way I can force JS to treat this as a string and not an expression? And why would it pass intact to one function and then be evaluated going into the next function?

The routine being called looks like this

function ActionButton(RecID, jobid, qty, mode)

[DataMiser]

So I modified my code and am sending that recordid down in two parts now then I modified this piece

onclick=\"ActionButton(" + recordid + "," + jobid + "," + qty + ",'S');\"

to this

onclick=\"ActionButton(" + ord +","+ ln + "," + jobid + "," + qty + ",'S');\"

Then in the action button routine I added

var recordid=ord+"-"+ln;

It seems to be working now but I am really curious what JS treated that value the way it did.
The strangest part was I tested this code a couple months ago and it worked just fine but then at some point the customer added that - into the recordid and apparently that was the straw that broke the camels back and the pages just stopped working.

[Niya]

It seems it evaluated the value of the variable as an expression which is just wild. I had never even heard of such a thing happening anywhere. The only way such a thing should be possible is when the Eval function is used. I can't think of any other way such a thing could happen.

[DataMiser]

Yeah, I've never saw anything like this happen before, didn't even know it was possible.
I don't know if it makes a difference but I was testing in Edge. My customer is using Chrome and was getting the same results.

That makes me wonder about other functions and routines where this recordid is passed in/out in JS. may be more problem on the horizon if I can't figure out why this happened.

[techgnome]

Is there some way I can force JS to treat this as a string and not an expression?

Maybe by putting tick marks around it so that it's a string...

onclick=\"ActionButton('" + recordid + "'," + jobid + "," + qty + ",'S');\"

-tg

[szlamany]

Are you 100% what you think is happening is? Are you using a browser debugger? I want to see screen shots of the debug window and see what your variable values are...

By the looks of it, you are only passing in TWO parameters to that FUNCTION call (since EVAL() is not being used).

Build that result string in smaller pieces...

var strRecordId = String(recordid)
var strJobId = String(jobid)

Use the STRING() function

onclick="ActionButton(" + String(recordid) + "," + String(jobid) + "," + String(qty) + ",'S');"

[dday9]

This almost sounds like it could be a hoisting issue too. Presumably this is happening asynchronously which could cause the asynchronous call and the creation of the DOM to be out of sync.

I had something very similar happen to me where I had a data grid with a filter form. When the user would filter the grid below, little "chips" would appear between the filter form and the grid that displayed what filters were being used and they could remove them individually by clicking on them. The text was localized (between French and English) and so sometimes we had to make an Ajax request to get the localized word. What was happening was that the chips would have the correct text, but when the user would click on it to remove one, some random one would be removed instead of the one being clicked.

The issue in that situation was with how JavaScript hoists its variables. Because we had to support IE 10 at the time, I had to wrap all of my logic within functions to force the variable hoisting to be containerized within the function call. If this were today and we could simply tell our clients to "f" off with IE support, then I would have used const/let declarations.

[DataMiser]

Thanks for the replies, I did not try it with tick marks, that sounds like it would be worth a try. I did try it using string and tostring, same results.

I did add a few alert boxes to the code to display the content of that variable at various points in the code and in every case prior to the function entry that variable held the correct value. When displayed inside the function it looks to have been evaluated and the result was no longer valid. so '12345-1' became 12344. The original value was in an array and then parsed into the recordid var and passed to another routine. It that routine the variable is dislpayed on screen and gets written into the html as shown in my earlier post. That line looks exatcly as I would expect showing the valeu to be passed when the button is clicked as 12345-1 but then in the action button function it gets the value as 12344. It seems that the var is being treated as a string up until it is placed in that html and then when the button is clicked it is treated like an expression instead.

I even thought maybe the variable is being changed elsewhere so I changed the name of the variable in the action button function, still same results.