라디오 버튼이있는 부트 스트랩 입력 대화 상자

Question

라디오 버튼을 올려 선택한 값을 수집 할 수있는 부트 스트랩 모달 대화 상자 플러그인을 아는 사람이 있습니까?

Answer 1

특별한 작업이 필요하지 않습니다. 귀하의 모달은 귀하의 페이지의 일부이므로, 귀하는 모달 내부에서 액세스 할 수있는 페이지에 액세스 할 수있는 모든 것을 나타냅니다.

$('#myModal').modal('show'); 
 

 
$('input[type=radio]').click(function() { 
 
    alert($(this).val()); 
 
});

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 

 
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
 
     <div class="modal-dialog"> 
 
     <div class="modal-content"> 
 
      <div class="modal-header"> 
 
      <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> 
 
      <h4 class="modal-title" id="myModalLabel">Modal title</h4> 
 
      </div> 
 
      <div class="modal-body"> 
 
      <label class="radio-inline"> 
 
       <input type="radio" name="inlineRadioOptions" id="inlineRadio1" value="option1"> 1 
 
      </label> 
 
      <label class="radio-inline"> 
 
       <input type="radio" name="inlineRadioOptions" id="inlineRadio2" value="option2"> 2 
 
      </label> 
 
      <label class="radio-inline"> 
 
       <input type="radio" name="inlineRadioOptions" id="inlineRadio3" value="option3"> 3 
 
      </label> 
 
      </div> 
 
      <div class="modal-footer"> 
 
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
 
      <button type="button" class="btn btn-primary">Save changes</button> 
 
      </div> 
 
     </div> 
 
     </div> 
 
    </div>

모달이 튀어됩니다

, 그것은 그 안에 세 개의 라디오 버튼이 있습니다. 하나를 선택하면 선택한 라디오 버튼의 값을 보여주는 경고가 발생합니다.

이렇게하면 페이지에 어떤 컨트롤이든 추가 할 수 있으며 필요한 모든 작업을 수행 할 수 있습니다.