Develop Reference

How to copy the value of a yform to an other field

In our (hybris) shop some products have a yform to summarize the parts of the product. Is there an easy way to copy the value of the sum field into an other field (automaticly) like the productquantity (no yForm)?
I guess I need javascript, but the id of the sumfield is generatad, so I don't know how to get the sum. Also my Javascript abilities are quite limited...
UPDATE:
To get the value I use this part of code:
copyYFormValueToProductQuantity : function() {
var copyText = document.querySelector('input[id*="sum"]').value
if (copyText > 0 && copyText != null)
{
//do stuff
}
console.log("Copied value: " + copyText)
},
But this line
document.querySelector('input[id*="sum"]').value
returns null. If I use it in the browserconsole, it also returns null. But after I inspected the element it works and returns the value I want to. So I guess I am missing some JS-basics here and the object isn't ready before?
Btw.: I call this function with a keydown-eventlistener.

This can most likely be done from the jsp files. There you have all the data that is needed, so you most likely need to only copy that field where you need it.
We can also help you more if you add some code examples here (what exactly is that yform?). If you struggle to find where in code is that specific yform created/added, it's always worth giving a try to search for the applied classes of the html (search the entire project and see what you find).

As I understand your question, you are saying that you want to copy the value of a yForm field named sum into a non-yForm field named productquantity, and you are asking specifically about how to access the value of a yForm field from JavaScript. If I understand this correctly, you can do so by calling the following JavaScript API:
ORBEON.xforms.Document.getValue("sum");
You can find more about this and other related API on Client-side JavaScript API.

Creating custom spell checking for html

Is it possible to use some custom functions for spell checking in html inputs? For example I have an input where values are divided by spaces (or commas, doesn't matter) and a function which receives tokens from it. That function decides if token is spelled correctly (in my case there would be some regular expression) and returns true/false value and based on that some words would be underlined. In my head it looks something like this:
<input type="text" onCheck="checkToken">
<script>
function checkToken(token) {
const oneCrazyRegex = /[a-b]/;
return oneCrazyRegex.test(token);
</script>
Or taking whole input:
function spellCheckInput(line) {
// line is an array of tokens
return line.map(tok => checkToken(tok));
}
Is it possible to do with js/css/html or not?
P.S. onCheck is example only, I know that this attribute is not valid

Yeah you can use regex for cleaning up text but you have to remember that people can fabricate any kind of input they want since the checks would be happening client-side, and anyone can just pop open a console and send anything they want.

Problems with executing code after a for-in-Loop

I have a form with multiple added dynamic rows, and i want to do a little validation of the input before i submit the form, e.g. check if all fields have input and such.
So i call this little function when i have an onclick-Event on my Submit-Button:
function validateAndSubmit() {
var form = document.getElementById("mainForm");
var formGroups = document.getElementsByClassName("form-group");
for (var x in formGroups) {
// Validation goes here
....
if (valid == false) {
return;
}
}
form.submit();
So in my logic, the code should iterate over each form-group (which basically represent the individual rows in the form) and check if they are valid. After the first invalid row, the function will return without any result. But if all formGroups are checked, the for-Loop will exit and the form.submit(); call will submit the form.
However, the final submit does not happen. Even if all form elements have valid input, the form does not submit. However, during some debugging i commented out the whole for-loop, and the form submits, but with no validation, of course.
So i am assuming that somehow the for-loop does not exit properly, and could need some help with that problem.
The whole project is written in plain Javascript, however, the library i am using to dynamically add and remove items to the form bases on jQuery.
For reference, you can find the project online here

you shouldn't use for-in at the first place. Just use the plain for form:
for(var i=0;i<formGroups.length;i++)
remember, for-in is for Objects / dictionaries. eg. {'key':'value'}
the first "x" you got in your loop is "length" - your formGroups[x] became formGroups[undefined] and throw an exception instantly.

You could also use a jQuery selector to get the elements. In your example,
$('.form-control').each(function() {
// Validation goes here
console.log($(this));
});

Use JavaScript to Log input

I have an input field, I want to write the inputs to a logger on each keystroke after they exceed three characters. The application is Rails and JavaScript. What would be the best method to go about this?
I thought about putting an event listener on the input field that happens on keyup, takes the value of the field and does something with it. I'd like to use the Ruby Logger though if possible, i.e. Logger.new
Example
Type 'cat'
and javascript captures the input and Logs it to log/keys.log
Type an extra 's'
and javascript captures that input and logs it to log/keys.log as well

Passing HTML input form contents for calculation

I am trying to make a graph of a simple function y=k*x+b.
A user enters a function into the input field, for example:
1/3*x+3
and when he/she clicks the submit button, a JavaScript function is supposed to take this input value as an actual calculation sequence and assign a variable to it (I only need to get certain y values here, so the x variable has its limits):
for (x=1;x<=40;x++)
{
result = window.document.menu.inputFunction.value;
}
The above code doesn't work. No wonder why - I am just a beginner at this. However, is this really harder than it looks, or am I missing out something? I considered trying regular expressions for this at one point, but my head hurts by even thinking about using them.
Any ideas?

You could eval it:
result = eval(window.document.menu.inputFunction.value);
There are obviously some limitations to this approach:
The user must enter a valid javascript expression
The user must use x as variable name because that's what you are using in the loop
The code is vulnerable because the user can enter and execute any javascript expression he likes
For a more robust solution you might consider using a javascript mathematical expression evaluator.