Para ensinar-me Javascript, eu estou tentando fazer uma página web que dá aos usuários uma lista de itens (por exemplo, alimentos), pede-lhes para classificar estes alimentos de favorito para menos favorito, e enviar os dados quando eles são feitos. Usando sortables jQuery parece ser uma boa maneira de fazer isso. No entanto, eu não sei como a apresentação dos dados deve acontecer.
Aqui está o que eu estou pensando. Cada um desses itens de alimentos estaria em uma div como este:
<div id=sortable>
<div id=1 class=foods>Pizza</div>
<div id=2 class=foods>Sushi</div>
<div id=3 class=foods>Taco</div>
</div>
Quando o usuário clica em um botão enviar, eu quero o fim desses itens a ser determinado, e por esta ordenação a ser enviado de volta para o servidor (a propósito, estou usando Django no lado do servidor). Parece que pode determinar a ordem dos itens com uma função como esta:
function getOrder()
{
var foods = $(.foods);
var ids = [];
for(var x=0; x<foods.length; x++)
{
ids.push(foods[x].id);
}
return ids;
}
No entanto, eu estou preso em um par de coisas:
- Onde no meu código que eu iria chamar esta função? Eu estou pensando que seria uma ação onclick quando o usuário pressiona o botão enviar, mas não tenho certeza de onde os dados a função retorna iria conseguir passar.
- O formato seria o mais adequado para o envio desta encomenda para o servidor (por exemplo JSON)?
(Eu sei que esta é uma pergunta muito básica, mas eu nunca fiz uma página web com JavaScript antes, então esta área de programação é tudo novo para mim.)