ouverture de box dans jquery file upload

Version imprimable

01/08/2011, 08h14
doud180878

ouverture de box dans jquery file upload

Bonjour,

je suis ne train de mettre en place une application qui me permettrait de faire un rognage d'une photo.

J'ai installé un jquery file upload et je voudrais que lorsque je clique sur la photo je puisse l’ouvrir dans une box qui me premettait de la retravailler.

problème c'est que le systeme de base m’empêche l'ouverture

est ce que vous auriez une idée
01/08/2011, 11h24
SpaceFrog

Citation:

problème c'est que le systeme de base m’empêche l'ouverture

je ne vois pas l'ergonomie de ton système ...

tu souhaites cropper une image avant upload ?
01/08/2011, 13h11
doud180878

Oui voilà je cherche a Jcrooper une image.

En fait dans mon applic je charge mes images grâce a jquery file upload et ensuite je voudrais cliquez dessus pour les ouvrir et les Jcropper.

J'ai trouver le plug pour les cropper, mais je voudrais que ce soit dans une lightbox.

J’espère que tu vois ce que je veux dire. Après il y a peut être plus simple

Merci
01/08/2011, 13h33
SpaceFrog

je ne vois pas de différence entre attribuer un jcropper dans une lightbox ou ailleurs ...
applique ton jcropper sur l'element dans le lightbox...
01/08/2011, 15h23
doud180878

En fait dans le fichier de jqurery files upload j'ai une zone qui est définit en template avec des liens qui apparaissent quand l'upload c'est fait.

D'origine quand je clique dessus j'ai mon image qui apparait dans une autre fenêtre. Si je veux installer une box , une fancybox ou un facebox, rien ne se produit.. Bizarre.

Merci.
01/08/2011, 15h35
SpaceFrog

parce que ton jcropper n'est pas défini en live()

soit tu l'attribues en live ou tu le réattribues après avoir ouvert ton box

Alors voila comment ca se passe dans le fichier ou je télécharge les images :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
literal}
<script id="template-upload" type="text/x-jquery-tmpl">
    <tr class="template-upload{{if error}} ui-state-error{{/if}}">
        <td class="preview"></td>
        <td class="name">${name}</td>
        <td class="size">${sizef}</td>
        {{if error}}
            <td class="error" colspan="2">Error:
                {{if error === 'maxFileSize'}}File is too big
                {{else error === 'minFileSize'}}File is too small
                {{else error === 'acceptFileTypes'}}Filetype not allowed
                {{else error === 'maxNumberOfFiles'}}Max number of files exceeded
                {{else}}${error}
                {{/if}}
            </td>
        {{else}}
            <td class="progress"><div></div></td>
            <td class="start"><button>Démarrer</button></td>
        {{/if}}
        <td class="cancel"><button>Arrêter</button></td>
    </tr>
</script>
<script id="template-download" type="text/x-jquery-tmpl">
    <tr class="template-download{{if error}} ui-state-error{{/if}}">
        {{if error}}
            <td></td>
            <td class="name">${name}</td>
            <td class="size">${sizef}</td>
            <td class="error" colspan="2">Erreur:
                {{if error === 1}}File exceeds upload_max_filesize (php.ini directive)
                {{else error === 2}}File exceeds MAX_FILE_SIZE (HTML form directive)
                {{else error === 3}}File was only partially uploaded
                {{else error === 4}}No File was uploaded
                {{else error === 5}}Missing a temporary folder
                {{else error === 6}}Failed to write file to disk
                {{else error === 7}}File upload stopped by extension
                {{else error === 'maxFileSize'}}File is too big
                {{else error === 'minFileSize'}}File is too small
                {{else error === 'acceptFileTypes'}}Filetype not allowed
                {{else error === 'maxNumberOfFiles'}}Max number of files exceeded
                {{else error === 'uploadedBytes'}}Uploaded bytes exceed file size
                {{else error === 'emptyResult'}}Empty file upload result
                {{else}}${error}
                {{/if}}
            </td>
        {{else}}
            <td class="preview">
                {{if thumbnail_url}}
                    <a class="apercu" rel="apercu" href="${url}" ><img src="${thumbnail_url}"></a>
                {{/if}}
            </td>
            <td class="name">
                <a class="nyroModal" href="${url}">${name}</a>
            </td>
            <td class="size">${sizef}</td>
            <td colspan="2"></td>
        {{/if}}
        <td class="delete">
            <button data-type="${delete_type}" data-url="${delete_url}">Delete</button>
        </td>
    </tr>
</script>
 {/literal}

ensuite quand je veux agrandir l'image ou l'ouvrir dans un fichier php pour la traiter je ne peux pas

J'ai mis des classes pour pouvoir ensuite lancer une box

02/08/2011, 08h19
SpaceFrog

je ne connais pas ce type de script qui à l'air d'insérer du code html brut dans la page à la manière des echo php. 8O text/x-jquery-tmpl
Je ne peux donc pas t'aider sur la manière de rendre ces éléments reconnus par le DOM...
De plus de la mise en page avec des table ... :roll:
02/08/2011, 12h46
doud180878

merci :)
17/08/2011, 07h32
doud180878

Bonjour, je déterre le post car je voudrais arriver quand même à trouver une solution.

Je voudrais savoir comment je peux utiliser les fichiers qui sont nécessaire au fonctionnement du plug

Rappel : jquery file upload

Dans cet exemple, il y a la boite de dialogue.

Merci