La llamada del datepicker en <div> no funciona
Publicado por Intentando ser programador (3 intervenciones) el 03/03/2016 18:50:01
Buenas chicos, por favor llevo 1 semana intentando solucionar este problema y no me deja avanzar, os voy a pegar el codigo fuente de una pagina principal donde se muestran los datos yo cuando hago clic en el boton "Afagir usuari"
me llama la capa donde es un formulario en ese formulario hay un apartado de "data" que es fecha donde quiero implementar el calendario, pero no funciona, si borro todo el codigo del body y pongo <input type="text" class="form-control" id="al"> el calendario funciona correctamente pero si pongo todo el codigo de ajax y script por el medio no funciona, espero que me podais ayudar :D.
me llama la capa donde es un formulario en ese formulario hay un apartado de "data" que es fecha donde quiero implementar el calendario, pero no funciona, si borro todo el codigo del body y pongo <input type="text" class="form-control" id="al"> el calendario funciona correctamente pero si pongo todo el codigo de ajax y script por el medio no funciona, espero que me podais ayudar :D.
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
141
142
143
144
145
146
147
148
149
150
151
152
153
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Gestio de taules amb AJAX</title>
<link rel="stylesheet" href="jquery-ui-1.9.2/themes/base/jquery.ui.all.css">
<link href="css/bootstrap.min.css" rel="stylesheet">
<script src="jquery-ui-1.9.2/jquery-1.8.3.js" ></script>
<script src="jquery-ui-1.9.2/ui/jquery.ui.core.js" ></script>
<script src="jquery-ui-1.9.2/ui/jquery.ui.widget.js" ></script>
<script src="jquery-ui-1.9.2/ui/jquery.ui.datepicker.js" ></script>
<script>
$(function() {
$( "#al" ).datepicker();
});
</script>
</head>
<body onload="viewdata()">
<input type="text" class="form-control" id="al">
<h1 align="center">Gestio de taules amb AJAX</h1>
<p><br/></p>
<div class="container">
<!-- buto de trigger modal de bootstrap--><button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">
Afageix nou client
</button>
<br/>
<!-- Modal --><div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Afageix nou usuari</h4>
</div>
<div class="modal-body">
<form>
<div class="form-group">
<label for="nm">Nom</label>
<input type="text" class="form-control" id="nm">
</div>
<div class="form-group">
<label for="gd">Cognom</label>
<input type="text" class="form-control" id="gd">
</div>
<div class="form-group">
<label for="pn">Telefon</label>
<input type="text" class="form-control" id="pn">
</div>
!-- Aqui es donde tiene que ir el calendario en la etiqueta data pero no va, la llamo con el identificador "al" :(--><div class="form-group">
<label for="al">Data</label>
<input type="text" class="form-control" id="al">
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Tancar</button>
<button type="button" id="save" class="btn btn-primary">Guardar</button>
</div>
</div>
</div>
</div>
<div id="info"></div>
<br/>
<div id="viewdata"></div>
</div>
<!-- Jquery botstrap descargable desde la pagina bootstrap --><script src="js/jquery.min.js"></script>
<!-- Plugins de bootstrap --><script src="js/bootstrap.min.js"></script>
<!-- Funcio per mostrar les dades--><script>
function viewdata(){
$.ajax({
type: "GET",
url: "php/dates.php"
}).done(function( data ) {
$('#viewdata').html(data);
});
}$('#save').click(function(){
<!-- Creem les variables dels caps de la taula-->var nm = $('#nm').val();
var gd = $('#gd').val();
var pn = $('#pn').val();
var al = $('#al').val();
<!-- Fusionem les variables dels caps en una general-->var datas="nm="+nm+"&gd="+gd+"&pn="+pn+"&al="+al;
$.ajax({
type: "POST",
url: "php/altes.php",
data: datas}).done(function( data ) {
$('#info').html(data);
viewdata();
$('#myModal').hide();
});
});
function updatedata(str){
var id = str;var nm = $('#nm'+str).val();
var gd = $('#gd'+str).val();
var pn = $('#pn'+str).val();
var al = $('#al'+str).val();
var datas="nm="+nm+"&gd="+gd+"&pn="+pn+"&al="+al;
$.ajax({
type: "POST",
url: "php/editar.php?id="+id,
data: datas}).done(function( data ) {
$('#info').html(data);
viewdata();
});
}function deletedata(str){
var id = str;$.ajax({
type: "GET",
url: "php/borrar.php?id="+id
}).done(function( data ) {
$('#info').html(data);
viewdata();
});
}</script>
<input type="text" id="al">
</body>
</html>
Valora esta pregunta
0