WebHU - Programozási kérdések és válaszok

A Thymeleaf összefűzi azon beviteli mezők értékeit, ahol az objektumok attribútumnevei azonosak [duplikált]

Több objektumot adok át egy tavaszi vezérlőről a nézetbe. Ott töltök ki adatokat az átadott objektumokhoz Thymeleaf-el. A probléma az, hogy az átadott objektumok hasonló attribútumnevekkel rendelkeznek. Például az invoiceRecipientDTO-nak van egy fname, és a GuestDTO-nak is van egy fname. A probléma most a következő: Az űrlap elküldése után az összes azonos nevű beviteli mező vesszővel összefűződik.

Példa: Számla címzettje --› fnév: Teszt vendég --› fnév: XYZ

az űrlap elküldése után mindkét érték vesszővel lesz összefűzve, így a GuestDTO és az InvoiceRecipientDTO fname attribútuma Test, XYZ lesz. Mit csinálok rosszul, hogy összefűződik, és nem a megfelelő attribútumra van írva?

Már próbáltam hozzárendelni az objektumot egy div-hez, de nem változott semmit

<div th:object="${invoiceRecipientDTO}">
     <input type="text" class="form-control" id="fnameRecipient" data-item="fnameRecipient" th:field="*{fname}" required>
</div>
<div th:object="${guestDTO}">
     <input type="text" class="form-control" id="fnameGuest" data-item="fnameGuest" th:field="*{fname}" required>
</div>

Próbáltam a th:value-vel és a név hozzárendelésével is dolgozni, de az sem működött

<input type="text" class="form-control" id="fnameRecipient" data-item="fnameRecipient" name="fname" th:value="${invoiceRecipientDTO.fname}" required>

<input type="text" class="form-control" id="fnameGuest" data-item="fnameGuest" name="fname" th:value="${guestDTO.fname}" required>

Mindkét esetben mindkét beviteli mező értéke összefűződik, és az fname-hez lesz rendelve.

Jelenlegi kódom:

Vezérlő:

    @GetMapping(CREATEBOOKING_URL)
    public String createBooking(Model model) {
        InvoiceRecipientDTO invoiceRecipientDTO = InvoiceRecipientDTO.create().setId("").build();
        GuestDTO guestDTO = GuestDTO.create().setId("").build();
        model.addAttribute("guestDTO", guestDTO);
        model.addAttribute("invoiceRecipientDTO", invoiceRecipientDTO);
        return CREATEBOOKING_VIEW;
    }



    @PostMapping(BOOKINGCONFIRMATION_URL)
    public ModelAndView summaryPage(InvoiceRecipientDTO invoiceRecipientDTO, GuestDTO guestDTO) {
        GuestTypeID guestTypeID = this.guestTypeService.createGuest(guestDTO.fname(), guestDTO.lname(), guestAddressDTO);
        InvoiceRecipientID invoiceRecipientID = this.invoiceRecipientService.createInvoiceRecipient(invoiceRecipientDTO.fname(), invoiceRecipientDTO.lname(), invoiceRecipientAddressDTO, invoiceRecipientDTO.phoneNumber(), invoiceRecipientDTO.email());
        this.invoiceRecipientService.assignBooking(bookingID.id(), invoiceRecipientID.id());
        this.invoiceRecipientService.assignGuestType(guestTypeID.id(), invoiceRecipientID.id());
        this.guestTypeService.assignInvoiceRecipient(guestTypeID.id(), invoiceRecipientID.id());
        return new ModelAndView();
    }

Kilátás:

<form method="POST" th:action="@{/booking/bookingoverview}">
   <div class="form-row">
      <div class="form-guestGroup col-md-6">
            <label class="input_field_label" for="fnameRecipient">First Name</label>
            <input type="text" class="form-control" id="fnameRecipient" data-item="fnameRecipient" th:field="${invoiceRecipientDTO.fname}" required>
      </div>
   </div>    


   <div class="form-row">
        <div class="form-guestGroup col-md-6">
             <label class="input_field_label" for="fnameGuest">First Name (Guest)</label>
             <input type="text" class="form-control" data-item="fnameGuest" id="fnameGuest" th:field="${guestDTO.fname}">
        </div>
   </div>
<button type="submit" value="submit">Create Booking</button>
</form>

DTO-k:

public class InvoiceRecipientDTO {
    private String id;
    private String fname;
    private String lname;

    //getter and setter..
}

public class GuestDTO {
    private String id;
    private String fname;
    private String lname;

