JSFiddle - React, Tailwind, and code Playground

by Plippie Plop

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/dot-luv/jquery-ui.css">
<button id="popupbutton">Open Dialog</button>


<div id="dialogwindow" title="popup window" style="display:none;width:250px">
    <div class="other-box yellow-box ui-corner-all ui-corner-all">
        <div class="cont ui-corner-all">
            <p>Dialog window</p>
        </div>
    </div>
    <form action="javascript:;" method="post" name="yeniAile">
        
 <div id="tabs">
            <ul>
                <li><a href="#tabs-1">tab 1</a></li>
                <li><a href="#tabs-1">tab 2</a></li>
                <li><a href="#tabs-1">tab 3</a></li>
            </ul>
            <div id="tabs-1"> Tabje Bla bla bla </div>
        </div>            
    </form>

</div>

JavaScript

// init
$("#tabs").tabs();
$("#popupbutton").click(function() {
       $("#dialogwindow").dialog("open");
 });

// dialog settings 
$("#dialogwindow").dialog({
            bgiframe: true,
            autoOpen: false,
            height: 350,
            width: 600,
            modal: true,
            buttons: {
                'Klik hier': function() {

                },
                'Sluiten': function() {
                    $(this).dialog('close');
                }
            }
        });