Spostare codice js inline in una funzione js con l'aiuto del dom

Irene Bonta'

Nuovo Utente
14 Mar 2013
2
0
0
Scusate il titolo, ma non so neanche bene io cosa vorrei fare.

Mi spiego meglio. Io ho questa parte di codice nella mia pagina html:

HTML:
            {% for user in users %}

            <form name="form_user_{{ user.id }}" method="post" action="/networks/{{ net.id }}/sensors/{{ sens.id }}/rights">
              <tr>
                <td>
                  <div>
                    {{ escape(user.name) }}
                    <input type='hidden' name="id" value='{{ user.id }}'>
                  </div>
                </td>
                <td>

                  <label class="radio inline" onclick="document.forms['form_user_{{ user.id }}'].submit();">
                    <input type="radio" name="perms" id="perms_{{user.id}}_0" value="0">
                    None
                  </label>
                  <label class="radio inline" onclick="document.forms['form_user_{{ user.id }}'].submit();">
                    <input type="radio" name="perms" id="perms_{{user.id}}_1" value="1">
                    Read
                  </label>
                  <label class="radio inline" onclick="document.forms['form_user_{{ user.id }}'].submit();">
                    <input type="radio" name="perms" id="perms_{{user.id}}_4" value="4">
                    Read + Commands
                  </label>

                  {{ xsrf_form_html() }}
                </td>

              </tr>
            </form>
            {% end %}

Questo codice mi permette, per ogni utente (user) della lista che mi invia il web server, di creare un form che non fa altro che andare ad impostare un permesso all'utente nel DB. A parte tutto quello che avviene dietro, io ho una struttura json che è una lista di utenti, con il loro nome, id e permesso.

Ora, io vorrei creare una checkbox o un pulsante radio o quant'altro, che mi permetta di assegnare in un solo click lo stesso permesso a tutti gli utenti della lista.

Pensavo quindi di creare un elemento di questo tipo:

HTML:
<tr>
                <td>
                  <div>
                    <strong>All users</strong>
                  </div>
                </td>
                <td>
                    <label class="radio inline" onclick="createFormAndSubmit();">
                    <input type="radio" name="permsall" id="all_0" value="0">
                    None
                  </label>
                  <label class="radio inline" onclick="createFormAndSubmit();">
                    <input type="radio" name="permsall" id="all_1" value="1">
                    Read
                  </label>
                  <label class="radio inline" onclick="createFormAndSubmit();">
                    <input type="radio" name="permsall" id="all_4" value="4">
                    Read + Commands
                  </label>
                </td>

              </tr>

in cima alla tabella e di ricostruire per ognu utente, come in un ciclo for, il corrispondente form da inviare al server, tramite una funzione javascript di questo tipo:

Codice:
<script>



//function that creates the form, adds some elements
//and then submits it
function createFormAndSubmit(){
    
    {% for user in users %}
    
     var submitForm = document.createElement("form_user_{{ user.id }}");
     document.body.appendChild(submitForm);
     submitForm.method = "POST";
     
     var newElement = document.createElement("<input type='hidden' name='id' value='{{ user.id }}'>");
     inputForm.appendChild(newElement);
     
     var newElement2 = document.createElement("<input type='radio' name='perms' id='perms_{{user.id}}_0' value='0'>");
     inputForm.appendChild(newElement2);
     
     submitForm.action= "/networks/{{ net.id }}/sensors/{{ sens.id }}/rights";
     document.forms['form_user_{{ user.id }}'].submit();
     //submitForm.submit();
     
    {% end %}
    
}
</script>

Questo codice non funziona ovviamente. Avrei bisogno del vostro aiuto per sistemarlo come si deve. In alternativa ho visto che ci sono degli script che aiutano a fare questo, come jQuery.dForm , ma anche qui non so bene come fare per adattarlo alle mie esigenze...

Consigli? Soluzioni?

Vi ringrazio tantissimo anticipatamente per le risposte.
 
Ciao,
ma non ti conviene semplicemente fare un unico form ed elaborare le checkbox passate per fare l'update sul db?
HTML:
<form action="pagina" method="post">
    <input type="checkbox" name="utente_1"/> Utente 1
    <input type="checkbox" name="utente_2"/> Utente 2
    <input type="checkbox" name="utente_3"/> Utente 3
    <input type="checkbox" name="utente_4"/> Utente 4
</form>
se spuntata fai l'update altrimenti no
 

Discussioni simili