<script>
$(function()
{
$('#inlineDatepick').datepick
({onSelect:
function(dates)
{
var dateText = $.datepick.formatDate(dates[0]);
var dateArr = dateText.split("/");
var IDfromDateText= dateArr[2] + dateArr[0] + dateArr[1];
if ($("#myDiv_TJour_"+IDfromDateText).length > 0)
{
// Il existe... donc j'affiche le tableau
AffichDiv(IDfromDateText);
}
else
{
// L'element n'existe pas... je le crée ...
CreaTable(IDfromDateText,dates);
// ...puis j'affiche le tableau
AffichDiv(IDfromDateText);
}
}
});
});
function CreaTable(idJour,dates)
{
//Je crée un nouveau div pour le clone du tableau d'origine
$("#Zone_Tab").append("<div name='MesTBL' id='myDiv_" + "TJour_" + idJour + "'></div>");
//On crée un tableau pour le jour X
$("#myDiv_" +"TJour_" + idJour).append('<table border="2" id="TJour_' + idJour + '"></table>').css("border","2px inset #000000");
$("#TJour_" + idJour).append('<tr align="center" id="Row1_' + idJour + '"></tr>');
//On crée un Bouton New Line
$("#Row1_" + idJour).append('<td bgcolor="#F0FFFF">New Line</td>');
//On crée un Input pour la date
$("#Row1_" + idJour).append('<td bgcolor="#F0FFFF">Date</td>');
//On crée un Select pour la tache
$("#Row1_" + idJour).append('<td bgcolor="#F0FFFF" width="160px">Request</td>');
//On crée un Input pour le Temps
$("#Row1_" + idJour).append('<td bgcolor="#F0FFFF">Time (h)</td>');
//On crée une Zone de texte pour la description
$("#Row1_" + idJour).append('<td bgcolor="#F0FFFF">Description</td>');
//On crée un Select pour le travailleur
$("#Row1_" + idJour).append('<td bgcolor="#F0FFFF"width="170px">Worker</td>');
$("#TJour_" + idJour).append('<tr align="center" id="Row2_' + idJour + '"></tr>');
//On crée un Bouton New Line
$("#Row2_" + idJour).append('<td><input type="button" value="New" style="width: 100%;" onclick="CloneLine(this.parentNode.parentNode);" id="TNewLine_' + idJour + '"></input></td>');
//On crée un Input pour la date
$("#Row2_" + idJour).append('<td><input type="date" style="width: 100%;" id="TDate_' + idJour + '"></input></td>');
//On crée un Select pour la tache
$("#Row2_" + idJour).append('<td><?php
$sql = "SELECT caetbl_people.PeopleID, caetbl_people.LastName, caetbl_people.FirstName
FROM caetbl_people
INNER JOIN caetbl_GroupList
ON caetbl_GroupList.GroupID = caetbl_people.Group
WHERE caetbl_GroupList.Group_Name='C&EA'
ORDER BY caetbl_people.LastName;";
$result = mysql_query($sql)or die("Requete pas comprise");
echo "<select style=\"width: 100%;\" id=\"TSRequest_' + idJour + '\" name=\"Table_Worker\" >" ;
while ($row=mysql_fetch_assoc($result))
{
echo "<option value=\"". $row['LastName'] ." ". $row['FirstName'] ."\">". $row['LastName'] ." ". $row['FirstName'] ."</option>\n";
}
echo "</select></td></tr>\n
</form>\n";
?></td>');
//On crée un Input pour le Temps
$("#Row2_" + idJour).append('<td><input type="text" style="width: 100%;" id="TTime_' + idJour + '"></input>');
//On crée une Zone de texte pour la description
$("#Row2_" + idJour).append('<td><textarea rows="2" cols="25" style="resize: none;" id="TTADescription_' + idJour + '"></textarea></td>');
//On crée un Select pour le travailleur
$("#Row2_" + idJour).append('<td><select style="width: 100%;" onChange="saveValue(this)" id="TSWorker_' + idJour + '"></select></td>');
// On met la valeur de la date sélectionner dans l'input TDate+idJour
var dateText = $.datepick.formatDate(dates[0]);
$("#TDate_"+idJour).val(dateText);
}
function AffichDiv(idJour)
{
//On masque TOUS les tableaux
$('div[name="MesTBL"]').hide();
// On affiche celui que l'on a selectionné
$('#myDiv_' + "TJour_" + idJour).show();
}
function CloneLine(Line)
{
newLine = Line.cloneNode(true);
Line.parentNode.insertBefore(newLine,Line);
//Line.parentNode.appendChild(newLine);
}
</script>
Voila mon problème :
J'ai une fonction JavaScript qui me crée des éléments et dans deux de ces élément il y a du PHP.
D'après se que j'ai lu on ne peut pas mettre de PHP dans une fonction JavaScript .
Comment je peut faire pour que ce la marche ?
Merci
A voir également:
[JScript+PHP] Probléme avec la création d'élément avec JScript
Ben déjà tu créés une page php qui contiendra le code php que ton ajax devra exécuter :
Fichier que je nomme : TSRequest.ajx.php
<?php
// si besoin.. tu rajoutes les fichiers de connexion à ta BDD..
$idJour = isset($_POST['id_Jour'])?$_POST['id_Jour']:'';
if ($idJour){
$sql = "SELECT caetbl_people.PeopleID
, caetbl_people.LastName
,caetbl_people.FirstName
FROM caetbl_people
INNER JOIN caetbl_GroupList
ON caetbl_GroupList.GroupID = caetbl_people.Group
WHERE caetbl_GroupList.Group_Name='C&EA'
ORDER BY caetbl_people.LastName";
$result = mysql_query($sql)or die("Erreur dans la requête ".$sql."<br>");
echo "<select style=\"width: 100%;\" id=\"TSRequest_' . $idJour . '\" name=\"Table_Worker\" >" ;
while ($row=mysql_fetch_assoc($result)){
echo "<option value=\"". $row['LastName'] ." "
. $row['FirstName'] ."\">"
. $row['LastName'] ." "
. $row['FirstName']
."</option>\n";
}
echo "</select>
</td>
</tr>
</form>";
}
?>
Dans ton code Javascript, pour appeller ce script tu fais un truc du genre :
function CreaTable(idJour,dates)
{
//Je crée un nouveau div pour le clone du tableau d'origine
$("#Zone_Tab").append("<div name='MesTBL' id='myDiv_" + "TJour_" + idJour + "'></div>");
//On crée un tableau pour le jour X
$("#myDiv_" +"TJour_" + idJour).append('<table border="2" id="TJour_' + idJour + '"></table>').css("border","2px inset #000000");
$("#TJour_" + idJour).append('<tr align="center" id="Row1_' + idJour + '"></tr>');
//On crée un Bouton New Line
$("#Row1_" + idJour).append('<td bgcolor="#F0FFFF">New Line</td>');
//On crée un Input pour la date
$("#Row1_" + idJour).append('<td bgcolor="#F0FFFF">Date</td>');
//On crée un Select pour la tache
$("#Row1_" + idJour).append('<td bgcolor="#F0FFFF" width="160px">Request</td>');
//On crée un Input pour le Temps
$("#Row1_" + idJour).append('<td bgcolor="#F0FFFF">Time (h)</td>');
//On crée une Zone de texte pour la description
$("#Row1_" + idJour).append('<td bgcolor="#F0FFFF">Description</td>');
//On crée un Select pour le travailleur
$("#Row1_" + idJour).append('<td bgcolor="#F0FFFF"width="170px">Worker</td>');
$("#TJour_" + idJour).append('<tr align="center" id="Row2_' + idJour + '"></tr>');
//On crée un Bouton New Line
$("#Row2_" + idJour).append('<td><input type="button" value="New" style="width: 100%;" onclick="CloneLine(this.parentNode.parentNode);" id="TNewLine_' + idJour + '"></input></td>');
//On crée un Input pour la date
$("#Row2_" + idJour).append('<td><input type="date" style="width: 100%;" id="TDate_' + idJour + '"></input></td>');
//On crée un Select pour la tache
$.ajax({
type: 'POST',
data: {id_Jour :idJour};
async: true,
url:'TSRequest.ajx.php',
success:function(data) {
$("#Row2_" + idJour).append('<td>'+data+'</td>');
},
error: function(error){
alert("Erreur : " + error);
}
});
//On crée un Input pour le Temps
$("#Row2_" + idJour).append('<td><input type="text" style="width: 100%;" id="TTime_' + idJour + '"></input>');
//On crée une Zone de texte pour la description
$("#Row2_" + idJour).append('<td><textarea rows="2" cols="25" style="resize: none;" id="TTADescription_' + idJour + '"></textarea></td>');
//On crée un Select pour le travailleur
$("#Row2_" + idJour).append('<td><select style="width: 100%;" onChange="saveValue(this)" id="TSWorker_' + idJour + '"></select></td>');
// On met la valeur de la date sélectionner dans l'input TDate+idJour
var dateText = $.datepick.formatDate(dates[0]);
$("#TDate_"+idJour).val(dateText);
}
NB: en général on évite de ramener du HTML par ajax...(on préfera ne ramener qu'un tableau de données qu'on manipulera ensuite dans le javascript pour créer les select ..option..etc... )
Mais vu que c'est ta "première" fois... c'est plus simple .....
PS: j'ai fait le code de tête sans le tester. Il se peut que tu rencontres quelques bugs ... mais bon.. je t'ai donné la forme. il ne te restera plus qu'à adapter/corriger pour que ça corresponde à tes besoins.
Donc avec AJAX je vais pouvoir exécuter ma fonction PHP dans mon script ?
Question : Es se que sa ne serait pas plus propre de convertir mon script entièrement en PHP.
(J'ai crus comprendre sa en lisant des forums)
Bonjour,
Je suis entrain de déboguer, le code que tu ma donner.
Au premier test l'interface ne voulait pas s'initialiser correctement.
Il y avait une coquille a la ligne
data: {id_Jour :idJour};
j'ai remplacer le ';' par une ','.
Puis j'ai refait un test le il ma mit le message d'erreur "Requete pas comprise" dans la cellule du tableau à la place du select.
J'ai alors rajouter le fichier de connexion au fichier PHP
J'ai l'impression que le select et crée car :
-il y a le bonne id dans le select
-le code et bien aller chercher les renseignements dans la base de données.
Après j'ai trouver la solution le probléme vener de
</td></tr>\n </form>\n
après les avoir supprimer sa marche .
Merci pour ton aide, bonne journée.
15 avril 2014 à 19:21
Je peut au moins voir se que je doit faire.
Bonne soirée