{% extends "baseadmin.html.twig" %}

{% block content %}

	<div class="content-wrapper">
		<section class="content-header">
			<div class="container-fluid">
				<div class="row mb-2">
					<div class="col-sm-6">
						<h1>Ajouter des photos</h1>
					</div>


				</section>


				<section class="content">
					<div class="container-fluid">
						<div class="row">

							<div class="col-md-12">


								<div class="card card-primary">
									<div class="card-header">
										<h3 class="card-title">Ajouter des photos</h3>
									</div>


									<form method="post" action="" enctype="multipart/form-data">
										<div class="card-body">
											<div class="form-group">
												{{ form(form) }}
												</form>
											</div>

										</div>


									</div>


								</div>

							</div>
								{% endblock %}
							{% block javascripts %}
							<script>
        window.onload = () => {
            // On va chercher la categorie
            let categorie = document.querySelector("#pictures_category");
            categorie.addEventListener("change", function(){
                let form = this.closest("form");
                let data = this.name + "=" + this.value;
                
                fetch(form.action, {
                    method: form.getAttribute("method"),
                    body: data,
                    headers: {
                        "Content-Type": "application/x-www-form-urlencoded; charset:UTF-8"
                    }
                })
                .then(response => response.text())
                .then(html => {
                    let content = document.createElement("html");
                    content.innerHTML = html;
                    let nouveauSelect = content.querySelector("#pictures_album");
                    document.querySelector("#pictures_album").replaceWith(nouveauSelect);
                })
                .catch(error => {
                    console.log(error);
                })
            });
        }
    </script>
						{% endblock %}