Obsługa tablic wejściowych w formularzach ekspresowych?

Question

Powiedzmy muszę zmieniać partię przedmiotów tego samego rodzaju na tej samej stronie:

//-jade 
form(action='', method='POST') 
    for each message_id in messages_ids 
     input(type='text', name='message', id='#{message_id}') 
     input(type='text', name='author', id='#{message_id}') 
    input(type='submit', value='Send') 

wiem Nie będę w stanie przetworzyć takiej formy na backend Bo id - to przyzwyczajenie zostać wysłany do backendu. Czy jest jednak jakiś sposób na zrobienie tego? Chciałbym uzyskać coś takiego na backend:

//js 
for (var i = 0; i <= req.body.message.length; i++) { 
    console.log (
     'ObjectID: ' + req.body.message[i].id, //-? null, just to show what I'm trying to get 
     'Message: ' + req.body.message[i], 
     'Author: ' + req.body.author[i] 
    ); 
} 

To pseudokod (nie będzie działać). Jakieś pomysły?

P.S. Dostaję jak to zrobić bez AJAX

Answer 1

Dla bodyParser.urlencoded, jeśli ustawisz opcję trueextended atrybut nazwy formatu property[nestedProperty] będą interpretowane przez bodyParser middleware jak:

{ property: nestedPropert: $value } 

Wystarczy być pamiętaj, aby zainicjować middleware tak:

app.use(bodyParser.urlencoded({ extended: true }); 

Następnie zmienić powyższą deklarację formularz mieć właściwość wiadomość być przedmiotem, zamiast łańcucha wartość, tak jak poniżej:

form(action='', method='POST') 

    - for (var i = 0; i < messages_ids.length; i++) 
     - var message_id = messages_ids[i] 
     //- so we're treating each index like a property of `message` 
     input(type='text', name='messages[#{i}][message]') 
     input(type='text', name='messages[{#{i}}][author]') 
     input(type='hidden', name='messages[#{i}][id]', value='#{message_id}') 

    input(type='submit', value='Send') 

a potem, po stronie serwera, request.body.messages byłby obiekt, który wygląda następująco:

{ 
    "messages": { 
    "1": { 
     "message": $message1, 
     "author": $author1, 
     "id": $id1 
    }, 
    "2": { 
     "message": $message2, 
     "author": $author2, 
     "id": $id2 
    } /* , ... */ 
    } 
} 

a następnie można łatwo przekonwertować request.body.messages do tablicy:

var messages = Array.prototype.slice.call(request.body.messages); 

a teraz, powinieneś być w stanie uzyskać dostęp do poszczególnych elementów jak tak (uwaga: wolę styl funkcjonalny, ale będę to zgodne z Ciebie):

for (var i = 0; i < messages.length; i++) { 
    console.log({ 
    'ObjectId' + messages[i].id, 
    'Message' + messages[i].message, 
    'Author' + messages[i].author 
    }); 
} 

PS: jeśli zastanawiasz się od stylu funkcjonalnym, to tutaj jest:

messages.forEach(function (message) { 
    console.log(
    'ObjectId' + message.id, 
    'Message' + message.message, 
    'Author' + messages.author 
); 
}); 

Edit: specjalny dzięki @eye_mew za wskazanie, że musimy ustawić extended do true.