<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="panel-body"> <form action="" method="POST" id="stepThreeForm" novalidate=""> <input type="hidden" name="user_pk" value="1"> <input type="hidden" name="csrfmiddlewaretoken" value="DrFbCEuo96eF8wbxupyHbwBkYW1VElM7"> <h3>Bénéficiares</h3><hr> <div class="row"> <div class="col-sm-6"> <div class="row"> <div class="col-xs-6"> <div class="form-group"> <label>Quartier</label> <select class="form-control" name="quartier" id="quartierSelect" data-parsley-id="4"> <option value="">Choissisez...</option> <option value="25">HITIMAHANA</option> <option value="ALL">Tous quartiers</option> </select> </div> </div> <div class="col-xs-6"> <div class="form-group"> <label>Tranche Age</label> <div class="select2-container form-control" id="s2id_ageTSelect"><a href="javascript:void(0)" class="select2-choice" tabindex="-1"> <span class="select2-chosen" id="select2-chosen-1">Choissisez...</span><abbr class="select2-search-choice-close"></abbr> <span class="select2-arrow" role="presentation"><b role="presentation"></b></span></a><label for="s2id_autogen1" class="select2-offscreen"></label><input class="select2-focusser select2-offscreen" type="text" aria-haspopup="true" role="button" aria-labelledby="select2-chosen-1" id="s2id_autogen1"><div class="select2-drop select2-display-none select2-with-searchbox"> <div class="select2-search"> <label for="s2id_autogen1_search" class="select2-offscreen"></label> <input type="text" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" class="select2-input" role="combobox" aria-expanded="true" aria-autocomplete="list" aria-owns="select2-results-1" id="s2id_autogen1_search" placeholder=""> </div> <ul class="select2-results" role="listbox" id="select2-results-1"> </ul></div></div><select class="form-control select2-offscreen" name="age" id="ageTSelect" data-parsley-id="6" tabindex="-1" title=""> <option value="">Choissisez...</option> <option value="1">0-5 ans</option> <option value="3">11-15 ans</option> <option value="4">16-20 ans</option> <option value="5">21-25 ans</option> <option value="6">26-50 ans</option> <option value="7">50-65 ans</option> <option value="2">6-10 ans</option> <option value="8">Plus 65 ans</option> <option value="9">Tous Ages</option> </select> </div> </div> </div> </div> <div class="col-sm-6"> <div class="row"> <div class="col-xs-6"> <div class="row"> <div class="col-xs-10"> <div class="form-group"> <label>Caracteristique</label> <div class="select2-container form-control" id="s2id_charSelect"><a href="javascript:void(0)" class="select2-choice" tabindex="-1"> <span class="select2-chosen" id="select2-chosen-2">Choissisez...</span><abbr class="select2-search-choice-close"></abbr> <span class="select2-arrow" role="presentation"><b role="presentation"></b></span></a><label for="s2id_autogen2" class="select2-offscreen"></label><input class="select2-focusser select2-offscreen" type="text" aria-haspopup="true" role="button" aria-labelledby="select2-chosen-2" id="s2id_autogen2"><div class="select2-drop select2-display-none select2-with-searchbox"> <div class="select2-search"> <label for="s2id_autogen2_search" class="select2-offscreen"></label> <input type="text" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" class="select2-input" role="combobox" aria-expanded="true" aria-autocomplete="list" aria-owns="select2-results-2" id="s2id_autogen2_search" placeholder=""> </div> <ul class="select2-results" role="listbox" id="select2-results-2"> </ul></div></div><select class="form-control select2-offscreen" name="caracteristique" id="charSelect" data-parsley-id="8" tabindex="-1" title=""> <option value="">Choissisez...</option> <option value="15">Animateur périscolaire</option> <option value="13">Collégiens REP+</option> <option value="10">Décrocheurs scolaires</option> <option value="14">Élèves en difficultés scolaires</option> <option value="4">Enfants sous assistance éducative</option> <option value="3">individu ou couple</option> <option value="16">Parents désoeuvrés face aux difficultés scolaires de leurs enfants</option> <option value="7">Personnes éloignées de l'emploi</option> <option value="5">Personnes en déficiences physiques ou mentales</option> <option value="6">Personnes en perte d'autonomie</option> <option value="17">Personnes en surpoids ou obèse</option> <option value="1">Personnes issues de foyer à faible revenu</option> <option value="2">Personnes livrées à elles mêmes</option> <option value="8">Public repéré par les services sociaux</option> <option value="11">Référents de quartier</option> <option value="12">Représentants d'associations</option> <option value="9">Tous public</option> </select> </div> </div> <div class="col-xs-2"> <button type="button" class="btn btn-primary btn-icon" data-toggle="modal" data-target="#addObjModal" data-objtype="2" style="margin-top:24px;"><i class="fa fa-plus"></i></button> </div> </div> </div> <div class="col-xs-6"> <div class="row"> <div class="col-xs-10"> <label>NB</label> <input type="number" min="0" step="1" class="form-control" id="numberInput" name="number" placeholder="00" data-parsley-id="10"> </div> <div class="col-xs-2"> <button type="button" class="btn btn-success btn-icon" style="margin-top:24px;" id="addToTable"><i class="fa fa-table"></i></button> </div> </div> </div> </div> </div> </div><div class="row"> <div class="col-sm-12"> <div class="card-box"> <div class="table-responsive"> <div class="" id="indvDisable"> <table class="table table-bordered m-0" id="resultsTable"> <thead> <tr> <th>Quartier</th> <th>Caracteristique</th> <th>Tranche Age</th> <th>Nombre</th> <th>Modif.</th> </tr> </thead> <tbody> </tbody> </table> </div> </div> </div> </div> </div> <hr> <h3>Encadrement et intervenants</h3><h5>Intervenants bénévoles</h5><div class="row"> <div class="col-sm-4"> <div id="div_id_benevoles" class="form-group"> <label for="id_benevoles" class="control-label "> Benevoles </label> <div class="controls "> <input class="addMeInt numberinput form-control" id="id_benevoles" name="benevoles" type="number" data-parsley-id="12"> </div> </div> </div> <div class="col-sm-4"> <div id="div_id_accompangnateurs" class="form-group"> <label for="id_accompangnateurs" class="control-label "> Accompangnateurs </label> <div class="controls "> <input class="addMeInt numberinput form-control" id="id_accompangnateurs" name="accompangnateurs" type="number" data-parsley-id="14"> </div> </div> </div> </div> <h5>Intervenants rémunérés</h5><div class="row"> <div class="col-sm-4"> <div id="div_id_int_prestataire" class="form-group"> <label for="id_int_prestataire" class="control-label "> Int prestataire </label> <div class="controls "> <input class="addMeInt numberinput form-control" id="id_int_prestataire" name="int_prestataire" type="number" data-parsley-id="16"> </div> </div> </div> <div class="col-sm-4"> <div id="div_id_CDD" class="form-group"> <label for="id_CDD" class="control-label "> CDD </label> <div class="controls "> <input class="addMeInt numberinput form-control" id="id_CDD" name="CDD" type="number" data-parsley-id="18"> </div> </div> </div> <div class="col-sm-4"> <div id="div_id_autre_intervenant" class="form-group"> <label for="id_autre_intervenant" class="control-label "> Autre intervenant </label> <div class="controls "> <input class="addMeInt numberinput form-control" id="id_autre_intervenant" name="autre_intervenant" type="number" data-parsley-id="20"> </div> </div> </div> </div> <h5>Salariés</h5><div class="row"> <div class="col-sm-4"> <div id="div_id_permanents" class="form-group"> <label for="id_permanents" class="control-label "> Permanents </label> <div class="controls "> <input class="addMeInt numberinput form-control" id="id_permanents" name="permanents" type="number" data-parsley-id="22"> </div> </div> </div> <div class="col-sm-4"> <div id="div_id_agents_communaux" class="form-group"> <label for="id_agents_communaux" class="control-label "> Agents communaux </label> <div class="controls "> <input class="addMeInt numberinput form-control" id="id_agents_communaux" name="agents_communaux" type="number" data-parsley-id="24"> </div> </div> </div> </div> <div class="buttonHolder"> <input type="submit" name="submit" value="Etape 4" class="btn btn-primary btn-success pull-right" id="submit-id-submit"> </div> </form> </div>