Bonjour à tous,
Je travaille sur un projet dans lequel j'utilise l'imbrication de formulaires. Ca marche super mis à part un détail ... Je n'arrive pas à personnaliser le visuel des champs affichés dans le formulaire imbriqué.
Dans mon exemple, l'imbrique un formulaire de type "collection" et je gère son affichage avec jQuery, de sorte à ce que l'utilisateur puisse ajouter autant de formulaire imbriqué qu'il veut.
Pour l'instant, j'affiche le formulaire tout simplement comme ceci :
{{ form_widget(form.bills) }}
</script>
$(document).ready(function() {
var $conteneur = $('#app_appbundle_quote_bills');
var $addLink = $('<a href="#" id="add_bill" class="btn">+ add line</a>');
$conteneur.append($addLink);
$addLink.click(function(e) {
addBill($conteneur);
e.preventDefault();
return false;
});
var indx = $conteneur.find(':input').length;
if (indx == 0) {
addBill($conteneur);
} else {
$conteneur.children('div').each(function() {
addDelLink($(this));
});
}
function addBill($conteneur){
var $proto = $($conteneur.attr('data-prototype').replace(/__name__label__/g, '')
.replace(/__name__/g, indx));
addDelLink($proto);
$conteneur.append($proto);
indx++;
}
function addDelLink($proto){
$delLink = $('<a href="#" class="label label-danger">Cancel</a><br/><br/>');
$proto.append($delLink);
$delLink.click(function(e) {
$proto.remove();
e.preventDefault();
return false;
});
}
});
</script>
Voilà ce que ça donne :
J'aimerais pouvoir mettre tout les champs sur une seule ligne mais je n'arrive pas à y accéder sans avoir à casser tout mon script JS.
Quelqu'un aurait une idée de comment s'y prendre ?