0

How can I populate a child dropdown list by parent dropdown selected item?

For example:

I have a list of ItemType, with this values:

[
 {id: 1, name: "Type 1"},
 {id: 2, name: "Type 2"},
 {id: 3, name: "Type 3"}
]

And I have another list, Item, with this values:

[
 {id: 1, name: "Item 1", itemTypeId: 1 },
 {id: 2, name: "Item 2", itemTypeId: 2 },
 {id: 3, name: "Item 3", itemTypeId: 3 },
 {id: 4, name: "Item 4", itemTypeId: 3 }
]

When I select some ItemType in , I need to go to my DB, find out which Item belongs to itemTypeId selected and populate a new dropdown list

<form:select name="itemTypeId" path="itemTypeId" class="form-control">
    <c:forEach var="item" items="${itemTypeList}">
        <form:option value="${item.id}" label="${item.name}"></form:option>
    </c:forEach>
</form:select>

<!-- This select must have only items that belongs to itemTypeId selected above -->
<form:select name="itemId" path="itemId" class="form-control">
    <c:forEach var="item" items="${itemList}">
        <form:option value="${item.id}" label="${item.name}"></form:option>
    </c:forEach>
</form:select>

Please, help me!

Thanks.

Mateus Barcelini
  • 15
  • 5

1 Answers1

0

In the first form, you can write one action method that sends it to servlet1 then you can find the value of the 2nd list based on itemTypeId and send it back to your page. For more details see this.

kameshsr
  • 327
  • 3
  • 13