OneCompiler

Htmlatumation

109

Example heading with h2 size

Example heading with h3 size

Following is sample java code.

int i = 10;
if(i>0){
    System.out.println('positive');
}
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Filter Data</title> <style> body { font-family: Arial, sans-serif; margin: 20px; } .container { max-width: 800px; margin: auto; } .form-section { margin-bottom: 20px; } .form-section h3 { margin-bottom: 10px; } button { padding: 10px 20px; background-color: #4CAF50; color: white; border: none; cursor: pointer; } button:hover { background-color: #45a049; } .filtered-data { margin-top: 20px; padding: 10px; border: 1px solid #ddd; background-color: #f9f9f9; } </style> </head> <body> <div class="container"> <h1>Data Filter Application</h1> <form method="POST"> <!-- Years --> <div class="form-section"> <h3>Years</h3> {% for year in years %} <label> <input type="checkbox" name="years" value="{{ year }}"> {{ year }} </label><br> {% endfor %} </div> 
        <!-- Areas -->
        <div class="form-section">
            <h3>Areas</h3>
            {% for area in areas %}
                <label>
                    <input type="checkbox" name="areas" value="{{ area }}">
                    {{ area }}
                </label><br>
            {% endfor %}
        </div>

        <!-- Main Age -->
        <div class="form-section">
            <h3>Main Age</h3>
            {% for age in main_age %}
                <label>
                    <input type="checkbox" name="main_age" value="{{ age }}">
                    {{ age }}
                </label><br>
            {% endfor %}
        </div>

        <!-- Sub Age 1 -->
        <div class="form-section">
            <h3>Sub Age 1</h3>
            {% for age in sub_age_1 %}
                <label>
                    <input type="checkbox" name="sub_age_1" value="{{ age }}">
                    {{ age }}
                </label><br>
            {% endfor %}
        </div>

        <!-- Sub Age 2 -->
        <div class="form-section">
            <h3>Sub Age 2</h3>
            {% for age in sub_age_2 %}
                <label>
                    <input type="checkbox" name="sub_age_2" value="{{ age }}">
                    {{ age }}
                </label><br>
            {% endfor %}
        </div>

        <!-- Genders -->
        <div class="form-section">
            <h3>Genders</h3>
            {% for gender in genders %}
                <label>
                    <input type="checkbox" name="genders" value="{{ gender }}">
                    {{ gender }}
                </label><br>
            {% endfor %}
        </div>

        <!-- Ethnics -->
        <div class="form-section">
            <h3>Ethnics</h3>
            {% for ethnic in ethnics %}
                <label>
                    <input type="checkbox" name="ethnics" value="{{ ethnic }}">
                    {{ ethnic }}
                </label><br>
            {% endfor %}
        </div>

        <button type="submit">Filter</button>
    </form>

    <!-- Display Filtered Data -->
    {% if filtered_data %}
        <div class="filtered-data">
            <h2>Filtered Data:</h2>
            <pre>{{ filtered_data }}</pre>
        </div>
    {% endif %}
</div>
</body> </html>