example modal

guillermomartinez · Jul 2, 2017 · c08a53e · c08a53e
1 parent 8cccdcd
commit c08a53e
Showing 1 changed file with 56 additions and 0 deletions.
diff --git a/examples/modal.html b/examples/modal.html
@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html lang="es">
+<head>
+	<meta charset="UTF-8">
+	<meta http-equiv="X-UA-Compatible" content="IE=edge">
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+	<title>Filemanager ui</title>
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
+    <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
+    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" ></script>
+    <script type="text/javascript">
+        function setData( data )
+        {
+            console.log(data);
+            $('#result').html('');
+            $.each(data, function(index, val) {
+                 $('#result').append('<li><pre>'+JSON.stringify(val,null,2)+'</pre></li>');
+            });
+        }
+        function closeModal( )
+        {
+            $('#myModal').modal('hide');
+        }
+    </script>
+</head>
+<body>
+	<div class="container">
+
+       <!-- Button trigger modal -->
+       <button id="btn_modal" type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
+          Launch demo modal
+      </button>
+      <!-- Modal -->
+      <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+          <div class="modal-dialog modal-lg" role="document">
+          </div>
+      </div>
+      <h3>RESULT:</h3>
+      <ul id="result">
+        </ul>
+  </div>
+  <script type="text/javascript">
+    $(function() {
+        $("#btn_modal").on('click', function(){
+            var iframe = $('<iframe>').addClass('modal-filemanager')
+            .attr('src','basic.html')
+            .width('100%').height(500);
+            $('#myModal').find('.modal-dialog').append(iframe);
+        })
+        $('#myModal').on('hide.bs.modal', function (e) {
+            $(this).find('iframe').remove();
+        })
+    });
+</script>
+</body>
+</html>