라디오 버튼을 클릭하면 모달 팝업이 표시됩니다.

ASP.NET에 익숙해지기 위해 소규모 프로젝트 작업 중입니다. 나는라디오 버튼을 클릭하면 모달 팝업이 표시됩니다.

<div class="col-lg-12"> 
    <div class="form-group"> 
     @Html.LabelFor(model => model.COUNTRY_NAME, new { @class = "col-lg-2 control-label" }) 
     <div class="col-lg-9"> 
      @Html.TextBoxFor(model => model.COUNTRY_NAME, new { @class = "form-control" }) 
     </div> 
    </div> 
</div> 

<div class="col-lg-12"> 
    <div class="form-group"> 
     <div class="radio"> 
      @Html.RadioButtonFor(m => m.COUNTRY_AREA, 1, new { id = "", value = "" }) North East 
     </div> 
     <div class="radio"> 
      @Html.RadioButtonFor(m => m.COUNTRY_AREA, 2, new { id = "", value = "" }) North West 
     </div> 
     <div class="radio"> 
      @Html.RadioButtonFor(m => m.COUNTRY_AREA, 3, new { id = "", value = "" }) South West 
     </div> 
     <div class="radio"> 
      @Html.RadioButtonFor(m => m.COUNTRY_AREA, 4, new { id = "", value = "" }) South East 
     </div> 
    </div> 
</div>

m => m.COUNTRY_AREA 4 개 라디오 버튼을 생성해야이 모델

public partial class COUNTRIES 
{ 
public int COUNTRY_ID { get; set; } 
public string COUNTRY_NAME { get; set; } 
public int COUNTRY_AREA { get; set; } 
}

보기가 있고, 4 개 개의 라디오 버튼은 연결되어 있습니다.

내가 달성하고자하는 것은 내가 클릭하면 점이다.

의 RadioButton 1,이 메시지가 팝업 모달 폼을 표시해야 "당신은 북미 지역에서 생산되는 것으로

의 RadioButton 2, 그것은 표시해야 메시지가있는 팝업 모달 양식 "당신은 노스 웨스트 출신입니다.

RadioButton 3, "South East의 메시지입니다."

RadioButton 1, "You are from South East."메시지가있는 팝업 모달 양식이 표시되어야합니다.

어떻게 내가이 작동

출처

2017-05-24 Jibike

쉽게 달성 할 수있는 자바 스크립트를 사용하여 ... 수 질문에 하나의 라디오 버튼에 렌더링 된 html을 추가 하시겠습니까? – Hackerman

그것에 대해 가야합니까, 단 하나의 자바 스크립트 기능이 있도록이 고려된다

<!DOCTYPE html> 

<html> 
<head> 
    <meta name="viewport" content="width=device-width" /> 
    <title>Index706</title> 
    <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 
    <script type="text/javascript"> 
     $(function() { 
      $(".DoPopup").click(function (event) { 
       alert("You are from the " + event.target.id); 
      }) 
     }) 
    </script> 
</head> 
<body> 
    <div class="col-lg-12"> 
     <div class="form-group"> 
      @Html.LabelFor(model => model.COUNTRY_NAME, new { @class = "col-lg-2 control-label" }) 
      <div class="col-lg-9"> 
       @Html.TextBoxFor(model => model.COUNTRY_NAME, new { @class = "form-control" }) 
      </div> 
     </div> 
    </div> 

    <div class="col-lg-12"> 
     <div class="form-group"> 
      <div class="radio"> 
       @Html.RadioButtonFor(m => m.COUNTRY_AREA, 1, new { @class = "DoPopup", id = "North East", value = "" }) North East 
      </div> 
      <div class="radio"> 
       @Html.RadioButtonFor(m => m.COUNTRY_AREA, 2, new { @class = "DoPopup", id = "North West", value = "" }) North West 
      </div> 
      <div class="radio"> 
       @Html.RadioButtonFor(m => m.COUNTRY_AREA, 3, new { @class = "DoPopup", id = "South West", value = "" }) South West 
      </div> 
      <div class="radio"> 
       @Html.RadioButtonFor(m => m.COUNTRY_AREA, 4, new { @class = "DoPopup", id = "South East", value = "" }) South East 
      </div> 
     </div> 
    </div> 
</body> 
</html>

출처

2017-05-24 17:29:17 kblau

https://jsfiddle.net/kblau237/3m27una2/ – kblau

라디오 버튼을 클릭하면 모달 팝업이 표시됩니다.

답변

관련 문제