Need some help with the logic for this function

[jncampos]

Hey All,

I'm creating a function in javascript and I'm having a bit of trouble trying to figure out the logic.

Here is the breakdown. I have a json database that will output some text into the main index.html file. This text is broken up into different entries each tagged with different categories. On the index.html the user clicks on the categories they want and then click on either one of two buttons.

 

The first button will show the text items that have any of the categories, so if they select categories 1 and 3, the function will show any of the text items with those categories. (This part works)  

 

The second button i want to show text that only have all the selected categories. So if they selected category one and three, then only items with one AND three will show It could have other categories tagged, but it has to have the selected tags in the same item. I'm just trying to figure out how to isolate just those items.

 

Here is the code for the first button. I'm not a solid coder and most of this has been trial and error after error. I just need to figure out something similar for the second button.

 

function loadInfoOr() {
$.getJSON('data.json', function(data) {
var output = '<ul class="searchresults">';
$.each(data, function(key, val) {
if ((val.env.search(env) != -1) ||
(val.pri.search(pri) != -1) ||
(val.per.search(per) != -1) ||
(val.ind.search(ind) != -1) ||
(val.com.search(com) != -1) ||
(val.res.search(res) != -1) ||
(val.myr.search(myr) != -1) ||
(val.saf.search(saf) != -1) ||
(val.ewa.search(ewa) != -1)) {
output += '<li class="itemWrapper">';
output += '<h2>'+ val.Header; 
if ((val.env.search("ENV") != -1)) {
output += '<span class="tag env">ENV</span>';
}
if ((val.pri.search("PRI") != -1)) {
output += '<span class="tag pri">PRI</span>';
}
if ((val.per.search("PER") != -1)) {
output += '<span class="tag per">PER</span>';
}
if ((val.com.search("COM") != -1)) {
output += '<span class="tag ind">IND</span>';
}
if ((val.ind.search("IND") != -1)) {
output += '<span class="tag com">COM</span>';
}
if ((val.res.search("RES") != -1)) {
output += '<span class="tag res">RES</span>';
}
if ((val.saf.search("MYR") != -1)) {
output += '<span class="tag myr">MYR</span>'; 
}
if ((val.myr.search("SAF") != -1)) {
output += '<span class="tag saf">SAF</span>';
}
if ((val.ewa.search("EWA") != -1)) {
output += '<span class="tag ewa">EWA</span>';
}
output += '</h2>';
output += '<p>'+ val.statement +'</p>';
output += '</li>';
}
});
output += '</ul>';
$('#textArea').html(output);
});
};

[Ch0cu3r]

Could you post example json data

[jncampos]

Thanks for replying.

 

Here are two of the entries for the example. The env,per,pri,com,ind,res, saf,myr, and ewa are the different categories that need to be checked. The header and statement is what gets outputted. I just can't wrap my head around how to begin coding the logic for what I'm trying to do. If someone selects env and ind, only the entries that have both of those included should show up, with it being ok if the other categories were filled. I'm not sure I'm making sense.

 

In the bottom example. If the user selected ENV and IND, The first entry would show up because it has both, but not the second entry because it only has ENV.

 

  {

    "env":"ENV",

    "per":"",

    "pri":"",

    "com":"COM",

    "ind":"IND",

    "res":"RES",

    "saf":"",

    "myr":"",

    "ewa":"",

    "Header":"Environmental Compliance ",

    "statement":"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque sollicitudin urna ante, id placerat mauris sagittis sed. Donec scelerisque dignissim viverra. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Pellentesque vita"

  },

  {

    "env":"ENV",

    "per":"PER",

    "pri":"PRI",

    "com":"COM",

    "ind":"",

    "res":"RES",

    "saf":"SAF",

    "myr":"",

    "ewa":"",

    "Header":"State of the art equipment ",

    "statement":"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque sollicitudin urna ante, id placerat mauris sagittis sed. Donec scelerisque dignissim viverra. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Pellentesque vita "

  },

 

Thanks again.

[jncampos]

I figured out how to make this work. The code isn't pretty, but I get the results that I wanted. Thanks for trying to help Ch0cu3r.