Jump to content

SUBIECTE NOI
« 1 / 5 »
RSS
Probleme baterie Samsung A54

Schema statie auto Renegade REN 1...

Magazine IT de incredere

Parere SKODA Octavia 3 2.0TDI 150CP
 Achizitie telefon 1000-1200lei

Unde gasesc o lampa buna pe gaz?

Consulta specialiștii... Und...

Fostul director al Frontex: Comis...
 Construire anexa lipita de casa

Ce folositi pentru urina mirosito...

Socializare in prezenta copiilor

Cont Samsung A32
 Hotarare definitiva a instantei, ...

Laptop office 2500 lei

un ceai bun

sugerarea bacsisului de catre pat...
 

Numarare clik-uri cu JS

* - - - - 1 votes
  • Please log in to reply
3 replies to this topic

#1
geotux

geotux

    Junior Member

  • Grup: Junior Members
  • Posts: 49
  • Înscris: 12.07.2019
Salut !

Am un tag select cu posibilitate de selectie multipla.
Dupa ce selectez Item1 si Item2, dedesubt apare o lista de forma:
- Buton Item1
- Buton Item2

La click pe buton trebuie sa apara numarul de click-uri, asa:
- Buton Item1 3
- Buton Item2 5

Dar la mine apare asa:
- Buton Item1 8
- Buton Item2

Adica toate clickurile sunt afisate la primul element din lista

Codul meu:
<!doctype html>
<html lang="en">
<head>
	 <meta http-equiv="X-UA-Compatible" content="IE=edge">
	 <meta charset="utf-8">
	 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
	 <title>Play with select box</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" />
	 <link href="Bootstrap-4-Multi-Select-BsMultiSelect/dist/css/BsMultiSelect.css" rel="stylesheet" type="text/css">
</head>
<body>
<h1>Alege mai multe rase</h1>
<br />
<select name="states" id="example" class="form-control" multiple="multiple" style="display: none;" style="width:auto;">
<option value="Boxer">Boxer</option>
<option value="Dog German">Dog German</option>
<option value="Doberman">Doberman</option>
<option value="Cane Corso">Cane Corso</option>
<option value="Dog Argentinian">Dog Argentinian</option>
</select>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"></script>
<script src="./Bootstrap-4-Multi-Select-BsMultiSelect/dist/js/BsMultiSelect.js"></script>
<script>
$(function() {
	 $("#example").bsMultiSelect({cssPatch : {
				 choices: {columnCount:'3' },
			 }});
$('#example').on('change', function() {
	 var mytext = $( "#example option:selected" ).text();
	 $('ul#rasa').append('<li><input type="submit" name="btnCount" value="Count" onclick="return Count();" id="btnCount" />' +mytext+ '&nbsp;&nbsp;<span id="lblShow"></span></li>');
});
});
// numarare clik-uri
var count = 0;
function Count() {
	 count++;
	 $('#lblShow').text(count);
	 return false;
}
</script>
<br /><br />
<ul id="rasa"></ul>
</body>
</html>



#2
robbie_ro

robbie_ro

    Active Member

  • Grup: Members
  • Posts: 1,840
  • Înscris: 24.08.2004
Prima problema ar fi aici:
$('#lblShow').text(count);

Acest selector ( $('#lblShow') ) returneaza primul element cu id 'lblShow' gasit in pagina (deci va fi intotdeauna primul element din lista).
Plus ca nu vad unde anume selectezi valoarea care era inainte de a da click (pentru fiecare element), pentru a o incrementa. Este incrementata doar valoare unei variablie "count", indiferent de optiunea pe care dai click.

Edited by robbie_ro, 16 February 2023 - 14:47.


#3
mercur68

mercur68

    Active Member

  • Grup: Members
  • Posts: 1,425
  • Înscris: 07.08.2007
Problema din codul tău este că toate butoanele de numărare au același identificator de ID, ceea ce face ca funcția Count() să adauge numărătorul la primul element din listă pentru fiecare buton de numărare apăsat.
Pentru a rezolva această problemă, poți adăuga un identificator de ID unic pentru fiecare buton de numărare și pentru fiecare etichetă span de afișare a numărătorului. În mod ideal, poți folosi o variabilă care se mărește pentru fiecare element adăugat la listă și adaugi valoarea acestei variabile în identificatorul de ID pentru fiecare buton și etichetă span.
Iată cum poți modifica codul pentru a rezolva problema:
javascript

chatGPT said:

$(function() {
var counter = 0; // variabila pentru numaratorul de elemente adaugate
$("#example").bsMultiSelect({
	cssPatch: {
	 choices: {
		columnCount: '3'
	 },
	}
});
$('#example').on('change', function() {
	var mytext = $("#example option:selected").text();
	counter++;
	// adauga butonul si eticheta span cu ID-uri unice
	$('ul#rasa').append('<li><input type="submit" name="btnCount" value="Count" onclick="return Count(' + counter + ');" id="btnCount' + counter + '" />' + mytext + '&nbsp;&nbsp;<span id="lblShow' + counter + '"></span></li>');
});
});
function Count(counter) {
var count = parseInt($('#lblShow' + counter).text() || 0);
count++;
$('#lblShow' + counter).text(count);
return false;
}
Această soluție va adăuga un număr unic la fiecare ID de buton și etichetă span pentru fiecare element adăugat în listă, astfel încât funcția Count() să actualizeze numai eticheta span asociată butonului care a fost apăsat.

Solutia oferita de https://chat.openai.com, sper sa te ajute

Edited by MarianG, 16 February 2023 - 19:46.
chatGPT nu stie sa puna tag-uri code


#4
geotux

geotux

    Junior Member

  • Grup: Junior Members
  • Posts: 49
  • Înscris: 12.07.2019
Super ! Multumesc mult !

Anunturi

Bun venit pe Forumul Softpedia!

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Forumul Softpedia foloseste "cookies" pentru a imbunatati experienta utilizatorilor Accept
Pentru detalii si optiuni legate de cookies si datele personale, consultati Politica de utilizare cookies si Politica de confidentialitate