Skip to content

Commit

Permalink
Check which filtertemplate is selected for attributes (#15)
Browse files Browse the repository at this point in the history 
* Update filter-attributes.js

* Unbind change event to prevent double requests
  • Loading branch information
@ah-net
ah-net authored Dec 8, 2023
1 parent 8e81134 commit 72de013
Show file tree
Hide file tree
Showing 3 changed files with 73 additions and 33 deletions.
4 changes: 2 additions & 2 deletions src/view/adminhtml/ui_component/emico_attributelanding_page_form.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -70,7 +70,7 @@
</item>
</argument>
</field>
<field formElement="select" name="value-tmp" sortOrder="2">
<field formElement="select" name="value-tmp" sortOrder="3">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="fit" xsi:type="boolean">false</item>
Expand All @@ -80,7 +80,7 @@
</item>
</argument>
</field>
<field formElement="input" name="attribute" sortOrder="3">
<field formElement="input" name="attribute" sortOrder="2">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="prefixName" xsi:type="string">attribute</item>
Expand Down
9 changes: 7 additions & 2 deletions src/view/adminhtml/web/js/filter-attribute-values.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,8 +24,13 @@ define([
var select = $('select[name="' + name + '"]');
var input = $('input[name="' + name.replace('[value-tmp]', '[value]') + '"]');

input.val(select.val());
input.change();
if (select.val() == 'tw_other') {
input.show();
} else {
input.hide();
input.val(select.val());
input.change();
}
});
}
});
Expand Down
93 changes: 64 additions & 29 deletions src/view/adminhtml/web/js/filter-attributes.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,36 +15,47 @@ define([
},

_initAttributes: function (name) {
var category_id = registery.get('emico_attributelanding_page_form.emico_attributelanding_page_form.general.category_id').value();
var selectAttribute = $('select[name="' + name + '"]');
var inputAttribute = $('input[name="' + name.replace('[attribute-tmp]', '[attribute]') + '"]');
var inputValue = $('input[name="' + name.replace('[attribute-tmp]', '[value]') + '"]');
var selectedValue = inputAttribute.val();
var facetUrl = url.build('/tweakwise/ajax/facets/category/' + category_id);
var foundSelectedValue = false;

inputAttribute.hide();
inputValue.hide();

$.getJSON(facetUrl, function( data ) {
selectAttribute.empty();
data.data.forEach(value => {
if(value.value != selectedValue) {
selectAttribute.append($("<option></option>").attr("value", value.value).text(value.label));
//bind to event. So it's not triggered by the user, but can be triggered in the code.
$('select[name="' + name + '"]').on('initAttributes', function(evt) {
var name = evt.target.name;
var category_id = registery.get('emico_attributelanding_page_form.emico_attributelanding_page_form.general.category_id').value();
var selectAttribute = $('select[name="' + name + '"]');
var inputAttribute = $('input[name="' + name.replace('[attribute-tmp]', '[attribute]') + '"]');
var inputValue = $('input[name="' + name.replace('[attribute-tmp]', '[value]') + '"]');
var selectedValue = inputAttribute.val();
var templateValue = $('select[name="tweakwise_filter_template"]');
var facetUrl = url.build('/tweakwise/ajax/facets/category/' + category_id);
var foundSelectedValue = false;

if (templateValue.val() !== '') {
facetUrl += '/filtertemplate/' + templateValue.val();
}

inputAttribute.hide();
inputValue.hide();

$.getJSON(facetUrl, function( data ) {
selectAttribute.empty();
data.data.forEach(value => {
if(value.value != selectedValue) {
selectAttribute.append($("<option></option>").attr("value", value.value).text(value.label));
} else {
foundSelectedValue = true;
selectAttribute.append($("<option></option>").attr("value", value.value).text(value.label).attr("selected", "selected"));
}
});

if (foundSelectedValue === false && selectedValue) {
selectAttribute.val('tw_other');
} else {
foundSelectedValue = true;
selectAttribute.append($("<option></option>").attr("value", value.value).text(value.label).attr("selected", "selected"));
//no default value, set value to first option
inputAttribute.val(selectAttribute.val());
}
selectAttribute.trigger('change');
});

if (foundSelectedValue === false && selectedValue) {
selectAttribute.prepend($("<option></option>").attr("value", selectedValue).text(selectedValue + " (Invalid value)").attr("selected", "selected"));
} else {
//no default value, set value to first option
inputAttribute.val(selectAttribute.val());
}
selectAttribute.trigger('change');
});

$('select[name="' + name + '"]').trigger('initAttributes');
},

_bindEvents(name) {
Expand All @@ -55,18 +66,36 @@ define([
var inputValue = $('input[name="' + name.replace('[attribute-tmp]', '[value]') + '"]');
var inputAttribute = $('input[name="' + name.replace('[attribute-tmp]', '[attribute]') + '"]');
var selectValue = $('select[name="' + name.replace('[attribute-tmp]', '[value-tmp]') + '"]');
var templateValue = $('select[name="tweakwise_filter_template"]');
var facetUrl = url.build('/tweakwise/ajax/facetattributes/category/' + category_id + '/facetkey/' + facetValue);
var foundSelectedValue = false;

if (templateValue.val() !== '') {
facetUrl += '/filtertemplate/' + templateValue.val();
}

//no value selected, load initial value
if (!facetValue) {
facetValue = inputAttribute.val();
}

inputAttribute.val(facetValue);
if (facetValue == 'tw_other') {
inputAttribute.show();
selectValue.val('tw_other');
inputValue.show();
} else {
inputAttribute.hide();
if (selectValue.val() != 'tw_other') {
inputValue.hide();
inputAttribute.val(facetValue);
} else {
inputValue.show();
}
}

inputAttribute.change();

$.getJSON(facetUrl, function( data ) {
$.getJSON(facetUrl, function (data) {
selectValue.empty();
data.data.forEach(value => {
if (value.value != inputValue.val()) {
Expand All @@ -78,14 +107,20 @@ define([
});

if (foundSelectedValue === false && inputValue.val()) {
selectValue.prepend($("<option></option>").attr("value", inputValue.val()).text(inputValue.val() + " (Invalid value)").attr("selected", "selected"));
selectValue.val('tw_other');
} else {
//no default value, set value to first option
inputValue.val(selectValue.val());
inputValue.change();
}
});
});

//select different filter template
$('select[name="tweakwise_filter_template"]').unbind('change');
$('select[name="tweakwise_filter_template"]').on('change', function(evt) {
$('select[name*="[attribute-tmp]"]').trigger('initAttributes');
});
}
});

Expand Down

0 comments on commit 72de013

Please sign in to comment.