[ASP.Net Core] Radio 버튼 처리해보기

 

상단 이미지 처럼 Input 박스의 Radio 버튼들을 ASP.Net Core 상에서 처리하는 방법을 정리해 보았다.

 

<쓰기 모드>

 

[ SpoDc.cs ] - DC 관련 기본 테이블 entity

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations.Schema;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
 
namespace ChilgokReserveSystem.Api.Models
{
    [Table("DC")]
    public class SpoDc
    {
        public string PsGroup { get; set; } = string.Empty;
        public string Code { get; set; } = string.Empty;
        public string Name { get; set; } = string.Empty;
        public int Yul { get; set; } = 0;
        public string JIJUM_CODE { get; set; } = string.Empty;
 
    }
}

 

[ SpoDcRepository.cs ] - Repository 클래스 

 

using ChilgokReserveSystem.Api.DB;
using Dapper;
using Microsoft.Data.SqlClient;
using Microsoft.Extensions.Configuration;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
 
namespace ChilgokReserveSystem.Api.Models
{
    public class SpoDcRepository
    {
        public IConfiguration _config;
        private SqlConnection con;
        private WebDbContext db = null;
        public SpoDcRepository(IConfiguration config, WebDbContext db)
        {
            _config = config;
            con = new SqlConnection(_config.GetSection("ConnectionStrings")
                .GetSection("Web").Value);
            this.db = db;
        }
 
        public List<SpoDc> GetAll()
        {
            string sql = "select * from DC";
            return con.Query<SpoDc>(sql).ToList();
        }
 
    }
}

GetAll() 메소드는 Dapper 방법으로 DC 정보를 모두 읽어 왔다.

 

[ MemberController.cs ] -  생성자 종속성 주입(DI)

private SpoDcRepository dcRep = null;
public MemberController(SpoDcRepository dcRep)
{
    this.dcRep = dcRep;
}
 
 
// 할인율 Radio Button
List<SpoDc> rateList = dcRep.GetAll();
ViewBag.RateDcList = rateList;
 
return View();

 

실제 Controller 파일이다.

SpoDcRepository 를 종속성 주입시키고 있다.

ViewBag 형태로 List로 담은 DC 클래스들을 저장시켜서 cshtml (View Razor Page) 로 넘겨준다.

 

[ Register.cshtml ] - View

 

<input type="radio" id="Dcgubun0" name="Rate" value="0" checked > 
<label for="Dcgubun0" class="form-check-label">할인없음</label> <br />
@{
    int num = 1;
}
 
@foreach (var rateList in ViewBag.RateDcList)
{
    <input type="radio" id="Dcgubun@(num)" name="Rate" value="@rateList.Code" class="form-check-input" style="padding:0;"> 
    <label for="Dcgubun@(num)" class="form-check-label">@Html.Raw(rateList.Name) (@rateList.Yul%)</label> <br />
    num++;
}

 

 

<수정 모드>

 

[ Modify.cshtml ] - View

<input type="radio" id="Dcgubun0" name="DcGubun" value="0" @(Model.DcGubun=="0" ? "checked" : "") > 
<label for="Dcgubun0" class="form-check-label">할인없음</label> <br />
@{
    int num = 1;
}
@foreach (var rateList in ViewBag.RateDcList)
{
    <input type="radio" id="Dcgubun@(num)" name="DcGubun" value="@rateList.Code" @(Model.DcGubun == rateList.Code ? "checked" : "") > 
    <label for="Dcgubun@(num)" class="form-check-label">@Html.Raw(rateList.Name) (@rateList.Yul%)</label> <br />
    num++;
}

 

@(Model.DcGubun == rateList.Code ? "checked" : "") 형태로 조건식을 달아서 checked 시킨다.

 

 

HTML 소스보기 내용

<input type="radio" id="Dcgubun0" name="Rate" value="0" checked> <label for="Dcgubun0" class="form-check-label">할인없음</label> <br />
<input type="radio" id="Dcgubun1" name="Rate" value="1"> <label for="Dcgubun1" class="form-check-label">중구구민 (10%)</label> <br />
<input type="radio" id="Dcgubun2" name="Rate" value="2"> <label for="Dcgubun2" class="form-check-label">어린이,청소년,노인 (30%)</label> <br />
<input type="radio" id="Dcgubun3" name="Rate" value="3"> <label for="Dcgubun3" class="form-check-label">기초수급할인 (50%)</label> <br />
<input type="radio" id="Dcgubun4" name="Rate" value="4"> <label for="Dcgubun4" class="form-check-label">국가유공자할인 (50%)</label> <br />
<input type="radio" id="Dcgubun5" name="Rate" value="5"> <label for="Dcgubun5" class="form-check-label">복지(장애인) (50%)</label> <br />
<input type="radio" id="Dcgubun6" name="Rate" value="6"> <label for="Dcgubun6" class="form-check-label">스포츠강좌할인 (100%)</label> <br />
<input type="radio" id="Dcgubun7" name="Rate" value="7"> <label for="Dcgubun7" class="form-check-label">장애인스포츠강좌 (100%)</label> <br />