librairies qui ne se chargent pas

**PrincessKC** · 23/01/2014, 11h44

bonjour Tous,

j'ai constaté que les chemins que je declare vers le webroot ne chargent pas les elements:

j'ai declaré les chemins pour charger le jquery pour mon datepicker dans ma vue add:

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
 
    <script>
		$(function() {
			$( "#datepicker" ).datepicker();
		});
    </script>
 
<div class="programs form">
	<?php echo $this->Html->css('jquery-ui-1.10.4.custom.min'); ?>
	<?php echo $this->Html->script('jquery-ui-1.10.4.min'); ?>
	<?php echo $this->Html->script('jquery-ui-1.10.4.custom.min'); ?>
 
<?php echo $this->Form->create('Program', array(
    'inputDefaults' => array(
        'class' => 'form-horizontal',
		'id' => 'form-validate',
        'action' => 'forms-validation.html'
        ))
    )
; ?>
 
	<fieldset>
		<legend><?php echo __('Ajouter un Projet'); ?></legend>
	<div class="form-row row-fluid">
			<div class="span6">
				<div class="row-fluid">
					<?php
						echo $this->Form->input('datedebut', array('label' => '<p style="font-weight:bold; text-decoration:underline;">Debut</p>',
								'id'=> 'datepicker', 'type' =>'text', 'value' => date('d-M-Y')));
 
								echo $this->Form->input('datefin', array('label' => '<p style="font-weight:bold; text-decoration:underline;">Fin</p>',
								'id'=> 'datepicker', 'type' =>'text', 'value' => date('d-M-Y')));
 
 
					?>
				</div>
			</div>
        </div>
	</fieldset>
 
						<div class="submit">							 
							<button class="btn marginR10">
								<span class="minia-icon-checkmark-2"></span>
								<?php echo $this->Form->submit(__('Valider', true), array('name' => 'ok', 'div' => false));
								?>								
							</button>
 
							<?php //echo $this->Form->submit(__('Cancel', true), array('name' => 'cancel','div' => false)); ?>
 
							<button class="btn marginR10">
							<span class="icomoon-icon-list-view"></span>
							<?php echo $this->Html->link(__('Listes'), array('action' => 'index')); ?>
							</button>
 
						 </div>
						  <?php echo $this->Form->end();?>
</div> 
 
</div>

* j'ai telechargé la librairie du jquery

* j'ai copié les js du jquery dans le dossier \app\webroot\js\

* j'ai copié les css du jquery dans le dossier \app\webroot\css\

svp montrez-moi mon erreur, pourquoi ça ne charge pas le jquery? merci

**ch0c4** · 23/01/2014, 13h00

Dans ton code tu appelles ton script avant de charger la librairie js.

C'est normal que sa fonctionne pas

essaye un truc du genre

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
 
 
 
 
<div class="programs form">
	<?php echo $this->Html->css('jquery-ui-1.10.4.custom.min'); ?>
	<?php echo $this->Html->script('jquery-ui-1.10.4.min'); ?>
	<?php echo $this->Html->script('jquery-ui-1.10.4.custom.min'); ?>
 
<?php echo $this->Form->create('Program', array(
    'inputDefaults' => array(
        'class' => 'form-horizontal',
		'id' => 'form-validate',
        'action' => 'forms-validation.html'
        ))
    )
; ?>
 
	<fieldset>
		<legend><?php echo __('Ajouter un Projet'); ?></legend>
	<div class="form-row row-fluid">
			<div class="span6">
				<div class="row-fluid">
					<?php
						echo $this->Form->input('datedebut', array('label' => '<p style="font-weight:bold; text-decoration:underline;">Debut</p>',
								'id'=> 'datepicker', 'type' =>'text', 'value' => date('d-M-Y')));
 
								echo $this->Form->input('datefin', array('label' => '<p style="font-weight:bold; text-decoration:underline;">Fin</p>',
								'id'=> 'datepicker', 'type' =>'text', 'value' => date('d-M-Y')));
 
 
					?>
				</div>
			</div>
        </div>
	</fieldset>
 
						<div class="submit">							 
							<button class="btn marginR10">
								<span class="minia-icon-checkmark-2"></span>
								<?php echo $this->Form->submit(__('Valider', true), array('name' => 'ok', 'div' => false));
								?>								
							</button>
 
							<?php //echo $this->Form->submit(__('Cancel', true), array('name' => 'cancel','div' => false)); ?>
 
							<button class="btn marginR10">
							<span class="icomoon-icon-list-view"></span>
							<?php echo $this->Html->link(__('Listes'), array('action' => 'index')); ?>
							</button>
 
						 </div>
						  <?php echo $this->Form->end();?>
