Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript][HTML]bootstrap-select nie wyświetla obrazka w <option>
Forum PHP.pl > Forum > Przedszkole
lekosm2
Witajcie, do mojego kodu dodałem bootstrap-select > https://github.com/silviomoreto/bootstrap-select

Kod wygląda tak:
  1. <select class="selectpicker" multiple>
  2. <optgroup label="Rangi dodatkowe" data-max-options="4">
  3. <option><img src="data:image/png;base64,'.$group['icon'].'" /> Nazwa </option>
nospor
http://silviomoreto.github.io/bootstrap-select/examples/
1) Nigdzie w tych przykladach nie widze, by pozwalano na obrazki
2) jak bardzo chcesz tam wlozyc html to musisz uzyc atrybut data-content
Tak ciezko przejrzec przyklady?
lekosm2
Cytat(nospor @ 11.04.2017, 09:58:05 ) *
http://silviomoreto.github.io/bootstrap-select/examples/
1) Nigdzie w tych przykladach nie widze, by pozwalano na obrazki
2) jak bardzo chcesz tam wlozyc html to musisz uzyc atrybut data-content
Tak ciezko przejrzec przyklady?

Nie działa.

Znalazłem jeszcze tu przykład pod nazwą Select with Thumbnails:
https://thdoan.github.io/bootstrap-select/examples.html

Zrobiłem tak jak jest tam, ale obrazków nadal nie wyświetla
nospor
Zamiast pisac "Nie dziala" to pokaz kod po poprawkach, bo calkiem mozliwe ze wstawiles go zle.
lekosm2
Cytat(nospor @ 11.04.2017, 11:51:54 ) *
Zamiast pisac "Nie dziala" to pokaz kod po poprawkach, bo calkiem mozliwe ze wstawiles go zle.


  1. <!-- Bootstrap core CSS -->
  2. <link href="css/bootstrap.css" rel="stylesheet">
  3. <link href="css/bootstrap-select.min.css" rel="stylesheet">
  4.  
  5. <select title="Select your surfboard" class="selectpicker">
  6. <option>Select...</option>
  7. <option data-thumbnail="images/icon-chrome.png">Chrome</option>
  8. <option data-thumbnail="images/icon-firefox.png">Firefox</option>
  9. <option data-thumbnail="images/icon-ie.png">IE</option>
  10. <option data-thumbnail="images/icon-opera.png">Opera</option>
  11. <option data-thumbnail="images/icon-safari.png">Safari</option>
  12.  
  13.  
  14.  
  15. <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
  16. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  17. <!-- Include all compiled plugins (below), or include individual files as needed -->
  18. <script src="js/bootstrap.min.js"></script>
  19. <script src="js/bootstrap-select.js"></script>


Obrazki też pobrałem i wrzuciłem do właściwego folderu /images
nospor
Operujesz teraz na dwoch roznych libach. Jeden ma wsparcie dla thumnails (ten drugi), jeden nie ma (ten pierwszy).
Co by sie upewnic: ladujesz teraz wlasciwy lib?
lekosm2
Cytat(nospor @ 11.04.2017, 12:54:40 ) *
Operujesz teraz na dwoch roznych libach. Jeden ma wsparcie dla thumnails (ten drugi), jeden nie ma (ten pierwszy).
Co by sie upewnic: ladujesz teraz wlasciwy lib?


Jak usunąłem <script src="js/bootstrap.min.js"></script>
To lista z pozycjami w menu w ogóle się nie rozwijała, a jak usunąłem <link href="css/bootstrap.css" rel="stylesheet"> to cały select się rozpadł.
nospor
Nie kazalem ci usawac. Mowilem, bys zaladowal wlasciwy lib
lekosm2
Cytat(nospor @ 11.04.2017, 13:46:26 ) *
Nie kazalem ci usawac. Mowilem, bys zaladowal wlasciwy lib


A tak? Użyłem lib'ów z chmury
https://jsfiddle.net/8Lxvy19j/

Tu też nie działa.
nospor
facepalmxd.gif

Zrozum w koncu: uzywasz LIBu pierwszego, a kod wstawiasz, ktory dziala dla LIBu drugiego. Ile razy mozna to tlumaczyc?
lekosm2
Cytat(nospor @ 11.04.2017, 13:53:49 ) *
facepalmxd.gif

Zrozum w koncu: uzywasz LIBu pierwszego, a kod wstawiasz, ktory dziala dla LIBu drugiego. Ile razy mozna to tlumaczyc?

No to o który lib chodzi.. bo nie wiem o co dokładnie Ci chodzi. Mógłbyś wkleić mi tą linijkę z prawidłowym libem?
(Przepraszam, ale nei ogarniam wszystkiego.. )
nospor
Moze kawe by sie troche obudzic? Podales przyklad dla thumbnail a jako przyklad podales wykorzystanie innego libu. Ten wlasnie lib masz zaladowac. To ze oba liby maja te sama nazwe, nie znaczy, ze sa takie same :/ Tam sa dwa rozne repozytoria na kazdy z libow
lekosm2
Cytat(nospor @ 11.04.2017, 14:00:37 ) *
Moze kawe by sie troche obudzic? Podales przyklad dla thumbnail a jako przyklad podales wykorzystanie innego libu. Ten wlasnie lib masz zaladowac. To ze oba liby maja te sama nazwe, nie znaczy, ze sa takie same :/ Tam sa dwa rozne repozytoria na kazdy z libow

Kawa pomogła, zamieniłem na ten: https://thdoan.github.io/bootstrap-select/j...strap-select.js

Teraz działa. smile.gif
Dzięki!
nospor
W koncu tongue.gif Brawo smile.gif A na przyszlosc zaczynaj dzien od litra kawy wink.gif
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.