Barre de progression ne se rafraichit pas

**M.sarah1988** · 09/07/2014, 16h09

slt, j'ai un problème est ce vous pouvez m'indiquer ou je dois modifier pour que mon progress bar se charge dynamiquement sans avoir besoin à cliquer sur un bouton dans l'interface, ici c'est la fonction permettant le calcul et le chargement du progress bar

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
function modifValues(date, valeur_totale){
	var diff = {};
	date1 = Date.now();
	date2 = new Date(date)
	var tmp=Date.now()-date2;
	tmp = Math.floor(tmp/1000);             // Nombre de secondes entre les 2 dates
   	diff.sec = tmp % 60;                    // Extraction du nombre de secondes
        tmp = Math.floor((tmp-diff.sec)/60);    // Nombre de minutes (partie entière)
        diff.min = tmp ;                    // Extraction du nombre de minute
	return Math.min(100.00*(diff.min/valeur_totale),100);
}

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
$(function() {
	//the form wrapper (includes all forms)
	var $form_wrapper	= $('#form_wrapper'),
	//the current form is the one with class active
	$currentForm	= $form_wrapper.children('form.active'),
	//the change form links
	$linkform		= $form_wrapper.find('.linkform');
	//get width and height of each form and store them for later						
	$form_wrapper.children('form').each(function(i){
		var $theForm	= $(this);
		//solve the inline display none problem when using fadeIn fadeOut
		if(!$theForm.hasClass('active'))
			$theForm.hide();
		$theForm.data({
			width	: $theForm.width(),
			height	: $theForm.height()
		});
	});
	//set width and height of wrapper (same of current form)
	setWrapperWidth();
	/*
	clicking a link (change form event) in the form
	makes the current form hide.
	The wrapper animates its width and height to the 
	width and height of the new current form.
	After the animation, the new form is shown
	*/
	$linkform.bind('click',function(e){
		var $link	= $(this);
		var target	= $link.attr('rel');
		$currentForm.fadeOut(400,function(){
			//remove class active from current form
			$currentForm.removeClass('active');
			//new current form
			$currentForm= $form_wrapper.children('form.'+target);
			//animate the wrapper
			$form_wrapper.stop()
				 .animate({
					width	: $currentForm.data('width') + 'px',
					height	: $currentForm.data('height') + 'px'
				 },500,function(){
					//new form gets class active
					$currentForm.addClass('active');
					//show the new form
					$currentForm.fadeIn(400);
				 });
		});
		e.preventDefault();
	});
	function setWrapperWidth(){
		$form_wrapper.css({
			width	: $currentForm.data('width') + 'px',
			height	: $currentForm.data('height') + 'px'
		});
	}
	/*
	for the demo we disabled the submit buttons
	if you submit the form, you need to check the 
	which form was submited, and give the class active 
	to the form you want to show
	*/
	$('#find').click(function(e){
		e.preventDefault();
		var serie = $('#serial').val();
		var param = 'num_serie='+serie;
		$.ajax({
			type: "POST",
			url: WEBROOT + '/index/GetDisque',
			data: param,
			dataType: 'json',
			async: false,
			success: function(data) {
				$('#wdt').val(data.D_T);
				$('#wd').val(data.W_D);
				$('#wfs').val(data.W_F_S);
				$('#capacite').val(data.Capacity);
				$('#model').val(data.Model);
				$('#desc').val(data.Description);
				$('#SMART_S').val(data.SMART_S);
				$('#N_ON_H').val(data.N_ON_H);
				setInterval(function(){modifValues(); },3000);
			}
		});
	});
	$('#save').click(function(e){
		e.preventDefault();
		var serie = $('#num_serie').val();
		var wdt = $('#wdt2').val();
		var wd = $('#wd2').val();
		var wfs = $('#wfs2').val();
		var capacite = $('#capacite2').val();
		var model = $('#model2').val();
		var desc = $('#desc2').val();
		var N_ON_H = $('#N_ON_H2').val();
		var SMART_S = $('#SMART_S2').val();
		var param = 'num_serie='+serie+'&wdt='+wdt+'&wd='+wd+'&wfs='+wfs+'&model='+model+'&capacite='+capacite+'&desc='+desc+'&NONH='+N_ON_H+'&SMARTS='+SMART_S;
		$.ajax({
			type: "POST",
			url: WEBROOT + '/index/SaveDisque',
			data: param,
			dataType: 'json',
			async: false,
			success: function(data) {
				console.log(data);
				if (data === 0){
					window.location.reload();
				}
			}
		});
	});	
	$('#findall').click(function(e){
		e.preventDefault();
		var fin = $('#date_fin').val();
		var debut = $('#date_debut').val();
		var param = 'd_fin='+fin+'&d_debut='+debut;
		var html=''
		$.ajax({
			type: "POST",
			url: WEBROOT + '/index/GetDisqueDate',
			data: param,
			dataType: 'json',
			async: false,
			success: function(data) {
				$.each(data,function(index,val){
					html+= '<tr><td>'+val.SN+'</td>';
					html+='<td>'+val.Model+'</td>';
					html+='<td>'+val.Capacity+'</td>';
					html+='<td>'+val.W_F_S+'</td>';
					html+='<td>'+val.W_D+'</td>';
					html+='<td>'+val.Description+'</td>';
					html+='<td>'+val.D_T+'</td>';   
					html+='<td>'+val.N_ON_H+'</td>';
					html+='<td>'+val.SMART_S+'</td>';//.toFixed(2)
					html+='<td><div id="progress"><p><strong>'+ modifValues(val.D_T,val.W_D).toFixed(2) +'%</strong></p><progress value=' +  modifValues(val.D_T,val.W_D)+ ' min="0" max="100"></progress></div></td></tr>'
				});
				$("#keywords tbody").html(html);
			}
		});
	});
});

le chargement du progress bar et le changement du valeur du % ne change que lorsque je clique sur le bouton Find