    //getter and setter..
}

Amikor megváltoztatom az objektumok attribútumnevét (hogy ne legyenek már azonosak), akkor működik, de nem szeretném megváltoztatni az attribútumneveket. Nincs más megoldás?


  • A html pont így működik. Ha ugyanazt a nevet használja egy mezőben, akkor az értékeket úgy fűzi hozzá. Ha több objektumot szeretne átadni azonos nevű attribútumokkal, akkor létre kell hoznia egy szülőobjektumot, amely mindkét objektumot tulajdonságként tartalmazza. Tetszik: stackoverflow.com/a/61594586/4126893 04.04.2021
  • Most próbáltam ki, de a következő hibaüzenetet kapom: Érvénytelen 'invoice' tulajdonság a komponensosztályhoz: A 'invoice' komponenstulajdonság nem olvasható, vagy érvénytelen getter metódus van benne. Valójában a változóm a private InvoiceRecipientDTO invoice, a getter pedig a public InvoiceRecipientDTO invoice(). A getter téved? 04.04.2021
  • A gettereknek és a settereknek meg kell felelniük a Java bean szabványnak – ha a Thymeleaf object.invoice-t használja, akkor getInvoice() és setInvoice() legyen. 04.04.2021
  • Működött, egész nap próbáltam javítani :) Van rá lehetőség, hogy ne nevezzük el a getInvoice-ot, mert van néhány programozási irányelvünk, és a getterünket az attribútumaink szerint kell elnevezni. Például, ha az attribútum neve invoice, akkor a gettert is invoice()-nak kell nevezni? 04.04.2021
  • Úgy tűnik, hogy ezek a programozási irányelvek közvetlen ellentétben állnak a JavaBeans elnevezési és használati konvencióival. Az olyan keretrendszerek, mint a Thymeleaf (és még sokan mások), ezekre a konvenciókra támaszkodnak, hogy lehetővé tegyék a getterek/setterek (és még sok más) dinamikus elhelyezkedését és végrehajtását. További információ itt. 05.04.2021
  • Nos, köszönöm a választ. Megkérdezem a tanárt, hogy ez rendben van-e ebben az esetben. 05.04.2021
  • Ha kemény nem, akkor kifejezetten használhatja a getter nevet. Tehát egy foo nevű mezőhöz, ahol a getFoo() helyett foo() nevű getter van, használhat olyan kifejezéseket, mint a th:text="{myObject.foo()}". 05.04.2021

Új anyagok

A rádiógomb ellenőrzött eseményének használata a jQueryben
Ebben a cikkben látni fogjuk, hogyan kell dolgozni a jquery választógombbal ellenőrzött eseményeivel. A választógombok HTML gombok, amelyek segítenek kiválasztani egyetlen értéket egy csoportból...

Körkörös függőségek megoldása terraformban adatforrásokkal – lépésről lépésre
Mi az a körkörös függőségek Dolgozzunk egy egyszerű eseten, amikor az SQS-sor és az S3-vödör közötti körkörös függőség problémája van egy egymástól függő címkeérték miatt. provider..

Miért érdemes elkezdeni a kódolást 2023-ban?
01100011 01101111 01100100 01100101 — beep boop beep boop Világunk folyamatosan fejlődik a technológia körül, és naponta fejlesztenek új technológiákat a valós problémák megoldására. Amint..

🎙 Random Noise #2  – Örökbefogadás és hit
az analitika íratlan világának gondozása Szeretné, hogy ezek a frissítések a postaládájába kerüljenek? Iratkozzon fel itt . "Ha önvezető autókat gyártanak, akkor mi miért ne..

A legrosszabb politika és prediktív modellek májátültetésre jelöltek számára az Egyesült Államokban
A máj (vagy óangolul lifer) az emberi test legnehezebb belső szervére utal, amely csendesen működik a nap 24 órájában. Mit csinál a máj? 500 feladatot hajt végre a szervezet egészségének..

5 webhely, amely 2022-ben fejleszti front-end fejlesztői készségeit
Frontendmentor.io A tényleges projektek létrehozásával a Frontendmentor.io segítséget nyújt a front-end kódolási képességeinek fejlesztésében. A kódolást azután kezdheti meg, hogy..

Mikor kell használni a Type-t az interfészhez képest a TypeScriptben?
A TypeScript a JavaScript gépelt szuperkészlete, amely statikus gépelést ad a nyelvhez. Ez megkönnyíti a robusztus és karbantartható kód írását azáltal, hogy a hibákat a fordítási időben..