폼 메일 개발 문의드려요

폼 메일 개발 문의드려요

QA

폼 메일 개발 문의드려요

답변 2

본문

3556551080_1719192608.9775.png

 

https://dnjsxkq.iwinv.net

위 사이트 하단 상담신청에서

위 부분이 div로 돼있어서

 

input으로 할 경우 wr_2 라는 이름으로 관리자페이지 게시판으로 받아오게 하려고 하는데

div의 경우에는 이걸 어떻게 해야 할까요? ㅠㅠ

 

관리자페이지 작업은 다 돼있어서 다른 인풋처럼 wr_2라는 네임 아이디만 부여하면 끝인데 div로 돼있어서

이걸 인풋으로 하고 css를 다시 잡자니 넘무 번거로워서요 ㅠ

 

위 사이트 소스 봐주시고 수정을 해서 소스를 올려주시면 안될까요

어떻게 하라고 달아주셧는데 못알아 듣겠네요.. 죄송

이 질문에 댓글 쓰기 :

답변 2

저라면
1. 라디오사용
2. 라디오 input 감추기
3. 라벨을 이용하여 input 작동
하겠습니다.

예시는 아래와 같습니다.

<style>
.DB_radio{width: 410px;height: 50px;display: inline-block;font-family: 'Noto Sans KR';}
.DB_radio label{width: 201px;height: 50px;display: inline-block;font-size: 25px;line-height: 50px;cursor: pointer;background: #fff;border: none;}
.DB_radio input[type='radio']:checked + label{background: #cc1622;color: #fff;}
.DB_radio input{display: none;}    
</style>
<div class="DB_radio">
    <input type="radio" id="wr_2_1" name="wr_2" value="개인회생" checked>
    <label for="wr_2_1">개인회생</label>
    <input type="radio" id="wr_2_2" name="wr_2" value="개인파산">
    <label for="wr_2_2">개인파산</label>                        
</div>

  만약 기존홈페이지의 css를 써야하신다면 아래를 참고하세요

 
<style>
.tab{display: flex;    cursor: pointer;    gap: 15px;}
.tab label{border-radius: 10px;    font-weight: bold;flex: 1;    padding: 10px;    text-align: center;    background: #D7D7D7;    color: #fff;}
.tab input[type='radio']:checked + label{background: #014997;    color: white;}
.tab input{display: none;}    
</style>
<div class="tab">
    <input type="radio" id="wr_2_1" name="wr_2" value="개인회생" checked="">
    <label class="tab-option" for="wr_2_1">개인회생</label>
    <input type="radio" id="wr_2_2" name="wr_2" value="개인파산">
    <label class="tab-option" for="wr_2_2">개인파산</label>                        
</div>

2106395821_1719215317.4307.png

보니깐 input의 id랑 label 의 for를 안맞추셨네요
    <input type="radio" id="wr_2_1" name="wr_2" value="개인회생" checked="">
    <label class="tab-option" for="wr_2_1">개인회생</label>
    <input type="radio" id="wr_2_2" name="wr_2" value="개인파산">
    <label class="tab-option" for="wr_2_2">개인파산</label> 
이렇게하셔야합니다


      function toggleTab(tabName) {
      
            document.querySelectorAll('.tab-option').forEach(el => el.classList.remove('active'));
      
            if (tabName === 'personalRehab') {
      
            document.querySelectorAll('.tab-option')[0].classList.add('active');
            $("#wr_2").val('개인회생');
      
              } else {
      
              document.querySelectorAll('.tab-option')[1].classList.add('active');
            $("#wr_2").val('개인파산');
      
              }
      
        }

이런식으로 하시면 됩니다.

답변을 작성하시기 전에 로그인 해주세요.
QA 내용 검색
질문등록
filter #폼 ×
전체 95
© SIRSOFT
현재 페이지 제일 처음으로