JSFiddle - React, Tailwind, and code Playground

by Matias Guijarro

HTML

<div class="container" style="max-width: 970px;">
    <nav class="navbar navbar-inverse">
        <div class="container-fluid">
            <div class="navbar-header"> <a class="navbar-brand" href="#">Multilayer Fluorescence App</a>

            </div>
        </div>
    </nav>
    <form class="form-horizontal">
        <fieldset>
            <!-- Form Name -->
            <legend>Geometry parameters</legend>
            <!-- Appended Input-->
            <div class="form-group">
                <label class="col-md-4 control-label" for="incoming_angle">Incoming Angle</label>
                <div class="col-md-5">
                    <div class="input-group">
                        <input id="incoming_angle" name="incoming_angle" class="form-control" placeholder="angle in degrees" required="" type="text" /> <span class="input-group-addon">deg.</span>

                    </div>
                </div>
            </div>
            <!-- Appended Input-->
            <div class="form-group">
                <label class="col-md-4 control-label" for="outgoing_angle">Outgoing Angle</label>
                <div class="col-md-5">
                    <div class="input-group">
                        <input id="outgoing_angle" name="outgoing_angle" class="form-control" placeholder="angle in degrees" required="" type="text" /> <span class="input-group-addon">deg.</span>

                    </div>
                </div>
            </div>
            <!-- Appended Input-->
            <div class="form-group">
                <label class="col-md-4 control-label" for="scattering_angle">Scattering Angle</label>
                <div class="col-md-5">
                    <div class="input-group">
                        <input id="scattering_angle" name="scattering_angle" class="form-control" placeholder="90" type="text" /> <span class="input-group-addon">deg.</span>

                    </div>
                </div>
            </div>
        </fieldset>
    </form>
   ...

JavaScript

function material_selected(e) {
    var ref = e.target;
    alert($(ref).html());
};

function add_multilayer_row(e) {
    var add_btn = e.target;
    var table_row = $(add_btn).parent().parent();
    var new_table_row = table_row.clone();
    table_row.parent().append(new_table_row);
};