DropForm에서 사용자 응답에 따라 여러 양식 필드 표시/숨기기

### Jotform에서 조건부 필드에 섹션 축소 사용
* 📅 이 자습서에서는 RSVP 시나리오를 예로 들어 Jotform의 섹션 축소 기능을 사용하여 사용자 응답에 따라 필드를 표시/숨기는 방법을 보여드립니다.
* 🧑 이름, 이메일, 게스트 수(0~3명) 드롭다운과 같은 기본 필드가 있는 양식을 만드는 것으로 프로세스가 시작됩니다.
* 🗂 게스트 세부 정보(이름 및 이메일)에 대해 여러 섹션이 생성되며, 각 섹션은 처음에는 숨김으로 설정된 섹션 축소 요소로 둘러싸여 있습니다.
* ⚙ 제출 버튼이 있는 중요한 추가 섹션이 추가되고 표시되도록 설정되어 게스트가 없어도 제출 옵션을 사용할 수 있습니다.
* ➕ 조건부 논리는 Jotform의 필드 표시/숨기기 조건을 사용하여 구현됩니다.  게스트 수가 1이면 게스트 1의 필드가 표시되고, 2이면 게스트 1과 2의 필드가 표시되며, 3이면 세 게스트의 필드가 모두 표시됩니다.
* ✅ 이 튜토리얼은 양식을 테스트하여 다양한 게스트 수가 적절한 필드를 동적으로 표시하는 방법을 보여주는 것으로 마무리합니다.  "매우 간단합니다!"
* 💡 이 방법은 여러 조건부 필드를 효과적으로 관리하여 깔끔하고 사용자 친화적인 양식 환경을 보장합니다.
* 🙋 ↪f_200D↩♀️ 이 동영상은 시청자가 추가 도움이 필요한 경우 질문할 수 있도록 유도합니다.

DropForm의 섹션 축소 기능을 사용하면 사용자 응답에 따라 양식 필드를 쉽게 표시하거나 숨길 수 있습니다.

Have you been wanting to show or hide multiple fields based on how someone answers one of your questions? Let me

show you how with section collapse. [Music] Hey everyone, welcome to DropForm! I'm Kimberly, and for this example, we're

going to walk through kind of like an RSVP-type situation. So we want to know how many people the person that we're

sending this form to is going to bring. So first, we want to do is we want to create the form. So I'm going to go up

here to the top left, the 'Create Form' button, and from here I'm going to go ahead and start from scratch and use the classic

form. Now, first and foremost, I want to know what their name and email is, so I'm going to go ahead and come up to the 'Add'

form elements' and I'm going to choose their full name and their email. And then let's go ahead and do a drop

down, and this is going to be the number of guests. Let's edit the options. We want to give them an option to bring no

one, so zero, and then one, two, and let's say three is going to be the max. Okay, so now that

we've given them the option to invite up to three people, that means we're going to need at least three sections with

names and emails. So I'm going to go ahead and go back up to the top and I'm

going to add a full name and an email, and then we're going to make this one section. So I'm going to go

down to the bottom where it says 'Section Collapse,' and I'm going to go ahead and drag this right

where I want it, in between the number of guests and this first guest's name. Now we can go ahead and edit this and

name this 'Guest One,' just so it's easier to identify whenever we get to the show/hide fields. I'm gonna go ahead and change this to

Guest one, perfect. So let's take a look at this section collapse. I'm going to go ahead and click

on the properties for this, and we can see we can edit the section heading right here as well. But then we

have section visibility and button visibility. So the section visibility is either hidden or visible. So, do we want this entire section

not shown on the form? So let's go ahead and let's say it's visible, and the button visibility is visible. So let's

just look at the form and see what that looks like. So we can see here that it's visible; we have the dropdown,

that we can collapse it and we can bring it bigger. But for us, we do not want it visible at all. So I'm

going to go ahead and choose hidden, and the button visibility is hidden as well. Now, this is what we're going to want for

every single guest. So I'm going to go ahead and just click the duplicate field; we'll drag it down, and we'll just change

this one to Guest number two. Then we can come back over to the basic elements; we can add a full name and an

email, and we can make this Guest number two. We can come back up here, duplicate for the last one,

