crop et rafraichissement d'image
Bonjour,
je suis en train de mettre en place un crop lors de l'upload d'une image. Jusqu'ici tout fonctionne bien, j'upload mon image, une boite de dialogue s'ouvre,
je redimensionne mon image, en même temps mon image apparait sur le coté de mon applic.
Impec sauf que je suis obliger de faire un f5 sur la partie administration comme sur le partie front pour l'image apparaisse redimensionné ???
Est ce que vous auriez une idée pour que mon image apparaisse directement redimensionner sans faire d'f5
Merci voici mon code :
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
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
| <script type="text/javascript">
// On ouvre la boite de dialogue qui va me permettre de cropper l'image
$(function()
{
// On ouvre la boite de dialogue qui va me permettre de cropper l'image
$( "#box_image" ).dialog
({
autoOpen: {autoOpen},
show: "slide",
height: "350",
width: "350",
modal: true,
buttons:
{
Fermer: function()
{
$( this ).dialog( "close" );
}
},
close: function() { }
});
//Le bouton pour déclencher la boite d'aide
$(document).ready(function() {
$(window).load(function(){
var api = $.Jcrop('#cropbox',{
onChange: updateCoords,
onSelect: updateCoords,
setSelect: [ 0, 0, 201, 113 ],
addClass: 'custom',
bgColor: 'black',
bgOpacity: .4,
sideHandles: false,
aspectRatio: 201/113
});
var isCtrl = false;
$(document).keyup(function (e) {
api.setOptions({ aspectRatio: 0 });
api.focus();
if(e.which == 17) isCtrl=false;
}).keydown(function (e) {
if(e.which == 17) isCtrl=true;
if(e.which == 81 && isCtrl == true) {
api.setOptions({ aspectRatio: 1 });
api.focus();
}
});
});
/* var width = $("#cropbox").attr("width");
if(width != '0' && width < '950')
{
alert(' les dimensions ne sont pas bonnes. Elles doivent être supérieurs à 950 de longeur et 450 de hauteur');
};*/
});
function updateCoords(c)
{
$('#handw').show();
$('#x').val(c.x);
$('#y').val(c.y);
$('#w').val(c.w);
$('#h').val(c.h);
$('#pich').html(c.h);
$('#picw').html(c.w);
};
function checkCoords()
{
if (parseInt($('#w').val())) return true;
alert('Please select a crop region then press submit.');
return false;
};
});
</script> |
