[es] - Hitno, problem sa funkcijom toggle()

morpheusscg
Vladisav Milosavljevic
Srbija

Član broj: 81342
Poruke: 61
*.ceetel.co.yu.

Sajt: napravicu jednom

Profil

Hitno, problem sa funkcijom toggle() - JQuery

^{08.04.2009. u 14:16 - pre 183 meseci}

Pocetnik sam sa JavaScript-om i sa JQuery-om. Pravim neku funkciju u JQuery-u pa negde gresim samo ne znam gde. Problem je sledeci:

1.Prilikom ucivanja stranice zeleo bih sa mi deo stranice koju funkcija toggle() vrsi umanjivanje i uvecavanje bude ucitana po default-u umanjena, ali pri tome da mi se ne izgubi funkcionalnost +(umanjen) i -(uvecan) koje pretstavljaju clase Unfolded i Folded, tj. kad je skupljen taj deo stranice onda mi se pokazuje oznaka +(sto znaci da je umanjen i da se klikom na znak + siri isti deo stranice), a obrnuto sa oznakom -.

2. Drugi problem je u tome sto kada ovu funkciju pokrenem pomocu drugog dugmeta, clase Unfolded i Folded izgube totalno funkcionalnost ne reaguju uopste, tj. ne radi + i =.

3. Da li funkcija toggle() vraca neku povratnu vrednost, da pukusam mozda na taj nacin?

Code:

$("document").ready(function(){

               $("#Results .Content").hide() ;   //#1
               $("#Results .Content").toggle() ;//#2

                //Pokusao sam da uradim na oba nacina pojedinacno, sa gornjm kodom (#1 i #2) ali mi se izgubi fukcionalnost +(umanjen) i -(uvecan), zamene mi se vrednosti +(uvecan) i -(umanjen).


            $("#Results h2").click(function(){

            $("#Results .Content").toggle() ;
            $(this).toggleClass("Unfolded");

        })
        .addClass("Unfolded")   // Unfolded i Folded su klase za ikonice odnosno likovi sa oznakama +(umanjen) i -(uvecan)
        .addClass("Folded")
        .attr("title","Expand/Collapse Section")
        .prepend('<span class="ICN"><spring:message code="search.expand.collapse" /></span>');

    });

Svaka pomoc mi dobro dosla, reci te mi u cemu gresim , hvala svima unapred

_{[Ovu poruku je menjao morpheusscg dana 08.04.2009. u 17:13 GMT+1]}

_{[edit: dodati [code][/code] tagovi]}

_{[Ovu poruku je menjao Aleksandar Ružičić dana 08.04.2009. u 19:14 GMT+1]}

Daj vise odmora jeziku nego rukama!!!!!!!!!!!!

Odgovor na temu

Nikola Poša
Backend (PHP) developer
Beograd

Član broj: 173839
Poruke: 1616
*.adsl-3.sezampro.yu.

+33 Profil

Re: Hitno, problem sa funkcijom toggle() - JQuery

^{08.04.2009. u 15:58 - pre 183 meseci}

Čekaj, ti inicijalno možeš da podesiš da taj tvoj element na stranici bude "umanjen", i onda da mu dodeliš toggle()...

Mislim da tebi tu treba još jedna f-ja - toggleClass(class). Sam ti naziv kaže, ona toggle-uje klasu nekog elementa, a prosleđuje joj se naziv druge klase.

I onda bi recimo taj tvoj kod mogao da izgleda ovako:

Code:

<input type = "button" id = "dugme" class = "Folded" />
<div id = "test">
Neki tekst
</div>

A JavaScript kod bi imao ovo:

Code:

$(document).ready(function(){

    $("#dugme").click(function () {
      $(this).toggleClass("Unfolded");
      $('#test').toggle('slow');
    });

  });

Ako sam te ja dobro razumeo, onda bi ovo što sam napisao trebalo da reši stvar. Naravno, ti to izmeni prema svojim potrebama...

Odgovor na temu

morpheusscg
Vladisav Milosavljevic
Srbija

Član broj: 81342
Poruke: 61
*.ceetel.co.yu.

Sajt: napravicu jednom

Profil

Re: Hitno, problem sa funkcijom toggle() - JQuery

^{08.04.2009. u 17:27 - pre 183 meseci}

Code:

$("document").ready(function(){

$("#Results .Content").hide() ; //#1

    $("#Results h2").click(function(){

             $("#Results .Content").toggle() ;
             $(this).toggleClass("Unfolded");   //*******

})
.addClass("Unfolded")
.addClass("Folded")
.attr("title","Expand/Collapse Section")
.prepend('<span class="ICN"><spring:message code="search.expand.collapse" /></span>');

});

Nikola, verovatno greskom nisi video, da sam u kodu napisao funkciju $(this).toggleClass("Unfolded"), ili si hteo mozda reci da stavim tu funkciju negde na drugo mesto.

Kad pre funkcije za click na dugme, dodelim $("#Results .Content").toggle() ;, on mi bez problema ucitava sa umanjenim delom stranice, ali gubim na funkcionalnosti sto se tice linkova, jer sam CSS klase "Folded" i "Unfolded", napravio kao .gif slicice koje pretstavljaju link, i samim tim one vise nisu linkovi vec samo obicne slicice na koje mozes kliknuti, ali to ne zelim.

Takodje sam primenio $("#Results .Content").hide() ; , ali on mi obrne CSS clase "Folded" i "Unfolded", umesto da mi umanjeno pokazuje kao "Folded" a uvecano prikazuje "Unfolded".