</div> 
 
</div>
 
<script>
		$(function() {
			$( "#datepicker" ).datepicker();
		});
    </script>

**PrincessKC** · 24/01/2014, 09h56

ça ne marche toujours pas

Envoyé par ch0c4

Dans ton code tu appelles ton script avant de charger la librairie js.

C'est normal que sa fonctionne pas

essaye un truc du genre

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
 
 
 
 
<div class="programs form">
	<?php echo $this->Html->css('jquery-ui-1.10.4.custom.min'); ?>
	<?php echo $this->Html->script('jquery-ui-1.10.4.min'); ?>
	<?php echo $this->Html->script('jquery-ui-1.10.4.custom.min'); ?>
 
<?php echo $this->Form->create('Program', array(
    'inputDefaults' => array(
        'class' => 'form-horizontal',
		'id' => 'form-validate',
        'action' => 'forms-validation.html'
        ))
    )
; ?>
 
	<fieldset>
		<legend><?php echo __('Ajouter un Projet'); ?></legend>
	<div class="form-row row-fluid">
			<div class="span6">
				<div class="row-fluid">
					<?php
						echo $this->Form->input('datedebut', array('label' => '<p style="font-weight:bold; text-decoration:underline;">Debut</p>',
								'id'=> 'datepicker', 'type' =>'text', 'value' => date('d-M-Y')));
 
								echo $this->Form->input('datefin', array('label' => '<p style="font-weight:bold; text-decoration:underline;">Fin</p>',
								'id'=> 'datepicker', 'type' =>'text', 'value' => date('d-M-Y')));
 
 
					?>
				</div>
			</div>
        </div>
	</fieldset>
 
						<div class="submit">							 
							<button class="btn marginR10">
								<span class="minia-icon-checkmark-2"></span>
								<?php echo $this->Form->submit(__('Valider', true), array('name' => 'ok', 'div' => false));
								?>								
							</button>
 
							<?php //echo $this->Form->submit(__('Cancel', true), array('name' => 'cancel','div' => false)); ?>
 
							<button class="btn marginR10">
							<span class="icomoon-icon-list-view"></span>
							<?php echo $this->Html->link(__('Listes'), array('action' => 'index')); ?>
							</button>
 
						 </div>
						  <?php echo $this->Form->end();?>
</div> 
 
</div>
 
<script>
		$(function() {
			$( "#datepicker" ).datepicker();
		});
    </script>

**PrincessKC** · 24/01/2014, 10h24

Erreurs sur la console Javascript de google chrome:

Code :

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

1
2
3
4
5
6
7
8
9
10
 
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost/zebra/public/css/zebra_form.css
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost/gsmarches/js/jquery-ui-1.10.4.min.js
Uncaught ReferenceError: jQuery is not defined jquery-ui-1.10.4.custom.min.js:6
Uncaught ReferenceError: $ is not defined add:550
body.scrollTop is deprecated in strict mode. Please use 'documentElement.scrollTop' if in strict mode and 'body.scrollTop' only if in quirks mode.
body.scrollLeft is deprecated in strict mode. Please use 'documentElement.scrollLeft' if in strict mode and 'body.scrollLeft' only if in quirks mode.
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost/zebra/public/javascript/jquery-1.9.0.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost/zebra/public/javascript/zebra_form.js
event.returnValue is deprecated. Please use the standard event.preventDefault() instead.

