«modal-dialog» 태그된 질문

사용자에게 중요한 정보를 표시하는 데 사용되는 그래픽 대화 상자를 나타냅니다. 이러한 대화 상자는 다른 모든 콘텐츠 위에 표시되어 사용자 입력이 수신 될 때까지 애플리케이션 흐름을 차단합니다.

30
배경 아래에 나타나는 부트 스트랩 모달
Bootstrap 예제에서 직접 모달 코드를 사용했으며 bootstrap.js 만 포함하고 bootstrap-modal.js는 포함하지 않았습니다. 그러나 내 모달이 회색 페이드 (배경) 아래에 나타나고 편집 할 수 없습니다. 그 모습은 다음과 같습니다. 이 문제를 재현 하는 한 가지 방법 은 이 바이올린 을 참조하십시오 . 해당 코드의 기본 구조는 다음과 같습니다. <body> <p>Lorem ipsum …


11
Twitter Bootstrap Modal에 함수 바인딩 닫기
새 프로젝트에서 Twitter Bootstrap lib를 사용하고 있으며 페이지의 일부를 모달 닫기에서 최신 json 데이터를 새로 고치고 검색하려고합니다. 나는 누군가가 그것을 지적하거나 해결책을 제안 할 수있는 문서의 어느 곳에서도 이것을 보지 못한다. 문서화 된 방법을 사용할 때의 두 가지 문제 $('#my-modal').bind('hide', function () { // do something ... }); 모달에 "숨기기"클래스를 …


25
부트 스트랩 모달 닫기
처음에 표시하려는 부트 스트랩 모달 대화 상자가 있는데 사용자가 페이지를 클릭하면 사라집니다. 나는 다음을 가지고있다 : $(function () { $('#modal').modal(toggle) }); <div class="modal" id='modal'> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h3 id="myModalLabel">Error:</h3> </div> <div class="modal-body"> <p>Please correct the following errors:</p> </div> </div> </div> 모달은 처음에 표시되지만 모달 외부를 클릭해도 …

24
자바 스크립트로 부트 스트랩 모달을 숨기는 방법?
나는 여기에있는 게시물, Bootstrap 사이트 및 Googled를 미친 것처럼 읽었지만 쉬운 대답은 확실하지 않습니다 ... 다음과 같이 link_to 도우미에서 여는 부트 스트랩 모달이 있습니다. <%= link_to "New Contact", new_contact_path, {remote: true, 'data-toggle' => 'modal', 'data-target' => "#myModal", class: "btn btn-primary"} %> 내 ContactsController.create행동에는 코드를 만들고에 Contact전달합니다 create.js.erb. 에서 create.js.erb오류 처리 …

30
부트 스트랩 3 모달 수직 위치 중심
이것은 두 가지 질문입니다. 모달의 정확한 높이를 모르는 경우 어떻게 모달을 중앙에 수직으로 배치 할 수 있습니까? 모달이 화면 높이를 초과하는 경우에만 모달을 중앙에 배치하고 모달 본체에서 overflow : auto를 가질 수 있습니까? 나는 이것을 사용하려고 시도했다. .modal-dialog { height: 80% !important; padding-top:10%; } .modal-content { height: 100% !important; overflow:visible; …

22
트위터 부트 스트랩 원격 모달은 매번 동일한 내용을 보여줍니다
Twitter 부트 스트랩을 사용하고 있으며 모달을 지정했습니다 <div class="modal hide" id="modal-item"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">x</button> <h3>Update Item</h3> </div> <form action="http://www.website.com/update" method="POST" class="form-horizontal"> <div class="modal-body"> Loading content... </div> <div class="modal-footer"> <a href="#" class="btn" data-dismiss="modal">Close</a> <button class="btn btn-primary" type="submit">Update Item</button> </div> </form> </div> 그리고 링크 <a href="http://www.website.com/item/1" data-target="#modal-item" data-toggle="modal">Edit 1</a> …

30
트위터 부트 스트랩 모달 배경이 사라지지 않습니다
Twitter 부트 스트랩 모달 대화 상자를 사용하고 있습니다. 부트 스트랩 모달 대화 상자의 제출 버튼을 클릭하면 AJAX 요청을 보냅니다. 내 문제는 모달 배경이 사라지지 않는다는 것입니다. 모달 대화 상자가 제대로 사라지지만 화면에 불투명도를 생성하는 "모달 배경"이 그대로 유지됩니다. 어떡해?

5
비동기 작업을 수행하는 Redux에서 모달 대화 상자를 표시하려면 어떻게해야합니까?
상황에 따라 확인 대화 상자를 표시 해야하는 앱을 만들고 있습니다. 무언가를 제거하고 싶다고 말하면, deleteSomething(id)어떤 리듀서가 그 이벤트를 잡아서 그것을 보여주기 위해 대화 상자 리듀서를 채울 것 같은 액션을 전달할 것입니다. 이 대화가 제출되면 의심의 여지가 있습니다. 이 컴포넌트는 첫 번째로 전달 된 조치에 따라 올바른 조치를 어떻게 전달할 수 …

27
부트 스트랩 모달이 즉시 사라짐
부트 스트랩을 사용하여 웹 사이트에서 작업하고 있습니다. 기본적으로, 나는 영웅 유닛의 버튼으로 소환 된 홈페이지에서 모달을 사용하고 싶었습니다. 버튼 코드 : <button type="button" class="btn btn-warning btn-large" data-toggle="modal" data-target="#myModal">Open Modal</button> 모달 코드 : <div class="modal hide fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h3 id="myModalLabel">In …

4
Twitter 부트 스트랩에서 모달 닫기 이벤트를 처리하는 방법은 무엇입니까?
트위터 부트 스트랩에서 모달 문서를 살펴보십시오 . 모달의 close 이벤트를 듣고 함수를 실행할 수있는 방법이 있는지 알아낼 수 없었습니다. 예를 들어이 모달을 예로 들어 보겠습니다. <div class="modal-header"> <button type="button" class="close close_link" data-dismiss="modal" aria-hidden="true">×</button> <h3>Modal header</h3> </div> <div class="modal-body"> ... </div> <div class="modal-footer"> <a href="#" class="btn close_link" data-dismiss="modal">Close</a> </div> 상단의 X …

10
jquery-ui-dialog-대화 상자 닫기 이벤트에 연결하는 방법
jquery-ui-dialog플러그인을 사용하고 있습니다 일부 상황에서 대화 상자가 닫힐 때 페이지를 새로 고치는 방법을 찾고 있습니다. 대화 상자에서 닫기 이벤트를 캡처하는 방법이 있습니까? 닫기 버튼을 클릭하면 코드를 실행할 수 있지만 오른쪽 상단의 x 또는 x로 닫는 사용자를 다루지 않습니다.


28
여러 모달 오버레이
오버레이가 뒤가 아닌 첫 번째 모달 위에 표시되어야합니다. 코드 스 니펫 표시 $('#openBtn').click(function(){ $('#myModal').modal({show:true}) }); <a data-toggle="modal" href="#myModal" class="btn btn-primary">Launch modal</a> <div class="modal" id="myModal"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h4 class="modal-title">Modal title</h4> </div><div class="container"></div> <div class="modal-body"> Content for the dialog / modal goes here. …

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.