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
| <?php
$champAdd = '<p><label for="birds">Ajouter un article: </label><input id="birds" type="text" name="art[]" /> <img src="../images/delete.png" alt="" border="0" id="del"/></p>';
?>
<br>
<form action="test.php" method="post">
<input type="hidden" name="date" value="<?php echo time(); ?>" />
<!--// AutoComplete jQuery UI -->
<script type="text/javascript">
$(function() {
function log(message) {
$("<div/>").text(message).prependTo("#log");
$("#log").attr("scrollTop", 0);
}
$.ajax({
url: "/liste.php",
dataType: "xml",
success: function(xmlResponse) {
var data = $("article", xmlResponse).map(function() {
return {
value: $("name", this).text() + ", " +
( $.trim( $("design", this).text() ) || "(Aucune désignation)" ),
id: $("id", this).text()
};
}).get();
$("#birds").autocomplete({
source: data,
minLength: 0,
select: function( event, ui ) {
log( ui.item ?
"Selectionn\351: " + ui.item.value + ", id: " + ui.item.id :
"L'article : " + this.value + " n'a pas \351t\351 trouv\351." );
}
});
}
});
});
</script>
<div class="ui-widget" id="facture">
<?php echo $champAdd; ?>
</div>
<div class="ui-widget" style="margin-top:2em; font-family:Arial">
Resultat:
<div id="log" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
</div>
<!-- AutoComplete jQuery UI //-->
<span id="add"><img border="0" alt="" src="../images/add.png"/> Ajouter un article</span>
<p><input type="submit" value="Générer" name="send"/></p>
</form>
<script type="text/javascript">
$(document).ready(function() {
$("span#add").live("click", function(event) {
event.preventDefault(); // empêche le traitement par défaut de l'évenement
});
$("img#del").live("click", function() {
$(this).parent().empty();
});
$("span#add").live("click", function() {
$("#facture").append('<?php echo $champAdd; ?>');
});
});
</script>
<br> |
Partager