Gå til innhold

[Løst] Identifisere eit objekt å slette med Javascript. Troleg ei enkel sak..


Anbefalte innlegg

Hei!

No har det seg slik at eg har laga eit mappesystem kor ein kan bla gjennom mapper enkelt nok. PHP'en har eg roen nok på, så eg klarer å gjere deg eg vil, men så vil eg ha litt javascript for å få det heile til å sjå litt lekrare ut.

Så, eg har altså jQuery og jQuery UI slik at ein kan dra ei mappe til eit søppelspann for å slette det. Men elementene som kan dras til søppelet er class elementer - korleis identifisere eg det som blir truffet, for så å slette det med ein confirm?

Eg vil at om ein trykker på "OK" så skal sida hoppe videre til ei side som sletter elementet frå ID. Men korleis får eg tak i denne ID'en med javascript?!

 

Mogleg eg snakker mykje tøys no, her er koden for å dra elemtene:

 

$(function() {
       $(".mappefgalleri").draggable({
               revert: true
       });
       $("#trash").droppable({
               tolerance: 'touch',
               over: function() {
                      $(this).css('opacity', '1.0');
               },
               out: function() {
                       $(this).css('opacity', '0.5');
               },
               drop: function() {
                       var answer = confirm('Er du sikker på at du vil slette dette galleriet fullstendig? Handlingen kan ikke angres.');
                       $(this).css('opacity', '0.5');
               }
       });
});

 

Og her er koden til kvart element. Frå ein echo med PHP.

<div class='mappefgalleri'><img src='grafikk/folder.png'><br/><a href='bildegalleri.php?mappe=$katalogid'>$mappenavn</a></div>

 

Eg trenger altså å få tak i denne katalogid'en i javascripet. Slik at brukaren vart sendt til ei ny side. Sei at sida heiter slett.php?slettid=$katalogid

 

Korleis i alle dager skal eg gjere dette?

Lenke til kommentar
Videoannonse
Annonse

Jeg ville slengt katalogid i en attributt, via PHP.

 

Om du bruker html5 kan du slenge den inn i data-katalog-id="5", men i html4/xhtml må du bruke en attributt som allerede eksisterer for <div>, som f.eks. title="5".

 

Title "Specifies extra information about an element", så det passer jo bra.

 

Alternativ 2: Bruk litt triksing med strings.

 

$(function() {
       $(".mappefgalleri").draggable({
               revert: true
       });
       $("#trash").droppable({
               tolerance: 'touch',
               over: function() {
                      $(this).css('opacity', '1.0');
               },
               out: function() {
                       $(this).css('opacity', '0.5');
               },
               drop: function() {
		// Finn linken, ut i fra toppelementet this (altså diven)
		alert($("a", this).attr("href"));
		// Vill tipping angående hvordan man henter href. sjekk docs.
		// Deretter henter du siste tegnet i href
                       var answer = confirm('Er du sikker på at du vil slette dette galleriet fullstendig? Handlingen kan ikke angres.');
                       $(this).css('opacity', '0.5');
               }
       });
});

Endret av gommle
Lenke til kommentar

Feilen er at jeg har brukt this når jeg egentlig mente tingen som droppes, ikke tingen man dropper på. Bytt ut this med objektet som slippes, og det burde funke.

 

Jeg finner ikke svaret i dokumentasjonen, men jeg tror det er meningen å sette det andre argumentet til f.eks. 'ui'. Da får du inni funksjonen et jQuery-objekt ui.draggable. Jeg får det ikke til å funke tho.

Endret av gommle
Lenke til kommentar

$(function() {
       $(".mappefgalleri").draggable({
               revert: true
       });
       $("#trash").droppable({
               tolerance: 'touch',
               over: function() {
                      $(this).css('opacity', '1.0');
               },
               out: function() {
                       $(this).css('opacity', '0.5');
               },
               drop: function(event, ui) {
					// Finn linken, ut i fra toppelementet this (altså diven)
					alert($("a", ui.draggable).attr("title"));
                       var answer = confirm('Er du sikker på at du vil slette dette galleriet fullstendig? Handlingen kan ikke angres.');
                       $(this).css('opacity', '0.5');
               }
       });
});

 

CALLBACK sitt andre argument var det ;)

Endret av gommle
Lenke til kommentar

Den koden jeg postet fungerer med

 

<div class="mappefgalleri">
	<a href="onehref.lol" title="2">Drag me!</a>
</div>

<div id="trash">
	yay.
</div>

 

Den andre parameteren til jQuery-funksjonen spesifiserer scope.

 

Hvis scope er jQuery-objektet til div-en som blir dratt (altså ui.draggable), vil $("a", ui.draggable) starte INNI div-en. Ikke fra roten av hele dokumentet.

 

$("body") vil starte fra document og gå videre til den finner body. Hvis man da bruker dette objektet som scope vil du ikke kunne finne "head title" inni der.

Endret av gommle
Lenke til kommentar

Eg misforstod her. Fullstendig.

Tenkte at title taggen skulle vere inni div taggen. Altså <div class='namn' title='id'>.

Så tenkte eg óg på i lenkja, men den skal jo gå ei anna plass. Men selvfølgeleg kan eg ha title som noko anna. Nei, eg har eg berre gått litt i stå. Beklager, men tusen takk likevel. No fungerer det utmerka, du redda heile dagen. :love:

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
  • Hvem er aktive   0 medlemmer

    • Ingen innloggede medlemmer aktive
×
×
  • Opprett ny...