JSFiddle - React, Tailwind, and code Playground

by wazaaaap

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<script src="https://github.com/senff/Sticky-Anything/blob/master/jq-sticky-anything.js"></script>
<select name="type1" id="type1">
    <option value="Listing Discrepancy">Listing Discrepancy</option>
    <option value="PO Discrepancy">PO Discrepancy</option>
    <option value="Pricing Discrepancy">Pricing Discrepancy</option>
    <option value="Program Glitch">Program Glitch</option>
    <option value="Receiving Discrepancy">Receiving Discrepancy</option>
    <option value="RMA Discrepancy">RMA Discrepancy</option>
    <option value="Sales Discrepancy">Sales Discrepancy</option>
    <option value="Shipping Discrepancy">Shipping Discrepancy</option>
</select>
<button class="reset">Reset</button>

JavaScript

$(document).ready(function () {
     $("#sub").click(function () {
         var user_issue = $("#issue").val();
         var user_priority = $("#priority").val();
         var user_type = $("#type1").val();
         $.post("BugReport.php", {
             issue: user_issue,
             priority: user_priority,
             type1: user_type
         }, function (data) {
             $("#result").html(data);
             //location.reload(true);
         });
         $.post('BugDisplay.php', {}, function (data) {
             $("#BugDisplay").html(data);
         });
         document.getElementById('issue').value = '';
         document.getElementById('type1').value = 'Listing Discrepancy'; //this is my attempt at solving the problem.
     });
     $.post('BugDisplay.php', {}, function (data) {
         $("#BugDisplay").html(data);
     });
     $(".reset").click(function () {
         $('#type1').prop('selectedIndex', 0);
     });
 });