rrwilson
Member
Hi there,
I dip my toe in and out of Fabrik every so often. I love it, but there is one topic that drives me potty - JS addressing/changing/accessing fabrik elements. I usually work my way through forum posts and get it to work eventually (or give up and make a nasty crosscutting calc element mess instead
). It is probably my ignorance, but I find the docs very tricky on the topic of JS addressing fabrik elements, whether it is a new or editing form record, etc. .
I have an onchange element event that triggers the below inline JS, that roughly does this:
Muchos thankos, I am really going mad over this one
RW.
I dip my toe in and out of Fabrik every so often. I love it, but there is one topic that drives me potty - JS addressing/changing/accessing fabrik elements. I usually work my way through forum posts and get it to work eventually (or give up and make a nasty crosscutting calc element mess instead
). It is probably my ignorance, but I find the docs very tricky on the topic of JS addressing fabrik elements, whether it is a new or editing form record, etc. . I have an onchange element event that triggers the below inline JS, that roughly does this:
- It is meant to read itself (i.e. the label for the selected databasejoin value) to see what the selected category is.
- If that category is a certain value, then the JS is meant to then create a new row/group in a repeating group.
- It is just a list of attribute names and their attribute value, e.g. Size and 1litre in one row/record/group - I am not sure of the correct Fabrik term).
- This group is happily working on the form manually with only these two elements showing and the joining pk hidden.
- It is just a list of attribute names and their attribute value, e.g. Size and 1litre in one row/record/group - I am not sure of the correct Fabrik term).
- Based on the category, the JS should then populate the attribute name and value elements in the repeated groups with specific strings.
- I've been assuming that the joining primary key will just be autocompleted by fabrik in the same way as it is when manually adding repeat group rows
- I have slapped this all into functions, but that doesn't seem to the issue.
Muchos thankos, I am really going mad over this one
RW.
JavaScript:
console.log('started');
function addnewgrouprows(formRef,groupId, repeatNum) {
console.log('got to addnewgrouprows func');
console.log('formRef ' + formRef);
var form = Fabrik.getBlock[formRef];
console.log('form ' + form);
/* above debug shows form undefined here :( */
/* Get the number of times the group has been repeated*/
var repeatMax = form.repeatGroupMarkers[groupId];
/* so it understandably dies here with "Cannot read property 'repeatGroupMarkers' of undefined"/*
console.log('repeatMax ' + repeatMax);
return repeatMax;
}
function newattribute(thisform,grouptochange,newrowname_element,new_prod_attrname,newrowvalue_element,new_prod_attrvalue){
console.log('got to newattribute func');
var rowid = addnewgrouprows(thisform,grouptochange,1);
/* Get the newly added element - attribute name*/
var prod_attr_name = form.formElements[newrowname_element + rowid];
/* Update the element - attribute name*/
prod_attr_name.update(new String(new_prod_attrname));
/* Get the newly added element - attribute value*/
var prod_attr_value = form.formElements[newrowvalue_element + rowid];
/* Update the element - attribute value*/
prod_attr_value.update(new String(new_prod_attrvalue));
}
/*get category and create relevant attribute*/
var list = 'Frontend_SKUs';
var $categoryID = $(list+'___Category');
console.log('debug $categoryID ' + $categoryID);
var category = $categoryID.textContent || $categoryID.innerText;
var category = $categoryID.value;
console.log(category);
console.log('debug category ' + category);
category = $categoryID[$categoryID.selectedIndex].innerHTML;
console.log('debug category again ' + category);
console.log(category);
var thisform='form_20';
console.log('debug thisform 1st ' + thisform);
/* tried two versions of getting rowid - based on wiki it seems to be necessary to allow add AND edit of new form records. But of a bit of a nightmare, read so many posts but still not clear*/
var myrowid = thisform + '.formElements.get(' + list +'___id).getValue()';
var myrowid = 'formElements.get(' + list +'___id).getValue()';
/* neither of above two work */
var thisform= thisform + '_' + myrowid;
console.log('debug thisform 2nd ' + thisform);
console.log(thisform);
var grouptochange=37;
var numnewrows=1;
var newrowname_element='Frontend_SKU_Attribute_Mapping___Attribute_';
var newrowvalue_element='Frontend_SKU_Attribute_Mapping___Value';
if (category.includes("Food")) {
console.log('Food found');
newattribute(thisform,grouptochange,newrowname_element,"Food",newrowvalue_element,category);
} else if (category.includes("Gifts")) {
newattribute(thisform,grouptochange,newrowname_element,"Gifts for her",newrowvalue_element,category);
newattribute(thisform,grouptochange,newrowname_element,"Gifts for him",newrowvalue_element,category);
console.log('Gifts found');
} else if (category.includes("Beverage")) {
newattribute(thisform,grouptochange,newrowname_element,"ABV",newrowvalue_element,category);
console.log('Beverage found');
}
console.log('js end');
