• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Ustawianie wartości wszystkich pól "select"

VPS Starter Arubacloud
0 głosów
521 wizyt
pytanie zadane 30 grudnia 2016 w JavaScript przez Rico305 Nowicjusz (170 p.)

Witam, nie programowałem do tej pory nic w JS ani z wykorzystaniem JQuery, stąd to pytanie.

Mam na swojej stronie kilka pól typu select, do każdego użytkownika jedno. Czy istnieje sposób, aby ustawić dla wszystkich użytkowników na raz tą samą wartość pola select?

(obrazek, gdyby ktoś nie zrozumiał o co mi chodzi)

3 odpowiedzi

+2 głosów
odpowiedź 30 grudnia 2016 przez Vento Pasjonat (17,120 p.)
wybrane 30 grudnia 2016 przez Rico305
komentarz 30 grudnia 2016 przez Rico305 Nowicjusz (170 p.)
Pogubiłem się w sposobie dołączenia  kodu js do strony, nie do końca wiem jak to zrobić
komentarz 30 grudnia 2016 przez Vento Pasjonat (17,120 p.)
Napisz, której linijki nie rozumiesz, to postaram się wytłumaczyć :)
komentarz 30 grudnia 2016 przez Rico305 Nowicjusz (170 p.)
Ogólnie w jaki sposób podłączyć kod js do strony
komentarz 30 grudnia 2016 przez Vento Pasjonat (17,120 p.)

Tworzysz nowy plik z rozszerzeniem js i dodajesz go do dokumentu za pomocą:

<script src="ścieżka dostępu"></script>

Kod też możesz umieścić pomiędzy znaczkami 

<script>
   //kod javascript
</script>

w dokumencie HTML 

komentarz 30 grudnia 2016 przez Rico305 Nowicjusz (170 p.)
W pliku index.html mam stworzoną stronę (w zasadzie skopiowaną)

<!DOCTYPE HTML>
<html lang="pl">
<head>
	<meta charset="utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
	  <script src="ddl.js"></script>
	</head>
<body>
	<select id="main">
	  <option value="1">Pozycja 1</option>
	  <option value="2">Pozycja 2</option>
	  <option value="3">Pozycja 3</option>
	</select>

	<select class="option">
	  <option value="1">Pozycja 1</option>
	  <option value="2">Pozycja 2</option>
	  <option value="3">Pozycja 3</option>
	</select>
	
	<select class="option">
	  <option value="1">Pozycja 1</option>
	  <option value="2">Pozycja 2</option>
	  <option value="3">Pozycja 3</option>
	</select>
	
	<select class="option">
	  <option value="1">Pozycja 1</option>
	  <option value="2">Pozycja 2</option>
	  <option value="3">Pozycja 3</option>
	</select>
	
	<select class="option">
	  <option value="1">Pozycja 1</option>
	  <option value="2">Pozycja 2</option>
	  <option value="3">Pozycja 3</option>
	</select>
</body>		
</html>

A do pliku ddl.js skopiowałem kod:

	document.querySelector('#main').addEventListener('input', function(){
		var value = this.value;
		var element = document.querySelectorAll('.option');
		for(var x=0;x<element.length;x++)
			{
				element[x].value = value;
			}
		}, false);

Coś jednak na stronie nie działa :/

komentarz 30 grudnia 2016 przez Vento Pasjonat (17,120 p.)
Podepnij ten plik na końcu przed znacznikiem </body>
komentarz 30 grudnia 2016 przez Rico305 Nowicjusz (170 p.)
Wielkie dzięki, działa
+1 głos
odpowiedź 30 grudnia 2016 przez Roger Użytkownik (680 p.)

Zakładając, że we wszystkich dropdownach będą się znajdować te same wartości, można to zrobić poprzez ustawienie selectedIndex.

Przygotowałem dla Ciebie rozwiązanie bez użycia JQuery: https://jsfiddle.net/ge6foodf/9/

komentarz 30 grudnia 2016 przez Rico305 Nowicjusz (170 p.)
Wielkie dzięki! Udało mi się to zrobić kombinując przez php, ale to rozwiązanie jest duuużo bardziej praktycznie i wygodniejsze. Jeszcze raz wielkie dzięki!
komentarz 30 grudnia 2016 przez Vento Pasjonat (17,120 p.)
Wszystko spoko, ale eventów javascriptowych nie używa się w środku HTML'a jest to poważny błąd mieszania warstw aplikacji :) Polecam za to:

https://developer.mozilla.org/pl/docs/Web/API/Element/addEventListener
komentarz 30 grudnia 2016 przez Roger Użytkownik (680 p.)
Tak, masz jak najbardziej rację, chciałem tylko dla osoby, która nie ma zbyt dużego doświadczenia z JavaScriptem przygotować jak najprostszy przykład.

Do potwierdzenia tego co napisał Vento: http://stackoverflow.com/questions/5871640/why-is-using-onclick-in-html-a-bad-practice
komentarz 30 grudnia 2016 przez Vento Pasjonat (17,120 p.)
@Rico305

Polecam jeszcze poczytać o:

http://twig.sensiolabs.org/

Albo ogólnie o systemach szablonów w php :)
0 głosów
odpowiedź 30 grudnia 2016 przez surfeliza Stary wyjadacz (11,260 p.)

Podobne pytania

+1 głos
3 odpowiedzi 158 wizyt
pytanie zadane 20 czerwca 2021 w HTML i CSS przez Zawoj11 Użytkownik (850 p.)
0 głosów
2 odpowiedzi 177 wizyt
pytanie zadane 26 lutego 2018 w JavaScript przez Andrzej Czarny Użytkownik (720 p.)
+3 głosów
1 odpowiedź 472 wizyt
pytanie zadane 18 listopada 2018 w JavaScript przez Pszemeek Początkujący (370 p.)

92,453 zapytań

141,262 odpowiedzi

319,086 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...