Mixing
How can I make a product finder which uses answers from a form?
I want to create a Product finder that narrows down a list of products that can then be displayed like a search filter does.
Here is an example of what I want to do, It is GiffGaff's phone finder:
https://phonefinder.giffgaff.com/#/user/home
I can't find any tutorials for a product finder and the search filter tutorials are rather limited.
I thought about using the form inputs to narrow down an array of the products by subtracting a different array for each question.
This is the code that I put together from multiple examples just to see if it would work but I am not sure if it is scale-able or how I can implement it into my website.
I am going to create many buttons like this with a submit button at the bottom, the website will then output a list of results related to the opinions of the user.
For example in the code that I wrote after answering the first question the website removes products a, c and d which are to do with work use when the home button is selected.
<script>
var array1 = ["a", "b", "c", "d", "e"];
// by Id
function func2()
{
if(document.getElementById("h").checked)
{
var val = document.getElementById("h").value;
homeuse = true
$(function(){
var array2 = ["a", "c", "d"];
var diff = $(array1).not(array2).get();
console.log(diff);
alert(diff);
});
}
else if(document.getElementById("r").checked)
{
var val = document.getElementById("r").value;
workuse = true
$(function(){
var array2 = ["b", "e"];
var diff = $(array1).not(array2).get();
console.log(diff);
alert(diff);
});
}
}
</script>
</head>
<body>
<input type="radio" name="type" value="1111" id="h" onclick="func2();"/>Home<br/>
<input type="radio" name="type" value="2222" id="r" onclick="func2();"/>Work<br/>
</body>
Is there an easier way of doing this and how do I implement this into a product list. Must it even be done server side?
Thanks
javascript html
asked Jan 1 at 18:54
Artom Web ArtomwebArtom Web Artomweb
116
add a comment |
I want to create a Product finder that narrows down a list of products that can then be displayed like a search filter does.
Here is an example of what I want to do, It is GiffGaff's phone finder:
https://phonefinder.giffgaff.com/#/user/home
I can't find any tutorials for a product finder and the search filter tutorials are rather limited.
I thought about using the form inputs to narrow down an array of the products by subtracting a different array for each question.
This is the code that I put together from multiple examples just to see if it would work but I am not sure if it is scale-able or how I can implement it into my website.
I am going to create many buttons like this with a submit button at the bottom, the website will then output a list of results related to the opinions of the user.
For example in the code that I wrote after answering the first question the website removes products a, c and d which are to do with work use when the home button is selected.
<script>
var array1 = ["a", "b", "c", "d", "e"];
// by Id
function func2()
{
if(document.getElementById("h").checked)
{
var val = document.getElementById("h").value;
homeuse = true
$(function(){
var array2 = ["a", "c", "d"];
var diff = $(array1).not(array2).get();
console.log(diff);
alert(diff);
});
}
else if(document.getElementById("r").checked)
{
var val = document.getElementById("r").value;
workuse = true
$(function(){
var array2 = ["b", "e"];
var diff = $(array1).not(array2).get();
console.log(diff);
alert(diff);
});
}
}
</script>
</head>
<body>
<input type="radio" name="type" value="1111" id="h" onclick="func2();"/>Home<br/>
<input type="radio" name="type" value="2222" id="r" onclick="func2();"/>Work<br/>
</body>
Is there an easier way of doing this and how do I implement this into a product list. Must it even be done server side?
Thanks
javascript html
asked Jan 1 at 18:54
Artom Web ArtomwebArtom Web Artomweb
116
add a comment |
I want to create a Product finder that narrows down a list of products that can then be displayed like a search filter does.
Here is an example of what I want to do, It is GiffGaff's phone finder:
https://phonefinder.giffgaff.com/#/user/home
I can't find any tutorials for a product finder and the search filter tutorials are rather limited.
I thought about using the form inputs to narrow down an array of the products by subtracting a different array for each question.
This is the code that I put together from multiple examples just to see if it would work but I am not sure if it is scale-able or how I can implement it into my website.
I am going to create many buttons like this with a submit button at the bottom, the website will then output a list of results related to the opinions of the user.
For example in the code that I wrote after answering the first question the website removes products a, c and d which are to do with work use when the home button is selected.
<script>
var array1 = ["a", "b", "c", "d", "e"];
// by Id
function func2()
{
if(document.getElementById("h").checked)
{
var val = document.getElementById("h").value;
homeuse = true
$(function(){
var array2 = ["a", "c", "d"];
var diff = $(array1).not(array2).get();
console.log(diff);
alert(diff);
});
}
else if(document.getElementById("r").checked)
{
var val = document.getElementById("r").value;
workuse = true
$(function(){
var array2 = ["b", "e"];
var diff = $(array1).not(array2).get();
console.log(diff);
alert(diff);
});
}
}
</script>
</head>
<body>
<input type="radio" name="type" value="1111" id="h" onclick="func2();"/>Home<br/>
<input type="radio" name="type" value="2222" id="r" onclick="func2();"/>Work<br/>
</body>
Is there an easier way of doing this and how do I implement this into a product list. Must it even be done server side?
Thanks
javascript html
asked Jan 1 at 18:54
Artom Web ArtomwebArtom Web Artomweb
116
I want to create a Product finder that narrows down a list of products that can then be displayed like a search filter does.
Here is an example of what I want to do, It is GiffGaff's phone finder:
https://phonefinder.giffgaff.com/#/user/home
I can't find any tutorials for a product finder and the search filter tutorials are rather limited.
I thought about using the form inputs to narrow down an array of the products by subtracting a different array for each question.
This is the code that I put together from multiple examples just to see if it would work but I am not sure if it is scale-able or how I can implement it into my website.
I am going to create many buttons like this with a submit button at the bottom, the website will then output a list of results related to the opinions of the user.
For example in the code that I wrote after answering the first question the website removes products a, c and d which are to do with work use when the home button is selected.
<script>
var array1 = ["a", "b", "c", "d", "e"];
// by Id
function func2()
{
if(document.getElementById("h").checked)
{
var val = document.getElementById("h").value;
homeuse = true
$(function(){
var array2 = ["a", "c", "d"];
var diff = $(array1).not(array2).get();
console.log(diff);
alert(diff);
});
}
else if(document.getElementById("r").checked)
{
var val = document.getElementById("r").value;
workuse = true
$(function(){
var array2 = ["b", "e"];
var diff = $(array1).not(array2).get();
console.log(diff);
alert(diff);
});
}
}
</script>
</head>
<body>
<input type="radio" name="type" value="1111" id="h" onclick="func2();"/>Home<br/>
<input type="radio" name="type" value="2222" id="r" onclick="func2();"/>Work<br/>
</body>
Is there an easier way of doing this and how do I implement this into a product list. Must it even be done server side?
Thanks
javascript html
javascript html
asked Jan 1 at 18:54
Artom Web ArtomwebArtom Web Artomweb
116
asked Jan 1 at 18:54
Artom Web ArtomwebArtom Web Artomweb
116
asked Jan 1 at 18:54
Artom Web ArtomwebArtom Web Artomweb
116
asked Jan 1 at 18:54
Artom Web ArtomwebArtom Web Artomweb
116
asked Jan 1 at 18:54
Artom Web ArtomwebArtom Web Artomweb
116
116
add a comment |
add a comment |
0
active
oldest
votes
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53998082%2fhow-can-i-make-a-product-finder-which-uses-answers-from-a-form%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
0
active
oldest
votes
0
active
oldest
votes
active
oldest
votes
active
oldest
votes
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53998082%2fhow-can-i-make-a-product-finder-which-uses-answers-from-a-form%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