Guest number three, perfect. And let's add their name and email. Now, one thing that we do have to take

into consideration is what happens if they say, "You know what? I don't want to invite anyone." So let's look at the form

right now. How we have it set up is it's completely hidden; all of these fields are underneath the section collapse, so we

have an issue: we don't have a submit button because it's included under Guest number three. So what we need to do here

is we need to add another section collapse, and for this one we don't need a button. So I'm going to go ahead and

choose that as hidden, but we do want that section visible, so I'm going to go ahead and choose visible. So this will

allow them to answer the top section, and if they don't have any guests, they can go ahead and click the submit button.

Okay, now let's get into the fun part of the conditional formatting of showing and hiding different pieces of this form.

So up at the top, under settings, I'm going to go ahead and choose conditions. Now, from here we're going to do the show

hide field. This first one, so we're going to be working with the number of guests. Now, if they choose zero, there is nothing

more that we have to do; they're just going to submit, like I mentioned. So we need to show/hide fields if it's over

zero. So we're looking at the number of guests. So if the number of guests is equal to

let's say one, what do we want it to do? We want it to show the multiple fields we need for it to

show Guest 1's name and email. Perfect. So let's do one more condition: show/hide field if the number of guests is equal to

two. We need for it to show multiple fields again, and we're going to show Guest 1's name and email and Guest 2's

name and email. Save. Perfect. One more condition: show/hide field if the number of guests equals three. We're going to show multiple fields again,

and we're going to show all the guests, Guest 1 down to 3. And save. Perfect. Okay, so let's go ahead

and let's preview this form and let's give it a test. All right, so if it's just

me, I'm going to fill this out: my name, my email, and let's say I don't have any

guests. Perfect. Submit. But let's say I do want to invite one guest. Let's go ahead and see what happens when I choose one.

Want to invite one guest? We see the guest's name is now available and the email. Let's say we want to add two.

Now we have guest one and guest two. And let's say we're going to add three guests; we have guest one, guest two, and

guest three. And then we can submit. Super simply! If you have any questions about how to utilize the show/hide fields with

the section collapse, please let us know. And I'll see you next time.

How to Use Section Collapse Field in Jotform

Jotform

사용자 입력에 따라 필드를 표시/숨기는 섹션 축소의 용도에 대해 설명합니다.

게스트 수를 결정하는 목표를 설명합니다.

이름 및 이메일 필드를 추가하여 양식 작성을 시작합니다.

게스트 수(0~3명)에 대한 드롭다운을 추가합니다.

섹션 축소 필드 추가 및 구성하기

게스트 이름과 이메일을 위한 여러 섹션의 필요성에 대해 설명합니다.

'섹션 축소'를 사용하여 게스트 세부 정보를 위한 섹션을 추가합니다.

섹션 축소 필드를 배치하고 '게스트 1', '게스트 2' 등의 이름을 지정합니다.

섹션 및 버튼 표시 여부 설정을 사용하여 게스트 섹션을 처음에 숨기는 방법을 보여줍니다.

추가 게스트를 위해 섹션 축소 필드를 복제합니다.

제출 버튼 문제 해결 및 최종 섹션 추가하기

게스트가 추가되지 않은 경우 제출 버튼이 숨겨지는 문제를 강조합니다.

제출 버튼에 다른 섹션 접기를 추가하여 섹션은 표시되지만 버튼은 숨겨집니다.

이 설정을 통해 게스트 없이도 제출할 수 있는 방법을 설명합니다.

게스트 수에 따라 필드를 표시/숨기는 조건부 논리를 설명하기 시작합니다.

선택한 게스트 수(1명, 2명 또는 3명)에 따라 게스트 필드를 표시하는 조건을 설정합니다.

게스트 수가 0명인 경우에는 아무런 조치가 필요하지 않습니다.

게스트 1, 게스트 1 및 2, 게스트 1, 2 및 3을 표시하는 조건에 대해 자세히 설명합니다.

양식을 미리 보고 다양한 게스트 번호로 기능을 시연합니다.

1명, 2명 또는 3명의 게스트를 선택할 때 양식의 동작을 표시합니다.

필드 표시/숨기기 및 섹션 접기에 대한 추가 질문에 대한 답변을 제공합니다.