Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: problem z tekstem.
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
dawidessa
Cześć. Mam problem. Mam funkcję w JS, która po kliknięciu w SPANa dodaje do elementu o id "test" kolejne nazwy po przecinku. Szablon mam w bootstrapie. Budowa wygląda tak:
container, w nim row, row podzielony na lg-9 i lg-3. W lg-3 jest div z width 100%. Ten div ma właśnie id test. Problem w tym, że gdy już kończy się miejsce w divie, to linia sie nie łamie tylko js ignoruje ją i dodaje kolejne nazwy ciagle w prawo aż stroną można przesuwać w poziomie (pojawia się pasek na dole). Podobnie jest z dodawaniem cookies. Po każdym kliknięciu, do cookies zapisuje po przecinku id wraz z nazwa, problem w tym, że ta nazwa w końcu się nie dodaje (chyba).

  1. document.getElementById("test").innerHTML=save+', '+namx;


cookies:
  1. var getcokie = readCookie("testcookie");
  2. document.cookie="testcookie="+getcokie+","+idg+":"+namx;


podgląd:
- tutaj widać jak nie chcą dodawać się kolejne elementy zapisu.

kafowi
Wklej tutaj cały kod, bo na podstawie tych zapisów wiele ci nikt nie powie (albo przynajmniej ja).
dawidessa
  1. function readCookie(name) {
  2. name += '=';
  3. for (var ca = document.cookie.split(/;\s*/), i = ca.length - 1; i >= 0; i--)
  4. if (!ca[i].indexOf(name))
  5. return ca[i].replace(name, '');
  6. }
  7.  
  8.  
  9. function getToFridge(idg,namx) {
  10. var uid = idg;
  11. var save = document.getElementById("fridge").innerHTML;
  12. var getcokie = readCookie("fridgecode");
  13.  
  14. if (getcokie.match("/*."+uid+".*/"))
  15. {
  16. return;
  17. }
  18.  
  19. if(save=="Brak produktów.") {
  20. document.cookie="fridgecode="+idg+":"+namx;
  21. document.getElementById("fridge").innerHTML='<span class="label label-info" style="margin-right: 5px;">'+namx+' <i class="fa fa-times"></i></span>';
  22. return;
  23. }
  24. document.cookie="fridgecode="+getcokie+","+idg+":"+namx;
  25. document.getElementById("fridge").innerHTML=save+
  26. '<span class="label label-info" style="margin-right: 5px;">'+namx+'<i class="fa fa-times"></i></span>';
  27. }


Pozwoliłem sobie dodać spany, ale to chyba nie ma znaczenia.
kafowi
Cytat(dawidessa @ 21.06.2015, 14:24:23 ) *
  1. function readCookie(name) {
  2. name += '=';
  3. for (var ca = document.cookie.split(/;\s*/), i = ca.length - 1; i >= 0; i--)
  4. if (!ca[i].indexOf(name))
  5. return ca[i].replace(name, '');
  6. }
  7.  
  8.  
  9. function getToFridge(idg,namx) {
  10. var uid = idg;
  11. var save = document.getElementById("fridge").innerHTML;
  12. var getcokie = readCookie("fridgecode");
  13.  
  14. if (getcokie.match("/*."+uid+".*/"))
  15. {
  16. return;
  17. }
  18.  
  19. if(save=="Brak produktów.") {
  20. document.cookie="fridgecode="+idg+":"+namx;
  21. document.getElementById("fridge").innerHTML='<span class="label label-info" style="margin-right: 5px;">'+namx+' <i class="fa fa-times"></i></span>';
  22. return;
  23. }
  24. document.cookie="fridgecode="+getcokie+","+idg+":"+namx;
  25. document.getElementById("fridge").innerHTML=save+
  26. '<span class="label label-info" style="margin-right: 5px;">'+namx+'<i class="fa fa-times"></i></span>';
  27. }


Pozwoliłem sobie dodać spany, ale to chyba nie ma znaczenia.

Wrzuć to gdzieś, chociażby: https://jsfiddle.net/
Chodzi o możliwość zobaczenia kodu wynikowego.
dawidessa
Wiem już co jest winowajcą - span. Nie mogę tego nigdzie wrzucić, ponieważ efekt jest wymaga użycia phpa (ajax) + podlinkowania bootstrapa.


#edit:
winowajcą jest budowa klasy label i label-info w bootstrapie. Można zamknąć.

#edit2:
gdyby ktoś miał podobny problem: z klasy .label w bootstrapie należy pozbyć się white-space nowrap.
Comandeer
Nie span, tylko Bootstrap, który dla .label przywala white-space: nowrap i wymusza wyświetlanie w jednej linii
dawidessa
Tak już teraz wiem jak zajrzałem w CSS bootstrapa, nie miałem pojęcia że jest tam nowrap.
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.