Click here to Skip to main content
15,919,613 members
Home / Discussions / JavaScript
   

JavaScript

 
AnswerRe: Disable a textbox inside Repeater control when any of the DropDownList values also inside Repeater, is selected Pin
Richard Deeming2-Mar-23 21:27
mveRichard Deeming2-Mar-23 21:27 
QuestionHow to replace the select of my html Pin
sanphil2-Mar-23 1:07
sanphil2-Mar-23 1:07 
QuestionHow to display a pop up without click and without login Pin
Member 1593182922-Feb-23 6:20
Member 1593182922-Feb-23 6:20 
AnswerRe: How to display a pop up without click and without login Pin
Jeremy Falcon27-Feb-23 7:29
professionalJeremy Falcon27-Feb-23 7:29 
QuestionHow to show or hide a div with only class without ID Pin
flexi220220-Feb-23 6:36
flexi220220-Feb-23 6:36 
AnswerRe: How to show or hide a div with only class without ID Pin
Richard Deeming20-Feb-23 21:54
mveRichard Deeming20-Feb-23 21:54 
GeneralRe: How to show or hide a div with only class without ID Pin
flexi220221-Feb-23 0:03
flexi220221-Feb-23 0:03 
GeneralRe: How to show or hide a div with only class without ID Pin
Richard Deeming21-Feb-23 1:43
mveRichard Deeming21-Feb-23 1:43 
With the original markup:
JavaScript
const showPanel = el => {
	let panel = el.nextElementSibling;
	while (panel && panel.tagName !== "DIV"){
		panel = panel.nextElementSibling;
	}
	
	if (panel) {
		panel.style.display = "block";
	}
};

const hidePanel = el => {
	const panel = el.closest(".panel");
	if (panel) {
		panel.style.display = "none";
	}
};

document.addEventListener("click", e => {
	let el = e.target;
	if (el.tagName !== "A") { el = el.closest("a"); }
	if (!el) { return; }
	
	if (el.classList.contains("b-items__item__add-to-cart")) {
		e.preventDefault();
		showPanel(el);
	} else if (el.classList.contains("ajouter-panier")) {
		e.preventDefault();
		hidePanel(el);
	}
});
Demo[^]

With the modified markup:
JavaScript
document.addEventListener("click", e => {
	let el = e.target;
	if (el.tagName !== "A") { el = el.closest("a"); }
	if (!el || !el.classList.contains("ajouter-panier")) { return; }
	
	const card = el.closest(".item-card");
	if (!card) { return; }
	
	const panel = card.querySelector(".panel");
	if (!panel) { return; }
	
	e.preventDefault();
	
	if (el.classList.contains("b-items__item__add-to-cart")) {
		panel.style.display = "block";
	} else if (el.classList.contains("ajouter-panier")) {
		panel.style.display = "none";
	}
});
Demo[^]



"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer

GeneralRe: How to show or hide a div with only class without ID Pin
flexi220221-Feb-23 1:59
flexi220221-Feb-23 1:59 
GeneralRe: How to show or hide a div with only class without ID Pin
flexi220221-Feb-23 3:41
flexi220221-Feb-23 3:41 
GeneralRe: How to show or hide a div with only class without ID Pin
Richard Deeming21-Feb-23 22:11
mveRichard Deeming21-Feb-23 22:11 
AnswerRe: How to show or hide a div with only class without ID Pin
Ben A Johnson24-Apr-23 3:48
Ben A Johnson24-Apr-23 3:48 
Questionwant to help in javascript code Pin
Member 1592799418-Feb-23 4:33
Member 1592799418-Feb-23 4:33 
AnswerRe: want to help in javascript code Pin
Richard Deeming19-Feb-23 21:56
mveRichard Deeming19-Feb-23 21:56 
QuestionJavascript Pin
niveditha2216-Feb-23 22:20
niveditha2216-Feb-23 22:20 
AnswerRe: Javascript Pin
CHill6016-Feb-23 22:21
mveCHill6016-Feb-23 22:21 
QuestionHow do I make an Element slide-in, after user selects choice from drop-down, then it slides out. Pin
Garry 202316-Feb-23 12:07
Garry 202316-Feb-23 12:07 
Questionapi connection culendar Pin
jagadeesh omkaram14-Feb-23 19:00
jagadeesh omkaram14-Feb-23 19:00 
AnswerRe: api connection culendar Pin
Richard MacCutchan14-Feb-23 22:05
mveRichard MacCutchan14-Feb-23 22:05 
AnswerRe: api connection culendar Pin
Dave Kreskowiak15-Feb-23 1:32
mveDave Kreskowiak15-Feb-23 1:32 
QuestionCopying from billing address to mailing address if they are the same not working correctly Pin
samflex11-Feb-23 12:15
samflex11-Feb-23 12:15 
AnswerRe: Copying from billing address to mailing address if they are the same not working correctly Pin
Richard Deeming12-Feb-23 22:02
mveRichard Deeming12-Feb-23 22:02 
GeneralRe: Copying from billing address to mailing address if they are the same not working correctly Pin
samflex13-Feb-23 5:14
samflex13-Feb-23 5:14 
QuestionAjax didn't work for cloning rows, But works for first row only Pin
amr aly3-Feb-23 8:35
amr aly3-Feb-23 8:35 
AnswerRe: Ajax didn't work for cloning rows, But works for first row only Pin
amr aly9-Feb-23 5:35
amr aly9-Feb-23 5:35 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.