[Resolved] JS Editor removed code but shows up in page code

[Author]

Posts

[Armando]

I am trying to:
See what happened to JS code i entered in editor

Link to a page where the issue can be seen:
hidden link

I expected to see:
Placeholder text on last field

Instead, I got:
Blank

I noticed on a few pages where I had custom code to add placeholder text, the code has been stripped out and nothing loads on the front end.

When I load my dev tools, I see an error with the code I initially inserted into the editor. I clicked the line number and I see my code inline:

hidden link

This is the original code I entered, which does not work anymore because of error:

hidden link

If I scroll down to line1644, I see the scripting I re-added to the editor:

hidden link

In conclusion:
- the original code I added is missing from the editor.
- the code still shows in the page resulting in error.
- new code I added shows below (working).
- it was working before
- i haven't added any new plugins or worked on anything that should have impacted this.

Thanks!

[Luo Yang]

Hello,

I have tried the URL you mentioned above:
hidden link

I assume we are talking about the field "Confirm Password *", but I see there is a place holder in it: Confirm Password *, and there is a JS error in that page:
Uncaught TypeError: $ is not a function

Above error is from your custom JS codes:
hidden link

$('input[name="user_pass2"]').attr("placeholder", "Confirm Password *");

You fix it by changing to:

jQuery('input[name="user_pass2"]').attr("placeholder", "Confirm Password *");

More help:
https://toolset.com/documentation/user-guides/adding-custom-javascript-views/#achieving-great-results-with-little-coding-by-using-jquery
See the example JS codes in above document

https://stackoverflow.com/questions/12343714/typeerror-is-not-a-function-when-calling-jquery-function

By default when you enqueue jQuery in WordPress you must use jQuery, and $ is not used (this is for compatibility with other libraries).

[Armando]

Thank you or looking into this. Please re-read my support ticket or maybe I need to clarify.

I understand the error and I fixed it, that is why there is placeholder inside.

There are a handful of fields throughout the site where I added placeholder via JS. They are all gone, but they show in the developer panel. That is why I put that page as a sample.

So, this used to work on the JS editor:

$('input[name="user_pass2"]').attr("placeholder", "Confirm Password *");

Then it stopped working.
It will not display this code inside the JS editor which one existed.

You can see it in the Dev panel.

I added:

jQuery('input[name="user_pass2"]').attr("placeholder", "Confirm Password *");

After I saw the error to fix the problem.

My issue:

The code:

$('input[name="user_pass2"]').attr("placeholder", "Confirm Password *");

Used to work.

It stopped.

No more JS inside the JS editor.

But shows up inside my dev tool with an error.

I cannot access the code anymore.

Thanks!

[Luo Yang]

What do you mean this: I can not access the code anymore.

Please edit the Toolset Form "Create Account"
hidden link

in section "Form editor", click " JS editor", I see those problem JS codes:

$('input[name="user_pass2"]').attr("placeholder", "Confirm Password *");

And I have modified it to:

jQuery('input[name="user_pass2"]').attr("placeholder", "Confirm Password *");

Test it in front-end, I don't see the JS error any more, see screenshot: js-editor.JPG