[Jquery]Herinitializen van een script?

[Verwijderd]

Ik ben een soort van notitie systeem aan het maken die gedeelt wordt. Nu worden de notities opgehaald, en als er al iemand bezig is met een notitie aan het bewerken, wil ik dat andere mensen deze niet meer kunnen bewerken. Ik heb dit voor een gedeelte al klaar. Zodra een div niet meer ge-edit kan worden, gooit hij een scriptje aan dat om de 5 seconden kijkt of deze weer opgeslagen is. Maar zodra hij ziet dat hij hem opgeslagen heeft, maakt hij het divje weer normaal, maar deze is dan nog steeds niet versleepbaar/veranderbaar. Is er een mogelijk dat ik het jquery gedeelte een "refresh" geef waardoor deze div ook weer wordt meegenomen in de andere functies?

vb van script:
Refresher:

JavaScript:

<script>
var refreshId = setInterval(function() {
            $(".gray").parent().each(function() {
                $(this).load('reloadDiv.php?id='+$(this).attr('id'));
            });
        }, 5000);
</script>

Script dat er voor zorgt dat het vakje versleepbaar wordt:

JavaScript:

<Script>
$( ".resizable" ).children('.ui-widget-header').not('.gray').parent().draggable({
        start: function(event, ui) {
            $(this).css("z-index", largestZ);
            largestZ++;
            $("body").find("h3.active").removeClass("active");
            $(this).children("h3").addClass("active");
            $("body").find("div.activeDiv").removeClass("activeDiv");
            $(this).addClass("activeDiv");
        },
        stop: function(event, ui) {
            var vid = $(this).attr("id");
            var vtitle = $(this).children("h3").children('span.title').html();
            var vcontent = $(this).children('p.content').html();
            var vstyle = $(this).attr("style");
            
            $.post('saveEdits.php', { id:vid, title: vtitle, content: vcontent, style: vstyle });
        }
        });
</script>

[HyperioN]

De "draggable"-instanties (in dit geval de elementen .ui-widget-header) worden eenmalig gezocht tijdens het laden van het script. Als daar later een element bij komt, zal jQuery dit niet "zien" en is dat element dus niet draggable.

Je kunt dat op meerdere manieren oplossen. Je kan het "nieuwe" (gereloade) element draggable maken zodra deze gereload en weer beschikbaar is.

Ook kun je bijvoorbeeld een jQuery .live() event handler gebruiken, bijvoorbeeld mouseover, om de draggable te "herinstantieren" zodra de gebruiker over het refreshte element heengaat.
Geef de refreshte div bijvoorbeeld een de class "refreshed" mee en doe dan dit:

JavaScript:

$('div.refreshed').live('mouseover',function(){
    $(this).draggable({
      //opties
     });
    $(this).removeClass('refreshed'); //class verwijderen zodat dit stukkie code maar eenmalig is.
});

//edit:
Ik zie dat live vanaf 1.7 deprecated is en dat je .on() moet gaan gebruiken. Daar zul je hetzelfde mee kunnen bereiken though.

[ Voor 9% gewijzigd door HyperioN op 10-05-2012 11:40 ]

[Bosmonster]

Je wilt ze niet onmouseover draggable gaan maken. Dat kan issues opleveren. Daarnaast wil je het natuurlijk maar 1x doen, niet iedere mouseover.

Beste is hier gewoon bij nieuw toegevoegde elementen de draggable (eenmalig) toe te passen. Als je je code nu eens netjes in een functie zet bijvoorbeeld, kun je die eenvoudig meermalig aanroepen.

[Verwijderd]

Bosmonster schreef op donderdag 10 mei 2012 @ 15:00:
Je wilt ze niet onmouseover draggable gaan maken. Dat kan issues opleveren. Daarnaast wil je het natuurlijk maar 1x doen, niet iedere mouseover.

Beste is hier gewoon bij nieuw toegevoegde elementen de draggable (eenmalig) toe te passen. Als je je code nu eens netjes in een functie zet bijvoorbeeld, kun je die eenvoudig meermalig aanroepen.

Dat is juist waarom je de class toch ook weer weg haald?

Class bestaat > mouse over > draggable > Class word weggehaald
Class bestaat niet > is al draggable > gebeurt niks.

[HyperioN]

Bosmonster schreef op donderdag 10 mei 2012 @ 15:00:
Je wilt ze niet onmouseover draggable gaan maken. Dat kan issues opleveren. Daarnaast wil je het natuurlijk maar 1x doen, niet iedere mouseover.

Beste is hier gewoon bij nieuw toegevoegde elementen de draggable (eenmalig) toe te passen. Als je je code nu eens netjes in een functie zet bijvoorbeeld, kun je die eenvoudig meermalig aanroepen.

Daarom ook direct de klasse verwijderen na mouseover. Dan is het eenmalig
Maar verder heb je gelijk

/edit: wat Candan21 zegt

[ Voor 5% gewijzigd door HyperioN op 10-05-2012 15:23 ]

[Bosmonster]

Ah ok, half gelezen

[Verwijderd]

Maar heb het werkend, nu nog alleen een soort van push systeem er bij maken dat notes worden gedisabled zodra iemand hem aan het veranderen is.