**ch0c4** · 24/01/2014, 13h24

dans ton erreur je vois sa

Code :

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

1
2
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost/zebra/public/css/zebra_form.css
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost/gsmarches/js/jquery-ui-1.10.4.min.js

et

Code :

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

1
2
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost/zebra/public/javascript/jquery-1.9.0.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost/zebra/public/javascript/zebra_form.js

quand je vois un dossier /public/ sa me fait penser à laravel ^^ et les chemins ne sont pas bon.

et sinon je viens de créer un projet cakephp et j'ai installé jquery et jquery-ui,
j'ai mis mes js dans app/webroot/js/ et mon css dans app/webroot/css/

voila mon code
app/View/Layouts/default.ctp

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title></title>
 
 
</head>
<body>
	<?php echo $this->fetch('content'); ?>
</body>
</html>

et dans app/View/Pages/home.ctp

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<?php echo $this->Html->css('jquery-ui.min'); ?>
<?php echo $this->Html->script('jquery'); ?>
<?php echo $this->Html->script('jquery-ui.min') ?>
 
 
<div id="test"></div>
 
 
<script>
	$(document).ready(function() {
		$('#test').html('ceci est un test');
	});
</script>

et mon "ceci est un test" s'affiche correctement

quand je regarde le code source avec chrome je vois

Code :

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

1
2
3
4
 
<link rel="stylesheet" type="text/css" href="/cakephp/css/jquery-ui.min.css">
<script type="text/javascript" src="/cakephp/js/jquery.js"></script>
<script type="text/javascript" src="/cakephp/js/jquery-ui.min.js"></script>

Je ne suis pas sur que tu es mis tes fichier au bon endroit sinon tu n'as pas le mod_rewrite ou bien ton .htaccess n'est pas correcte dans ton dossier app.

**PrincessKC** · 24/01/2014, 13h59

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
<?php 
		echo $this->Html->css('jquery-ui'); 
		echo $this->Html->script('jquery-1.10.2'); 
		echo $this->Html->script('jquery-ui');
	?>
 
<script>
		$(function() {
			$( "#datepicker" ).datepicker();
		});
    </script>

ça marche partiellement car...j'ai 2 datepicker à afficher. ce n'est qu'un seul qui s'affiche.

**ch0c4** · 24/01/2014, 14h22

Si tu dois afficher tes 2 datepicker sur la même page c'est un souci de jquery et maintenant tu n'est plus sur le bon forum ^^

mais voila un peu d'aide.

Si tu as 2 datepicker tu dois définir 2 balise id différents exemple avec cakephp

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
 
<?php echo $this->Form->input('date1', array('id' => 'datepicker1'); ?>
<?php echo $this->Form->input('date2', array('id' => 'datepicker2'); ?>
 
<script>
$(function() {
    $( "#datepicker1" ).datepicker();
    $( "#datepicker2" ).datepicker();
});
</script>

Normalement tes 2 input devrait afficher un datepicker voila la doc de jquery
http://jqueryui.com/datepicker/#date-range

**PrincessKC** · 24/01/2014, 14h35

thanks, it's work!! je vais lire la doc sur jquery, merci encore

Envoyé par ch0c4

Si tu dois afficher tes 2 datepicker sur la même page c'est un souci de jquery et maintenant tu n'est plus sur le bon forum ^^

mais voila un peu d'aide.

Si tu as 2 datepicker tu dois définir 2 balise id différents exemple avec cakephp

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
 
<?php echo $this->Form->input('date1', array('id' => 'datepicker1'); ?>
<?php echo $this->Form->input('date2', array('id' => 'datepicker2'); ?>
 
<script>
$(function() {
    $( "#datepicker1" ).datepicker();
    $( "#datepicker2" ).datepicker();
});
</script>

Normalement tes 2 input devrait afficher un datepicker voila la doc de jquery
http://jqueryui.com/datepicker/#date-range

librairies qui ne se chargent pas [CakePHP]

Bibliothèques et frameworks PHP

Discussions similaires

Partager

Partager