Daj vise odmora jeziku nego rukama!!!!!!!!!!!!

Odgovor na temu

Nikola Poša
Backend (PHP) developer
Beograd

Član broj: 173839
Poruke: 1616
*.adsl-3.sezampro.yu.

+33 Profil

Re: Hitno, problem sa funkcijom toggle() - JQuery

^{08.04.2009. u 17:34 - pre 183 meseci}

Tako je, promaklo mi je to, vidiš kol'ko je bolje (čitljivije) kad kod staviš unutar tag-ova za kod... :)

Aj pošalji i taj HTML kod na koji primenjuješ taj jQuery. Meni izgleda nije jasna ideja svega toga što ti hoćeš...

Odgovor na temu

Aleksandar Ružičić
Software Architect, Appricot d.o.o.
Beograd

Član broj: 26939
Poruke: 2881

Jabber: krckoorascic@gmail.com
Sajt: krcko.net

+44 Profil

Re: Hitno, problem sa funkcijom toggle() - JQuery

^{08.04.2009. u 18:19 - pre 183 meseci}

ni meni nije jasno sta tacno zelis da postignes, tj mislim da znam na sta mislis ali si to vrlo konfuzno objasnio pa bih te zamolio da malo detaljnije (i pazljivije) opsise sta tacno hoces.

mada, koliko sam skontao ti pravis klasican expand/collapse behavior, u tom slucaju mi nije jasno zasto inicijalno setujes obe klase i "folded" i "unfolded" (koliko ja razumem, nista ne moze istovremeno da bude i otvoreno i zatvoreno...)

rafforum.rs - Forum Računarskog Fakulteta

Odgovor na temu

morpheusscg
Vladisav Milosavljevic
Srbija

Član broj: 81342
Poruke: 61
*.ceetel.co.yu.

Sajt: napravicu jednom

Profil

Re: Hitno, problem sa funkcijom toggle() - JQuery

^{09.04.2009. u 09:50 - pre 183 meseci}

Znaci karatko receno ja bih zeleo da uradim klasican expand/collapse behavior jednog div-a.

U CSS klasama sam definisao dve slicice gif formata (koje su izgleda +("Folded") i -("Unfolded")) i pretstavljaju link, na koje kada korisnik klikne treba da se izvrsi klasican expand/collapse behavior.

Problem je u tome sto expand/collapse behavior treba da mi bude po default-u collapse tj. umanjen prilikom ucitavanja same strane, gde ce mu biti class +("Folded"), prilikom klika na oznaku plus treba da se izvrsi expand i class se menja u -("Unfolded"). Ali u ovom mom kodu to radi obrnuto.

Osim toga imam jos jedan button koji se nalazi na istoj strani gde se nalazi i gore navedeni expand/collapse behavior, klikom na taj button, ukoliko je moj expand/collapse behavior=collapse(umanjen), onda bi trebalo da se izvrsi expand(uvecavanje). Ukoliko je expand(uvecan) takav treba i da ostane, ali tu nastaju problemi takodje, gubi mi se onda funkcionalnost klasa ("Folded" i "Unfolded"), ne rade uopste expand/collapse.

Nadam se da ce vam biti jasnije kad budem objasnio za cega mi treba. Na jednoj stranici postoji dva div-a, prvi div "Search" sadrzi polja sa kriterijumima za pretrazivanje.... kao i button-e (Search i Reset), a drugi div "Results" sadrzi tabelu u kojoj mi ispisuje rezultate pretrage, koji bi ustvari i bio taj klasican expand/collapse behavior, i on nevezano za div "Search" moze da se pomocu klasa ("Folded" i "Unfolded"), umanjuje i uvecava. Prilikom prvog ucitavanja te stranice div "Results", bi trebao biti collapse odnosno umanjen. Ali kad korisnik klikne na button "Search", div "Result" bi trebao da izvrsi expand (uvecavanje) i da prikaze rezultate u tabeli, ukoliko je div "Results" vec uvecan, on bi trebao ostati takav.

Nadam se da sam sad razjasnio sam problem.

Hvala svima unapred.

Daj vise odmora jeziku nego rukama!!!!!!!!!!!!

Odgovor na temu

Nikola Poša
Backend (PHP) developer
Beograd

Član broj: 173839
Poruke: 1616
79.175.99.*

+33 Profil

Re: Hitno, problem sa funkcijom toggle() - JQuery

^{09.04.2009. u 12:14 - pre 183 meseci}

Lepo je to što si sve do detalja objasnio, al' meni je nekako lakše kad vidim i taj kod. Teško mi je da zamislim sve to kad ovako opišeš rečima...

Meni samo u tom tvom kodu nije jasan taj poslednji deo:

Code:

.addClass("Unfolded")
.addClass("Folded")
.attr("title","Expand/Collapse Section")
.prepend('<span class="ICN"><spring:message code="search.expand.collapse" /></span>');

Čini mi se da je to suvišno, ili bi trebalo da ide na neko drugo mesto.

Ja mislim da bi taj tvoj kod trebao da izgleda ovako:

Code:

$("document").ready(function() {
$("#Results h2").addClass("Folded");
$("#Results h2").attr("title","Expand/Collapse Section");
$("#Results h2").prepend('<span class="ICN"><spring:message code="search.expand.collapse" /></span>');
$("#Results .Content").hide();

     $("#Results h2").click(function() {
             $("#Results .Content").toggle() ;
             $(this).toggleClass("Unfolded");
     })
});

A možda opet nisam razumeo ideju, odnosno, šta ti tačno pravi problem...

Odgovor na temu