Log In Sign Up
Models:
Richard Zick
RichardZick/
Cancer_Prediction
0
Downloads: 1
Diff of /static/index.html [000000] .. [0ff072]

Switch to unified view

a b/static/index.html 

  1
  
<!DOCTYPE html>





  
  

  2
  
<html>





  
  

  3
  
<head>





  
  

  4
  
    <title>Predict Lung Cancer</title>





  
  

  5
  
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/css/bootstrap.min.css">





  
  

  6
  
    <link rel="stylesheet" href="{{ url_for('static', path='style.css') }}">





  
  

  7
  
</head>





  
  

  8
  
<body>





  
  

  9
  
    <div class="container">





  
  

  10
  
        <h1 class="mt-4">Lung Cancer Prediction</h1>





  
  

  11
  
        <form id="predictionForm">





  
  

  12
  
            <div class="mb-3">





  
  

  13
  
                <label for="gender" class="form-label">Gender</label>





  
  

  14
  
                <input type="text" class="form-control" id="gender" name="gender" required>





  
  

  15
  
            </div>





  
  

  16
  
            <div class="mb-3">





  
  

  17
  
                <label for="age" class="form-label">Age</label>





  
  

  18
  
                <input type="text" class="form-control" id="age" name="age" required>





  
  

  19
  
            </div>





  
  

  20
  
            <div class="mb-3">





  
  

  21
  
                <label for="smoking" class="form-label">Smoking</label>





  
  

  22
  
                <input type="text" class="form-control" id="smoking" name="smoking" required>





  
  

  23
  
            </div>





  
  

  24
  
            <div class="mb-3">





  
  

  25
  
                <label for="yellowFingers" class="form-label">Yellow Fingers</label>





  
  

  26
  
                <input type="text" class="form-control" id="yellowFingers" name="yellowFingers" required>





  
  

  27
  
            </div>





  
  

  28
  
            <div class="mb-3">





  
  

  29
  
                <label for="anxiety" class="form-label">Anxiety</label>





  
  

  30
  
                <input type="text" class="form-control" id="anxiety" name="anxiety" required>





  
  

  31
  
            </div>





  
  

  32
  
            <div class="mb-3">





  
  

  33
  
                <label for="peerPressure" class="form-label">Peer Pressure</label>





  
  

  34
  
                <input type="text" class="form-control" id="peerPressure" name="peerPressure" required>





  
  

  35
  
            </div>





  
  

  36
  
            <div class="mb-3">





  
  

  37
  
                <label for="chronicDisease" class="form-label">Chronic Disease</label>





  
  

  38
  
                <input type="text" class="form-control" id="chronicDisease" name="chronicDisease" required>





  
  

  39
  
            </div>





  
  

  40
  
            <div class="mb-3">





  
  

  41
  
                <label for="fatigue" class="form-label">Fatigue</label>





  
  

  42
  
                <input type="text" class="form-control" id="fatigue" name="fatigue" required>





  
  

  43
  
            </div>





  
  

  44
  
            <div class="mb-3">





  
  

  45
  
                <label for="allergy" class="form-label">Allergy</label>





  
  

  46
  
                <input type="text" class="form-control" id="allergy" name="allergy" required>





  
  

  47
  
            </div>





  
  

  48
  
            <div class="mb-3">





  
  

  49
  
                <label for="wheezing" class="form-label">Wheezing</label>





  
  

  50
  
                <input type="text" class="form-control" id="wheezing" name="wheezing" required>





  
  

  51
  
            </div>





  
  

  52
  
            <div class="mb-3">





  
  

  53
  
                <label for="alcoholConsuming" class="form-label">Alcohol Consuming</label>





  
  

  54
  
                <input type="text" class="form-control" id="alcoholConsuming" name="alcoholConsuming" required>





  
  

  55
  
            </div>





  
  

  56
  
            <div class="mb-3">





  
  

  57
  
                <label for="coughing" class="form-label">Coughing</label>





  
  

  58
  
                <input type="text" class="form-control" id="coughing" name="coughing" required>





  
  

  59
  
            </div>





  
  

  60
  
            <div class="mb-3">





  
  

  61
  
                <label for="shortnessOfBreath" class="form-label">Shortness of Breath</label>





  
  

  62
  
                <input type="text" class="form-control" id="shortnessOfBreath" name="shortnessOfBreath" required>





  
  

  63
  
            </div>





  
  

  64
  
            <div class="mb-3">





  
  

  65
  
                <label for="swallowingDifficulty" class="form-label">Swallowing Difficulty</label>





  
  

  66
  
                <input type="text" class="form-control" id="swallowingDifficulty" name="swallowingDifficulty" required>





  
  

  67
  
            </div>





  
  

  68
  
            <div class="mb-3">





  
  

  69
  
                <label for="chestPain" class="form-label">Chest Pain</label>





  
  

  70
  
                <input type="text" class="form-control" id="chestPain" name="chestPain" required>





  
  

  71
  
            </div>





  
  

  72
  
            





  
  

  73
  
            <button type="submit" class="btn btn-primary">Predict</button>





  
  

  74
  
        </form>





  
  

  75
  
        <div id="result" class="mt-4"></div>





  
  

  76
  
    </div>





  
  

  77
  





  
  

  78
  
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>





  
  

  79
  
    <script>





  
  

  80
  
        $(document).ready(function() {





  
  

  81
  
            $('#predictionForm').submit(function(event) {





  
  

  82
  
                event.preventDefault();





  
  

  83
  
                var formData = $(this).serialize();





  
  

  84
  
                $.ajax({





  
  

  85
  
                    type: 'POST',





  
  

  86
  
                    url: 'http://localhost:8000/predict',





  
  

  87
  
                    data: formData,





  
  

  88
  
                    success: function(response) {





  
  

  89
  
                        var prediction = response.prediction;





  
  

  90
  
                        $('#result').text('Prediction: ' + (prediction ==  1 ? "cancer" : "not cancer"));





  
  

  91
  
                    },





  
  

  92
  
                    error: function(xhr, status, error) {





  
  

  93
  
                        console.error(error);





  
  

  94
  
                    }





  
  

  95
  
                });





  
  

  96
  
            });





  
  

  97
  
        });





  
  

  98
  
    </script>





  
  

  99
  
</body>





  
  

  100
  
</html>