I want to remove value that I stored after onclcik in an input type. Now I want to remove value onclick. I using checkbox to add value with condition if box is unchecked that add value. Now I want to remove the matched value from input onclick in checked condition, if a.
HTML
<ul class="Popular" id="Popular">
<li class="item odd" onclick="handleClick(334);" id="">
<span class="input-holder"><input type="checkbox" id="related-checkbox-334" class="checkbox related-checkbox" name="related_products[]" value="334">ADD</span>
<div class="product" id="disbaledtoclick">
<a disabled="" href="" title="" class="product-image"><img src="https://www.example.com/media/catalog/product/g/r/greeting.jpg" width="100px" height="100"></a>
<div class="product-details">
<p class="product-name"> 10 Handmade chocolates</p>
<div class="price-box">
<span class="regular-price" id="product-price-2-related">
<span class="price" disabled="">249.0000</span></span>
</div>
</div>
</div>
</li>
<li class="item odd" onclick="handleClick(338);" id="">
<span class="input-holder"><input type="checkbox" id="related-checkbox-338" class="checkbox related-checkbox" name="related_products[]" value="338">ADD</span>
<div class="product" id="disbaledtoclick">
<a disabled="" href="" title="" class="product-image"><img src="https://www.example.com/media/catalog/product/w/h/white-teddy-6inch-addon.jpg" width="100px" height="100"></a>
<div class="product-details">
<p class="product-name"> Small Teddy Bear (6")</p>
<div class="price-box">
<span class="regular-price" id="product-price-2-related">
<span class="price" disabled="">279.0000</span></span>
</div>
</div>
</div>
</li>
<li class="item odd" onclick="handleClick(339);" id="">
<span class="input-holder"><input type="checkbox" id="related-checkbox-339" class="checkbox related-checkbox" name="related_products[]" value="339">ADD</span>
<div class="product" id="disbaledtoclick">
<a disabled="" href="" title="" class="product-image"><img src="https://www.example.com/media/catalog/product/5/-/5-dairy-milk.jpg" width="100px" height="100"></a>
<div class="product-details">
<p class="product-name"> 5 Dairy milk 13 gms each</p>
<div class="price-box">
<span class="regular-price" id="product-price-2-related">
<span class="price" disabled="">200.0000</span></span>
</div>
</div>
</div>
</li>
<li class="item odd" onclick="handleClick(340);" id="">
<span class="input-holder"><input type="checkbox" id="related-checkbox-340" class="checkbox related-checkbox" name="related_products[]" value="340">ADD</span>
<div class="product" id="disbaledtoclick">
<a disabled="" href="" title="" class="product-image"><img src="https://www.example.com/media/catalog/product/h/a/half-kg-kajukatli.jpg" width="100px" height="100"></a>
<div class="product-details">
<p class="product-name"> Half kg Kaju Katli</p>
<div class="price-box">
<span class="regular-price" id="product-price-2-related">
<span class="price" disabled="">200.0000</span></span>
</div>
</div>
</div>
</li>
<li class="item odd" onclick="handleClick(341);" id="">
<span class="input-holder"><input type="checkbox" id="related-checkbox-341" class="checkbox related-checkbox" name="related_products[]" value="341">ADD</span>
<div class="product" id="disbaledtoclick">
<a disabled="" href="" title="" class="product-image"><img src="https://www.example.com/media/catalog/product/a/d/ad007_large_teddy_bear_gift_to_india.jpg" width="100px" height="100"></a>
<div class="product-details">
<p class="product-name"> Large Teddy Bear (12")</p>
<div class="price-box">
<span class="regular-price" id="product-price-2-related">
<span class="price" disabled="">200.0000</span></span>
</div>
</div>
</div>
</li>
</ul>
Javascript
var numArray = [];
function handleClick(cb) {
if (jQuery('related-products-field')) {
if (jQuery('related-products-field')) {
var checkbox = jQuery('#related-checkbox-' + cb);
// The is(':checked') function checks if the checkbox is checked
var isChecked = checkbox.is(':checked');
if (isChecked) {
I want remove code here
}
}
if (!isChecked) {
numArray.push(cb);
//alert(numArray);
//var allele = document.getElementById("dialog").innerHTML = numArray;
document.getElementById('related-products-field').value = numArray.join(",");
}
//alert("xcccc");
checkbox.prop('checked', !isChecked);
// do the rest of the function
}
}
// }
}
value save in input on click
<input type="hidden" name="related_product" id="related-products-field" value="338,339,340">
if (isChecked) {
var index = numArray.indexOf(cb); //to get index of your item in numArray
if (index > -1) {
numArray.splice(index, 1); //removes item from array
}
document.getElementById('related-products-field').value = numArray.join(",")
}
javascript have splice() function to remove item from array.
jsfiddle for reference: jsfiddle demo
Related
I have been looking a lot and trying to solve this little logic that is very complicated for me, filtering the data with the selection labels and inputs of a certain range such as price.
The problem is the search filtering: I need that if when I price in houses it shows me the houses and if I price in the next select sale or rent, it shows me the real data. the same with the price.
I am having a hard time understanding how I would do this correctly. I would assume some kind of for loop to get each select tag and then get the current option value in each select tag and only display the list items if they meet the select option value criteria.
I would appreciate any help on how I could achieve this!
const optionTabs = document.querySelectorAll(".option");
const filterProducts =
document.querySelectorAll(".card");
for (i = 0; i < optionTabs.length; i++) {
optionTabs[i].addEventListener("click", (e) => {
e.preventDefault();
const filter = e.target.dataset.filter;
console.log(filter);
filterProducts.forEach((properties) => {
if (filter == "all") {
properties.style.opacity = "1";
properties.style.visibility = "visible";
} else if (properties.classList.contains(filter)) {
properties.style.opacity = "1";
properties.style.visibility = "visible";
properties.style.order = "-1";
} else {
properties.style.opacity = "0";
properties.style.visibility = "visible";
}
});
});
}
<div class="properties__filters">
<span class="properties__filters--txt">Tipo
dePropiedad</span>
<select name="type" id="select__type" placeholder="Propiedad">
<option value=".">Tipos</option>
<option value="1">Casas</option>
<option value="2">Departamentos</option>
<option value="3">Fincas & Casas de Campo</option>
<option value="4">Terrenos</option>
</select>
</div>
<div class="properties__filters">
<span class="properties__filters--txt">Categoría de
Propiedad:</span>
<select name="category" id="select__category" class="custom-
select sources" placeholder="Categoría">
<option value=".">Todas</option>
<option value="1">Venta</option>
<option value="2">Alquiler</option>
</select>
</div>
<div class="properties__filters">
<span class="properties__filters--txt">Precio:</span>
<div class="properties__filters--price">
<div class="filters__price--prev">
<span class="price__txt">Desde:</span>
<input type="text" placeholder="Min">
</div>
<div class="filters__price--next">
<span class="price__txt">Hasta:</span>
<input type="text" placeholder="Max">
</div>
</div>
</div>
<div class="card ">
<div class="card__images">
<a href="Bienes/casa-en-calderon.html">
<img src="bienes/images/casa_calderon.jpeg">
</a>
<div class="card__images--info ">
<p>EN VENTA</p>
<p>CASA</p>
</div>
<div class="card__images--icons">
<a href="Bienes/casa-en-calderon.html" class="fas fa-
camera">
<p>7</p>
</a>
</div>
</div>
<div class="properties__content">
<h3 class=" properties__content--title ">Hermosa Casa en Calderón </h3>
<p class=" properties__content--txt ">HERMOSA CASA DE DOS PLANTAS.CUENTA CON: Departamentos sala...
<a href="Bienes/casa-en-calderon.html">
[detalle]</a>
</p>
<div class="properties__content--resume">
<div class="span__icons">
<span><i class=" fas fa-bed "></i> 3</span>
<span><i class=" fas fa-bath "></i> 2</span>
<span><i class=" far fa-clone "></i> 249 m²</span>
</div>
<div class=" link-details "><a href=" Bienes/casa-en-
calderon.html ">Ver más</a>
</div>
</div>
<div class=" properties__content--price ">
<p class=" content__price--money ">$ 135,000.00</p>
<p class=" content__price--description ">Negociables</p>
</div>
</div>
</div>
<div class="card ">
<div class="card__images">
<a href="Bienes/casa-independiente-las-casas.html">
<img src="bienes/images/casa-independiente-las-
casas.jpeg">
</a>
<div class="card__images--info ">
<p>EN VENTA</p>
<p>CASA</p>
</div>
<div class="card__images--icons">
<a href="Bienes/casa-independiente-las-casas.html" class="fas fa-camera">
<p>9</p>
</a>
</div>
</div>
<div class="properties__content">
<h3 class=" properties__content--title ">Casa Independiente en Venta </h3>
<p class=" properties__content--txt ">CASA DE OPORTUNIDAD INDEPENDIENTE.CUENTA CON: Dormitorios sala...
<a href="Bienes/casa-independiente-las-casas.html">
[detalle]</a>
</p>
<div class="properties__content--resume">
<div class="span__icons">
<span><i class=" fas fa-bed "></i> 3</span>
<span><i class=" fas fa-bath "></i> 1</span>
<span><i class=" far fa-clone "></i> 252 m²</span>
</div>
<div class=" link-details "><a href=" Bienes/casa-
independiente-las-casas.html">Ver
más</a>
</div>
</div>
<div class=" properties__content--price ">
<p class=" content__price--money ">$ 240,000.00</p>
<p class=" content__price--description ">Negociables</p>
</div>
</div>
</div>
So I added data-type and data-category to each card
I did not necessarily use the correct type and category, that is up to you.
I wrapped the filters in a div container and wrapped the cards in a div container
I then delegated the change from the filter container so any change in the filter will trigger a reflow
const cardContainer = document.getElementById("cards");
const resultText = document.getElementById("resultText");
const noResult = document.getElementById("noResult");
const filterProducts = [...document.querySelectorAll(".card")]; // cast to array type
const type = document.getElementById("select__type");
const category = document.getElementById("select__category");
const fromField = document.querySelector(".filters__price--prev input");
const toField = document.querySelector(".filters__price--next input");
const getPrice = str => str.replace(/[\$ ,]/g,"")
document.getElementById("properties__filters").addEventListener("change", function(e) {
resultText.classList.add("hide")
const typ = type.value;
const cat = category.value;
let from = +fromField.value;
let to = +toField.value;
if (to===0) to=Number.POSITIVE_INFINITY;
const filterTexts = []
if (type.value !==".") filterTexts.push(type.options[type.selectedIndex].text)
if (category.value !==".") filterTexts.push(category.options[category.selectedIndex].text)
filterTexts.push(`from $${fromField.value || 0} to ${toField.value ? `$${toField.value}` : "no upper limit"}`)
filterText.innerHTML = `You searched for ${filterTexts.join(" - ")}`;
filterProducts.forEach(card => {
const price = getPrice(card.querySelector(".content__price--money").textContent)
console.log(from,price,to)
const show = (typ === "." || card.dataset.type === typ) &&
(cat === "." || card.dataset.category === cat) &&
(from <= price && to >= price)
card.classList.toggle("hide", !show)
})
resultText.classList.remove("hide");
const hidden = cardContainer.querySelectorAll(".hide")
console.log(hidden.length , filterProducts.length)
noResult.classList.toggle("hide",hidden.length != filterProducts.length)
})
.hide {
display: none;
}
<div id="properties__filters">
<div class="properties__filter">
<span class="properties__filters--txt">Tipo de Propiedad</span>
<select name="type" id="select__type" placeholder="Propiedad">
<option value=".">Tipos</option>
<option value="1">Casas</option>
<option value="2">Departamentos</option>
<option value="3">Fincas & Casas de Campo</option>
<option value="4">Terrenos</option>
</select>
</div>
<div class="properties__filter">
<span class="properties__filters--txt">Categoría de Propiedad:</span>
<select name="category" id="select__category" class="custom-select sources" placeholder="Categoría">
<option value=".">Todas</option>
<option value="1">Venta</option>
<option value="2">Alquiler</option>
</select>
</div>
<div class="properties__filters">
<span class="properties__filters--txt">Precio:</span>
<div class="properties__filters--price">
<div class="filters__price--prev">
<span class="price__txt">Desde:</span>
<input type="number" placeholder="Min">
</div>
<div class="filters__price--next">
<span class="price__txt">Hasta:</span>
<input type="number" placeholder="Max">
</div>
</div>
</div>
</div>
<div id="resultText" class="hide">Your search: <span id="filterText"></span><p id="noResult"><b>No results</b></p></div>
<div id="cards">
<div class="card" data-type="1" data-category="1">
<div class="card__images">
<a href="Bienes/casa-en-calderon.html">
<img src="bienes/images/casa_calderon.jpeg">
</a>
<div class="card__images--info ">
<p>EN VENTA</p>
<p>CASA</p>
</div>
<div class="card__images--icons">
<a href="Bienes/casa-en-calderon.html" class="fas fa-camera">
<p>7</p>
</a>
</div>
</div>
<div class="properties__content">
<h3 class=" properties__content--title ">Hermosa Casa en Calderón </h3>
<p class=" properties__content--txt ">HERMOSA CASA DE DOS PLANTAS.CUENTA CON: Departamentos sala...
[detalle]
</p>
<div class="properties__content--resume">
<div class="span__icons">
<span><i class=" fas fa-bed "></i> 3</span>
<span><i class=" fas fa-bath "></i> 2</span>
<span><i class=" far fa-clone "></i> 249 m²</span>
</div>
<div class=" link-details ">Ver más
</div>
</div>
<div class=" properties__content--price ">
<p class=" content__price--money ">$ 135,000.00</p>
<p class=" content__price--description ">Negociables</p>
</div>
</div>
</div>
<div class="card" data-type="2" dasta-category="1">
<div class="card__images">
<a href="Bienes/casa-independiente-las-casas.html">
<img src="bienes/images/casa-independiente-las-casas.jpeg">
</a>
<div class="card__images--info ">
<p>EN VENTA</p>
<p>CASA</p>
</div>
<div class="card__images--icons">
<a href="Bienes/casa-independiente-las-casas.html" class="fas fa-camera">
<p>9</p>
</a>
</div>
</div>
<div class="properties__content">
<h3 class=" properties__content--title ">Casa Independiente en Venta </h3>
<p class=" properties__content--txt ">CASA DE OPORTUNIDAD INDEPENDIENTE.CUENTA CON: Dormitorios sala...
[detalle]
</p>
<div class="properties__content--resume">
<div class="span__icons">
<span><i class=" fas fa-bed "></i> 3</span>
<span><i class=" fas fa-bath "></i> 1</span>
<span><i class=" far fa-clone "></i> 252 m²</span>
</div>
<div class=" link-details ">Ver más
</div>
</div>
<div class=" properties__content--price ">
<p class=" content__price--money ">$ 240,000.00</p>
<p class=" content__price--description ">Negociables</p>
</div>
</div>
</div>
</div>
I have to order many files within a website, select them by marking them and send them to their respective folders, the problem is that there are more than 12,000 thousand listings of 30 items each! different formats and things that you should sort by category... manually.
Then I ask for your help to create a script that selects the files by keyword, that is, if a compressed file contains the keyword 'MacOS' because I select it and send it to its respective folder, let's see these images that will help me explain better what I wish:
Our robot friend would go through the whole section where these three elements of examples appear.
(1) I would find the keyword 'Mac.OS' - lowercase or uppercase.
(2) And it would select the matching element.
HTML of this section: (For reasons of quantity of characters I have limited the HTML, complete DEMO in JSFiddle)
<div id="FilesListContainer">
<form action="/action/Files/FilesList" autocomplete="off" id="FileListForm" method="post"> <input name="chomikName" type="hidden" value="chomikuj8ceggd">
<input name="folderId" type="hidden" value="779">
<input name="fileListSortType" type="hidden" value="Date">
<input name="fileListAscending" type="hidden" value="False">
<input name="gallerySortType" type="hidden" value="Name">
<input name="galleryAscending" type="hidden" value="False">
<input name="pageNr" type="hidden" value="1">
<input name="isGallery" type="hidden" value="False">
</form>
<div class="borderRadius tab" id="sortTab">
<ul class="borderRadius tabGradientBg">
<li class="selected" style="width:130px;">sortuj według:</li>
<li><form action="">nazwa<input name="fileListSortType" type="hidden" value="Name"><input name="fileListAscending" type="hidden" value="False"></form></li>
<li><form action="">typ pliku<input name="fileListSortType" type="hidden" value="Type"><input name="fileListAscending" type="hidden" value="False"></form></li>
<li><form action="">rozmiar<input name="fileListSortType" type="hidden" value="Size"><input name="fileListAscending" type="hidden" value="False"></form></li>
<li><form action=""><a class="selected" href="#" rel="nofollow" title="data dodania">data dodania <img alt="Malejąco" src="//x4.static-chomikuj.pl/res/7c24b1ecca.png"></a><input name="fileListSortType" type="hidden" value="Date"><input name="fileListAscending" type="hidden" value="True"></form></li>
<li style="width:30px;"><span><input type="checkbox" class="selectAllFiles" value="" name=""></span></li>
</ul>
</div>
<div id="listView" style="display: block">
<div class="filerow fileItemContainer">
<div class="fileinfo tab">
<ul class="borderRadius tabGradientBg">
<li><span>8,0 MB</span></li>
<li><span class="date">11 mar 19 5:18</span></li>
<li><span><input type="checkbox" value="6733949428" name="selectFileItem"></span></li>
</ul>
</div>
<div class="fileActionsButtons clear visibleButtons fileIdContainer" rel="6733949428" style="visibility: hidden;">
<ul>
<li><a class="showFileRating ratingBtn" href="javascript:;" title="Oceń plik"><span class="star5"></span></a></li>
<li><img alt="pobierz" src="//x4.static-chomikuj.pl/res/503435f17e.png" title="pobierz"></li>
<li class="fileCommentsAction"><img alt="komentarze" src="//x4.static-chomikuj.pl/res/d9b637b7b4.png" title="komentarze"></li>
<li class="fileActionsFacebookSend" data-url="http://chomikuj.pl/chomikuj8ceggd/fff/Excel.Data.Analysis.For.Dummies.4th.Edition,6733949428.epub" data-title="Excel.Data.Analysis.For.Dummies.4th.Edition">
<img alt="Podziel się na Facebook" src="//x4.static-chomikuj.pl/res/585911b602.gif" title="Podziel się na Facebook">
</li>
<li><a class="showFileOptions" href="#" title="opcje" rel="nofollow"><img alt="opcje" src="//x4.static-chomikuj.pl/res/e174c25b70.png" title="opcje"></a></li>
</ul>
</div>
<div onmouseover="$('.visibleArrow', this).css('visibility', 'visible')" onmouseout="$('.visibleArrow', this).css('visibility', 'hidden');" class="filename txt">
<h3>
<a class="expanderHeader downloadAction downloadContext" href="/chomikuj8ceggd/fff/Excel.Data.Analysis.For.Dummies.4th.Edition,6733949428.epub" title="Excel.Data.Analysis.For.Dummies.4th.Edition">
<span class="bold">Excel.Data.Analysis.For.Dummies.4th.Edition</span>.epub
</a>
<img alt="pobierz" class="downloadArrow visibleArrow" src="//x4.static-chomikuj.pl/res/99a19ffb28.png" style="visibility: hidden;" title="pobierz">
</h3>
</div>
<div style="clear:left;">
<div rel="Other" class="expType" style="visibility: hidden">
<a rel="highslide"></a>
</div>
<span class="filedescription" style="display: none">
</span>
</div>
<div class="clear">
</div>
</div>
<div class="filerow fileItemContainer">
<div class="fileinfo tab">
<ul class="borderRadius tabGradientBg">
<li><span>9,1 MB</span></li>
<li><span class="date">11 mar 19 5:13</span></li>
<li><span><input type="checkbox" value="6733945278" name="selectFileItem"></span></li>
</ul>
</div>
<div class="fileActionsButtons clear visibleButtons fileIdContainer" rel="6733945278" style="visibility: hidden;">
<ul>
<li><a class="showFileRating ratingBtn" href="javascript:;" title="Oceń plik"><span class="star5"></span></a></li>
<li><img alt="pobierz" src="//x4.static-chomikuj.pl/res/503435f17e.png" title="pobierz"></li>
<li class="fileCommentsAction"><img alt="komentarze" src="//x4.static-chomikuj.pl/res/d9b637b7b4.png" title="komentarze"></li>
<li class="fileActionsFacebookSend" data-url="http://chomikuj.pl/chomikuj8ceggd/fff/Ad0b3.Zii.2019-Universal.Patcher.v4.1.7.Mac.OS.X_TNT,6733945278.rar(archive)" data-title="Ad0b3.Zii.2019-Universal.Patcher.v4.1.7.Mac.OS.X_TNT">
<img alt="Podziel się na Facebook" src="//x4.static-chomikuj.pl/res/585911b602.gif" title="Podziel się na Facebook">
</li>
<li><a class="showFileOptions" href="#" title="opcje" rel="nofollow"><img alt="opcje" src="//x4.static-chomikuj.pl/res/e174c25b70.png" title="opcje"></a></li>
</ul>
</div>
<div onmouseover="$('.visibleArrow', this).css('visibility', 'visible')" onmouseout="$('.visibleArrow', this).css('visibility', 'hidden');" class="filename zip">
<h3>
<a class="expanderHeader downloadAction downloadContext" href="/chomikuj8ceggd/fff/Ad0b3.Zii.2019-Universal.Patcher.v4.1.7.Mac.OS.X_TNT,6733945278.rar(archive)" title="Ad0b3.Zii.2019-Universal.Patcher.v4.1.7.Mac.OS.X_TNT">
<span class="bold">Ad0b3.Zii.2019-Universal.Patcher.v4.1.7.Mac.OS.X_T<span class="e"> </span>NT</span>.rar
</a>
<img alt="pobierz" class="downloadArrow visibleArrow" src="//x4.static-chomikuj.pl/res/99a19ffb28.png" style="visibility: hidden;" title="pobierz">
</h3>
</div>
<div style="clear:left;">
<div rel="Other" class="expType" style="visibility: hidden">
<a rel="highslide"></a>
</div>
<span class="filedescription" style="display: none">
</span>
</div>
<div class="clear">
</div>
</div>
<div class="filerow alt fileItemContainer">
<div class="fileinfo tab">
<ul class="borderRadius tabGradientBg">
<li><span>1,40 GB</span></li>
<li><span class="date">11 mar 19 5:13</span></li>
<li><span><input type="checkbox" value="6733945277" name="selectFileItem"></span></li>
</ul>
</div>
<div class="fileActionsButtons clear visibleButtons fileIdContainer" rel="6733945277" style="visibility: hidden;">
<ul>
<li><a class="showFileRating ratingBtn" href="javascript:;" title="Oceń plik"><span class="star5"></span></a></li>
<li><img alt="pobierz" src="//x4.static-chomikuj.pl/res/503435f17e.png" title="pobierz"></li>
<li class="fileCommentsAction"><img alt="komentarze" src="//x4.static-chomikuj.pl/res/d9b637b7b4.png" title="komentarze"></li>
<li class="fileActionsFacebookSend" data-url="http://chomikuj.pl/chomikuj8ceggd/fff/Ad0b3.M3di4.3nc0d3r.CC.2019.v13.0.2-Crack.Mac.OS.X-CracksNow,6733945277.dmg(archive)" data-title="Ad0b3.M3di4.3nc0d3r.CC.2019.v13.0.2-Crack.Mac.OS.X-CracksNow">
<img alt="Podziel się na Facebook" src="//x4.static-chomikuj.pl/res/585911b602.gif" title="Podziel się na Facebook">
</li>
<li><a class="showFileOptions" href="#" title="opcje" rel="nofollow"><img alt="opcje" src="//x4.static-chomikuj.pl/res/e174c25b70.png" title="opcje"></a></li>
</ul>
</div>
<div onmouseover="$('.visibleArrow', this).css('visibility', 'visible')" onmouseout="$('.visibleArrow', this).css('visibility', 'hidden');" class="filename iso">
<h3>
<a class="expanderHeader downloadAction downloadContext" href="/chomikuj8ceggd/fff/Ad0b3.M3di4.3nc0d3r.CC.2019.v13.0.2-Crack.Mac.OS.X-CracksNow,6733945277.dmg(archive)" title="Ad0b3.M3di4.3nc0d3r.CC.2019.v13.0.2-Crack.Mac.OS.X-CracksNow">
<span class="bold">Ad0b3.M3di4.3nc0d3r.CC.2019.v13.0.2-Crack.Mac.OS.X<span class="e"> </span>-CracksNow</span>.dmg
</a>
<img alt="pobierz" class="downloadArrow visibleArrow" src="//x4.static-chomikuj.pl/res/99a19ffb28.png" style="visibility: hidden;" title="pobierz">
</h3>
</div>
<div style="clear:left;">
<div rel="Other" class="expType" style="visibility: hidden">
<a rel="highslide"></a>
</div>
<span class="filedescription" style="display: none">
</span>
</div>
<div class="clear">
</div>
</div>
<div class="smallBL" id="selectedFilesActionButtons">
<ul class="disabled">
<li class="">
<a class="button smallButton copyFilesBtn" href="javascript:;">
<img alt="Kopiuj" src="//x4.static-chomikuj.pl/res/8638d1a887.png" title="Kopiuj">
</a>Kopiuj</li>
<li class="">
<a class="button smallButton moveFilesBtn" href="javascript:;">
<img alt="Przenieś" src="//x4.static-chomikuj.pl/res/72d861f112.png" title="Przenieś"></a>Przenieś</li>
<li class="">
<a class="button smallButton deleteFilesBtn" href="javascript:;">
<img alt="Usuń" src="//x4.static-chomikuj.pl/res/4c264123ef.png" title="Usuń"></a>Usuń</li>
</ul>
<p>Zaznaczone pliki:</p>
<div class="clear"></div>
</div>
</div> </div>
(3) I would click on 'Move'
<li class="">
<a class="button smallButton moveFilesBtn" href="javascript:;">
<img alt="Przenieś" src="//x4.static-chomikuj.pl/res/72d861f112.png" title="Przenieś"></a>Przenieś</li>
(4) Wait for this window to appear
<div id="ui-tooltip-filesAction" class="ui-tooltip qtip ui-helper-reset ui-tooltip-default dialogWindow ui-tooltip-pos-c ui-draggable" tracking="false" role="alert" aria-live="polite" aria-atomic="false" aria-describedby="ui-tooltip-filesAction-content" aria-hidden="false" style="width: 261px; z-index: 15002; top: 497.333px; left: 477px; display: block; opacity: 1;"><div class="ui-tooltip-titlebar"><div id="ui-tooltip-filesAction-title" class="ui-tooltip-title" aria-atomic="true">Kopiowanie plików</div><a class="ui-state-default ui-tooltip-close ui-tooltip-icon" title="Zamknij" aria-label="Zamknij" role="button"><span class="ui-icon ui-icon-close">×</span></a></div><div class="ui-tooltip-content" id="ui-tooltip-filesAction-content" aria-atomic="true"><div style="display: block;">
<form action="/action/FileDetails/MoveFilesAction" method="post"><input id="ChomikName" name="ChomikName" type="hidden" value="chomikuj8ceggd"><input id="FolderId" name="FolderId" type="hidden" value="779"> <input type="hidden" name="Files" value="6733945277">
<input id="FolderTo" name="FolderTo" type="hidden" value="0"> <div>
<p>Jesteś w trybie przenoszenia.Aby przenieść plik do innego folderu
wystarczy w drzewie folderów Twojego Chomika kliknąć na docelowy folder.</p>
<input type="reset" class="greenButtonCSS" value="Anuluj przenoszenie">
</div>
</form></div></div></div>
(5) And finally click on the corresponding folder
<span class="newfile_s">MAC</span>
(3) It could be accessed from your class
(5) It is easy to access it by your ID
The method to select or mark checkboxes I am afraid that it has to be similar to the 'click' that is given with the mouse, I say it because selecting with the method .prop (' checked ', true) marks them but does not enable the 'Move' option:
Marked with script⚠️
Manual marked✅
Maybe a MouseEvent (' click ', is correct here, I do not have the necessary knowledge to ensure it
As I mentioned before, for questions of quantity of characters I put the HTML abbreviated, functional, but abbreviated. Now I leave a link to the full DEMO in JSFiddle
Script
Maybe, just maybe you can place the script inside this code so that you execute it every time you press the' enter 'key
If there is a better way then I accept it gladly!
document.onkeyup = function(e){
document.onkeyup = function(e){
if(e){
var key = window.event ? e.keyCode : e.which;
}else{
var key = window.event ? event.keyCode : event.which;
}
if (key == '13') {
//Code you would like to execute
}
}
}
- Final clarifications:
It would be for a Tampermonkey script
Javascript or JQuery
The idea is that when executing the script everything is marked with the chosen keyword and then clicks send that to the folder
I'm pretty new to this (it's a bit hard to
understand haha)
This question already has answers here:
$(this) inside of AJAX success not working
(2 answers)
Closed 4 years ago.
I am trying to fetch the img src which is in flip class. Below is the HTML that I am having. I basically want to get the src img and change it on the click on swatch-option.
<li class="item product product-item">
<div class="product-item-info" data-container="product-grid">
<a href="http://127.0.0.1/magento2252/stellar-solar-jacket.html" class="product photo product-item-photo" tabindex="-1">
<span class="product-image-container" style="width:240px;">
<span class="product-image-wrapper" style="padding-bottom: 125%;">
<img class="product-image-photo" src="http://127.0.0.1/magento2252/pub/media/catalog/product\cache\c687aa7517cf01e65c009f6943c2b1e9\/w/j/wj01-blue_main.jpg" width="240" height="300" alt="Stellar Solar Jacket" style="display: block;">
<img class="flip" src="http://127.0.0.1/magento2252/pub/media/catalog/product//w/j/wj01-red_back.jpg" width="240" height="300" alt="Stellar Solar Jacket" style="display: none;">
</span>
</span>
</a>
<div class="product details product-item-details">
<strong class="product name product-item-name">
<a class="product-item-link" href="http://127.0.0.1/magento2252/stellar-solar-jacket.html">
Stellar Solar Jacket </a>
</strong>
<div class="product-reviews-summary short">
<div class="rating-summary">
<span class="label"><span>Rating:</span></span>
<div class="rating-result" title="67%">
<span style="width:67%"><span>67%</span></span>
</div>
</div>
<div class="reviews-actions">
<a class="action view" href="http://127.0.0.1/magento2252/stellar-solar-jacket.html#reviews">3 <span>Reviews</span></a>
</div>
</div>
<div class="price-box price-final_price" data-role="priceBox" data-product-id="1225" data-price-box="product-id-1225">
<span class="normal-price">
<span class="price-container price-final_price tax weee">
<span class="price-label" style="display: inline;">As low as</span>
<span id="product-price-1225" data-price-amount="75" data-price-type="finalPrice" class="price-wrapper "><span class="price">$75.00</span></span>
</span>
</span>
</div>
<div class="swatch-opt-1225" data-role="swatch-option-1225">
<div class="swatch-attribute size" attribute-code="size" attribute-id="141">
<div aria-activedescendant="" tabindex="0" aria-invalid="false" aria-required="true" role="listbox" aria-label="Size" class="swatch-attribute-options clearfix">
<div class="swatch-option text" id="option-label-size-141-item-168" aria-checked="false" aria-describedby="option-label-size-141" tabindex="0" option-type="0" option-id="168" option-label="S" aria-label="S" option-tooltip-thumb="" option-tooltip-value="S" rel="1218" role="option">S</div>
<div class="swatch-option text" id="option-label-size-141-item-169" aria-checked="false" aria-describedby="option-label-size-141" tabindex="0" option-type="0" option-id="169" option-label="M" aria-label="M" option-tooltip-thumb="" option-tooltip-value="M" rel="1221" role="option">M</div>
<div class="swatch-option text" id="option-label-size-141-item-170" aria-checked="false" aria-describedby="option-label-size-141" tabindex="0" option-type="0" option-id="170" option-label="L" aria-label="L" option-tooltip-thumb="" option-tooltip-value="L" rel="1224" role="option">L</div>
</div>
</div>
<div class="swatch-attribute color" attribute-code="color" attribute-id="93" option-selected="50">
<div aria-activedescendant="option-label-color-93-item-50" tabindex="0" aria-invalid="false" aria-required="true" role="listbox" aria-label="Color" class="swatch-attribute-options clearfix">
<div class="swatch-option color selected" id="option-label-color-93-item-50" aria-checked="false" aria-describedby="option-label-color-93" tabindex="0" option-type="1" option-id="50" option-label="Blue" aria-label="Blue" option-tooltip-thumb="" option-tooltip-value="#1857f7" rel="1222" role="option" style="background: #1857f7 no-repeat center; background-size: initial;"></div>
<div class="swatch-option color" id="option-label-color-93-item-58" aria-checked="false" aria-describedby="option-label-color-93" tabindex="0" option-type="1" option-id="58" option-label="Red" aria-label="Red" option-tooltip-thumb="" option-tooltip-value="#ff0000" rel="1223" role="option" style="background: #ff0000 no-repeat center; background-size: initial;"></div>
<div class="swatch-option color" id="option-label-color-93-item-60" aria-checked="false" aria-describedby="option-label-color-93" tabindex="0" option-type="1" option-id="60" option-label="Yellow" aria-label="Yellow" option-tooltip-thumb="" option-tooltip-value="#ffd500" rel="1224" role="option" style="background: #ffd500 no-repeat center; background-size: initial;"></div>
</div>
</div>
</div>
<div class="product-item-inner">
<div class="product actions product-item-actions">
<div class="actions-primary">
<form data-role="tocart-form" data-product-sku="WJ01" action="http://127.0.0.1/magento2252/checkout/cart/add/uenc/aHR0cDovLzEyNy4wLjAuMS9tYWdlbnRvMjI1Mi93b21lbi90b3BzLXdvbWVuL2phY2tldHMtd29tZW4uaHRtbA%2C%2C/product/1225/" method="post">
<input type="hidden" name="product" value="1225">
<input type="hidden" name="uenc" value="aHR0cDovLzEyNy4wLjAuMS9tYWdlbnRvMjI1Mi9jaGVja291dC9jYXJ0L2FkZC91ZW5jL2FIUjBjRG92THpFeU55NHdMakF1TVM5dFlXZGxiblJ2TWpJMU1pOTNiMjFsYmk5MGIzQnpMWGR2YldWdUwycGhZMnRsZEhNdGQyOXRaVzR1YUhSdGJBJTJDJTJDL3Byb2R1Y3QvMTIyNS8,">
<input name="form_key" type="hidden" value="OIKwIjHelyF4WqGg"> <button type="submit" title="Add to Cart" class="action tocart primary">
<span>Add to Cart</span>
</button>
<input class="swatch-input super-attribute-select" name="super_attribute[141]" type="text" value="" data-selector="super_attribute[141]" data-validate="{required: true}" aria-required="true" aria-invalid="false"><input class="swatch-input super-attribute-select" name="super_attribute[93]" type="text" value="" data-selector="super_attribute[93]" data-validate="{required: true}" aria-required="true" aria-invalid="false" data-attr-name="color">
</form>
</div>
<div data-role="add-to-links" class="actions-secondary">
<a href="#" class="action towishlist" title="Add to Wish List" aria-label="Add to Wish List" data-post="{"action":"http:\/\/127.0.0.1\/magento2252\/wishlist\/index\/add\/","data":{"product":"1225","uenc":"aHR0cDovLzEyNy4wLjAuMS9tYWdlbnRvMjI1Mi93b21lbi90b3BzLXdvbWVuL2phY2tldHMtd29tZW4uaHRtbA,,"}}" data-action="add-to-wishlist" role="button">
<span>Add to Wish List</span>
</a>
<a href="#" class="action tocompare" title="Add to Compare" aria-label="Add to Compare" data-post="{"action":"http:\/\/127.0.0.1\/magento2252\/catalog\/product_compare\/add\/","data":{"product":"1225","uenc":"aHR0cDovLzEyNy4wLjAuMS9tYWdlbnRvMjI1Mi93b21lbi90b3BzLXdvbWVuL2phY2tldHMtd29tZW4uaHRtbA,,"}}" role="button">
<span>Add to Compare</span>
</a>
</div>
</div>
</div>
</div>
</div>
</li>
The code which I am applying is as below which is inside onclick function of optionclass:-
$widget.element.on('click', '.' + options.optionClass, function () {
var prodId = $(this).attr('rel');
$.ajax({
url: urlBuilder.build('swatch/index/product'),
data: {productId:prodId},
type: 'post',
success: function(result) {
var flipsrc = result.flipsrc;
if(result.success != ''){
var urlsrc = $(this).closest('div.product-item-info').find('img.flip').attr('src');
console.log(urlsrc);
}
}
});
return $widget._OnClick($(this), $widget);
});
The output is undefined.
Inside the success callback, this has stopped referring to the same context at line 2. So store the intended this in a local variable, ex. _this.
$widget.element.on('click', '.' + options.optionClass, function () {
var prodId = $(this).attr('rel');
var _this = this;
$.ajax({
url: urlBuilder.build('swatch/index/product'),
data: {productId:prodId},
type: 'post',
success: function(result) {
var flipsrc = result.flipsrc;
if(result.success != ''){
var urlsrc = $(_this).closest('div.product-item-info').find('img.flip').attr('src');
console.log(urlsrc);
}
}
});
return $widget._OnClick($(this), $widget);
});
I am currently developing a landing page website for a client to display a range of products.
I have created a filter in JS to filter some products but its not working.
The two radios are tagged with Motorola and when you select the Motorola it doesn't show them?
I would appreciate any help someone can give me.
I am not the most confident with javascript
<div class="container mg-b-40">
<div class="row">
<div class="col-lg-2">
<aside class="sidebar">
<h5 class="heading-primary">Filter</h5>
<ul class="shop-filters">
<li class="filter">
<input type="checkbox" value="motorola" id="motorola">
<label for="motorola">Motorola</label>
</li>
<li class="filter">
<input type="checkbox" value="hytera" id="hytera">
<label for="hytera">Hytera</label>
</li>
<li class="filter">
<input type="checkbox" value="icom" id="icom">
<label for="icom">Icom</label>
</li>
<li class="filter">
<input type="checkbox" value="vertex" id="vertex">
<label for="vertex">Vertex</label>
</li>
<li class="filter">
<input type="checkbox" value="kenwood" id="kenwood">
<label for="kenwood">Kenwood</label>
</li>
<li class="filter">
<input type="checkbox" value="savox" id="savox">
<label for="savox">Savox</label>
</li>
</ul>
</aside>
</div>
<div class="col-lg-10">
<div class="masonry-loader masonry-loader-showing">
<div class="row products product-thumb-info-list mt-3" data-plugin-masonry data-plugin-options="{'layoutMode': 'fitRows'}">
<div class="category motorola">
<div class="col-sm-6 col-lg-12 product">
<span class="product-thumb-info">
<span class="product-thumb-info-image">
<img alt="" class="img-fluid" src="https://cdn.shopify.com/s/files/1/1148/2692/products/dp1400-01_Radio_Shop_UK_b113f82f-a13b-4ffa-93fd-612f313084ef.jpg?v=1529421291">
</span>
<span class="product-thumb-info-content">
<h4 class="heading-brand">Motorola DP1400</h4>
<div class="btn-group action-group" role="group" aria-label="Action Buttons">
Call Now
<a href="" class="btn btn-secondary btn-buy" rel=”nofollow”>Buy Now</a>
</div>
</span>
</span>
</div>
</div>
<div class="category hytera">
<div class="col-sm-6 col-lg-12 product">
<span class="product-thumb-info">
<span class="product-thumb-info-image">
<img alt="" class="img-fluid" src="https://cdn.shopify.com/s/files/1/1148/2692/products/dp1400-01_Radio_Shop_UK_b113f82f-a13b-4ffa-93fd-612f313084ef.jpg?v=1529421291">
</span>
<span class="product-thumb-info-content">
<h4 class="heading-brand">Motorola DP1400</h4>
<div class="btn-group action-group" role="group" aria-label="Action Buttons">
Call Now
<a href="" class="btn btn-secondary btn-buy" rel=”nofollow”>Buy Now</a>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
$(':input').change(function(evt){
var filter = $(':input:checked,select').map(function(index, el) {
return "." + el.value;
}).toArray().join("");
$(".product").hide().filter(filter).show();
});
</script>
The problem with your code is that you're hiding .product, but actual item to be hidden is .category. See below the working demo.
$(':input').change(function(evt) {
var filter = $(':input:checked, select').map(function(_, el) {
return "." + el.value;
}).toArray().join("");
$(".category").hide().filter(filter).show();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container mg-b-40">
<div class="row">
<div class="col-lg-2">
<aside class="sidebar">
<h5 class="heading-primary">Filter</h5>
<ul class="shop-filters">
<li class="filter">
<input type="checkbox" value="motorola" id="motorola">
<label for="motorola">Motorola</label>
</li>
<li class="filter">
<input type="checkbox" value="hytera" id="hytera">
<label for="hytera">Hytera</label>
</li>
<li class="filter">
<input type="checkbox" value="icom" id="icom">
<label for="icom">Icom</label>
</li>
<li class="filter">
<input type="checkbox" value="vertex" id="vertex">
<label for="vertex">Vertex</label>
</li>
<li class="filter">
<input type="checkbox" value="kenwood" id="kenwood">
<label for="kenwood">Kenwood</label>
</li>
<li class="filter">
<input type="checkbox" value="savox" id="savox">
<label for="savox">Savox</label>
</li>
</ul>
</aside>
</div>
<div class="col-lg-10">
<div class="masonry-loader masonry-loader-showing">
<div class="row products product-thumb-info-list mt-3" data-plugin-masonry data-plugin-options="{'layoutMode': 'fitRows'}">
<div class="category motorola">
<div class="col-sm-6 col-lg-12 product">
<span class="product-thumb-info">
<span class="product-thumb-info-image">
<img alt="" class="img-fluid" src="https://cdn.shopify.com/s/files/1/1148/2692/products/dp1400-01_Radio_Shop_UK_b113f82f-a13b-4ffa-93fd-612f313084ef.jpg?v=1529421291">
</span>
<span class="product-thumb-info-content">
<h4 class="heading-brand">Motorola DP1400</h4>
<div class="btn-group action-group" role="group" aria-label="Action Buttons">
Call Now
<a href="" class="btn btn-secondary btn-buy" rel=”nofollow”>Buy Now</a>
</div>
</span>
</span>
</div>
</div>
<div class="category hytera">
<div class="col-sm-6 col-lg-12 product">
<span class="product-thumb-info">
<span class="product-thumb-info-image">
<img alt="" class="img-fluid" src="https://cdn.shopify.com/s/files/1/1148/2692/products/dp1400-01_Radio_Shop_UK_b113f82f-a13b-4ffa-93fd-612f313084ef.jpg?v=1529421291">
</span>
<span class="product-thumb-info-content">
<h4 class="heading-brand">Hytera</h4>
<div class="btn-group action-group" role="group" aria-label="Action Buttons">
Call Now
<a href="" class="btn btn-secondary btn-buy" rel=”nofollow”>Buy Now</a>
</div>
</span>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
i have a HTML code:
<li class="item first">
<a class="product-image" title="מדפסת Epson LQ-690" href="http://adcs.gostorego.com/mdpst-epson-lq-690.html">
<img width="135" height="135" alt="מדפסת Epson LQ-690" src="http://s5169dbdce2040.img.gostorego.com/809E82/cdn/media/s5/16/9d/bd/ce/20/40/catalog/product/cache/1/small_image/135x/9df78eab33525d08d6e5fb8d27136e95/images/catalog/product/placeholder/small_image.jpg">
</a>
<h3 class="product-name">
<a title="מדפסת Epson LQ-690" href="http://adcs.gostorego.com/mdpst-epson-lq-690.html">מדפסת Epson LQ-690</a>
</h3>
<div class="price-box">
<span id="product-price-96-widget-new-grid" class="regular-price">
<span class="price" style="display: inline;">0.00 ₪</span>
</span>
</div>
<div class="actions" style="display: block;">
<button class="button btn-cart" onclick="setLocation('http://adcs.gostorego.com/checkout/cart/add/uenc/aHR0cDovL2FkY3MuZ29zdG9yZWdvLmNvbS8,/product/96/')" title="הוסף לסל" type="button">
<span>
<span>הוסף לסל</span>
</span>
</button>
<ul class="add-to-links">
<li>
<span class="separator">|</span>
<a class="link-compare" href="http://adcs.gostorego.com/catalog/product_compare/add/product/96/uenc/aHR0cDovL2FkY3MuZ29zdG9yZWdvLmNvbS8,/">הוסף להשוואה</a>
</li>
</ul>
</div>
</li>
<li class="item">
<a class="product-image" title="מתג HP 1910-48G Switch" href="http://adcs.gostorego.com/mtg-hp-1910-48g-switch.html">
<img width="135" height="135" alt="מתג HP 1910-48G Switch" src="http://s5169dbdce2040.img.gostorego.com/809E82/cdn/media/s5/16/9d/bd/ce/20/40/catalog/product/cache/1/small_image/135x/9df78eab33525d08d6e5fb8d27136e95/images/catalog/product/placeholder/small_image.jpg">
</a>
<h3 class="product-name">
<a title="מתג HP 1910-48G Switch" href="http://adcs.gostorego.com/mtg-hp-1910-48g-switch.html">מתג HP 1910-48G Switch</a>
</h3>
<div class="price-box">
<span id="product-price-109-widget-new-grid" class="regular-price">
<span class="price">2,431.00 ₪</span>
</span>
</div>
<div class="actions" style="display: block;">
<button class="button btn-cart" onclick="setLocation('http://adcs.gostorego.com/checkout/cart/add/uenc/aHR0cDovL2FkY3MuZ29zdG9yZWdvLmNvbS8,/product/109/')" title="הוסף לסל" type="button">
<span>
<span>הוסף לסל</span>
</span>
</button>
<ul class="add-to-links">
<li>
<span class="separator">|</span>
<a class="link-compare" href="http://adcs.gostorego.com/catalog/product_compare/add/product/109/uenc/aHR0cDovL2FkY3MuZ29zdG9yZWdvLmNvbS8,/">הוסף להשוואה</a>
</li>
</ul>
</div>
</li>
<li class="item">
<a class="product-image" title="מתג HP E2510-48 Switch" href="http://adcs.gostorego.com/mtg-hp-e2510-48-switch.html">
<img width="135" height="135" alt="מתג HP E2510-48 Switch" src="http://s5169dbdce2040.img.gostorego.com/809E82/cdn/media/s5/16/9d/bd/ce/20/40/catalog/product/cache/1/small_image/135x/9df78eab33525d08d6e5fb8d27136e95/images/catalog/product/placeholder/small_image.jpg">
</a>
<h3 class="product-name">
<a title="מתג HP E2510-48 Switch" href="http://adcs.gostorego.com/mtg-hp-e2510-48-switch.html">מתג HP E2510-48 Switch</a>
</h3>
<div class="price-box">
<span id="product-price-110-widget-new-grid" class="regular-price">
<span class="price" style="display: inline;">0.00 ₪</span>
</span>
</div>
<div class="actions" style="display: block;">
<button class="button btn-cart" onclick="setLocation('http://adcs.gostorego.com/checkout/cart/add/uenc/aHR0cDovL2FkY3MuZ29zdG9yZWdvLmNvbS8,/product/110/')" title="הוסף לסל" type="button">
<span>
<span>הוסף לסל</span>
</span>
</button>
<ul class="add-to-links">
<li>
<span class="separator">|</span>
<a class="link-compare" href="http://adcs.gostorego.com/catalog/product_compare/add/product/110/uenc/aHR0cDovL2FkY3MuZ29zdG9yZWdvLmNvbS8,/">הוסף להשוואה</a>
</li>
</ul>
</div>
</li>
<li class="item last">
<a class="product-image" title="מתג HP E2510-24G Switch" href="http://adcs.gostorego.com/mtg-hp-e2510-24g-switch.html">
<img width="135" height="135" alt="מתג HP E2510-24G Switch" src="http://s5169dbdce2040.img.gostorego.com/809E82/cdn/media/s5/16/9d/bd/ce/20/40/catalog/product/cache/1/small_image/135x/9df78eab33525d08d6e5fb8d27136e95/images/catalog/product/placeholder/small_image.jpg">
</a>
<h3 class="product-name">
<a title="מתג HP E2510-24G Switch" href="http://adcs.gostorego.com/mtg-hp-e2510-24g-switch.html">מתג HP E2510-24G Switch</a>
</h3>
<div class="price-box">
<span id="product-price-111-widget-new-grid" class="regular-price">
<span class="price">2,696.00 ₪</span>
</span>
</div>
<div class="actions" style="display: block;">
<button class="button btn-cart" onclick="setLocation('http://adcs.gostorego.com/checkout/cart/add/uenc/aHR0cDovL2FkY3MuZ29zdG9yZWdvLmNvbS8,/product/111/')" title="הוסף לסל" type="button">
<span>
<span>הוסף לסל</span>
</span>
</button>
<ul class="add-to-links">
<li>
<span class="separator">|</span>
<a class="link-compare" href="http://adcs.gostorego.com/catalog/product_compare/add/product/111/uenc/aHR0cDovL2FkY3MuZ29zdG9yZWdvLmNvbS8,/">הוסף להשוואה</a>
</li>
</ul>
</div>
</li>
</ul>
now i want to find inside each li if the the price class contains = 0.00.
if it true so hide class price and also hide the div class actions.
this is my jQuery code:
$j('.item').each(function(){
if($j(this).find(".price:contains('0.00')")){
$j(this).find(".price:contains('0.00')").hide();
$j(this).find(".actions").hide();
}
});
when doing this code it is hiding the price if it's 0.00
but when hiding the .actions it hiding all the .actions in all li obviously,
but agian i want only to hide the .price if its 0.00 and its .actions
Try this
$('.item').each(function () {
var zeroPrice = $(this).find(".price:contains('0.00')");
if (zeroPrice.length > 0) {
zeroPrice.hide();
$(this).find(".actions").hide();
}
});