Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

noblemfd's avatar

How to Reset variable values each time a modal form runs

I have this modal form that is rendered:

<div class="modal fade" id="comment_emp{{ $goal->id }}" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <form action="{{route('appraisal.appraisal_year_end_setups.employee_year_end_comment',['id'=>$goal->id])}}" method="post" enctype="multipart/form-data" id="review_comment-form">
        {{ csrf_field() }}
        <div class="col-md-12">
          <div class="form-group">
            <label class="control-label"> Rating:<span style="color:red;">*</span></label>
            <input type="hidden" id="myRatingLimit" value="{{ $goal->goaltype->ratingLimit ? $goal->goaltype->ratingLimit->max_rating : '' }}">
            <input type="hidden" id="myWeightedScore" value="{{$goal->weighted_score ?? '' }}">
            <input type="text" id="myRating" name="employee_year_end_weighted_score" class="form-control myRating" placeholder="Enter Rating here e.g. 10" 
              style="width: 100%;" maxlength="4" onkeyup="checkScore(this.value)" onkeypress="allowNumbersOnly(event)" required>
          </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
          <button type="submit" id="review_comment_btn-submit" class="btn btn-success btn-ok">Save</button>
        </div>
      </form>
    </div>
  </div>
</div>

Javascipt

< script type = "text/javascript" >
  function checkScore(value) {
    let main = $("#myWeightedScore").val();
    let perc = $("#myRatingLimit").val();
    main = main ? parseInt(main) : 0;
    perc = perc ? parseInt(perc) : 0;
    let sumWeightBalance = parseInt(main);
    let sumPercBalance = parseInt(perc);
    var percVal = (sumPercBalance / 100).toFixed(2); //its convert 10 into 0.10
    var mult = main * percVal; 
    var percResult = main + mult;
    let sumValue = parseInt(value);

    if (sumValue > percResult) {
      Swal('Oops...', 'Rating is greater than Rating Limit!', 'error')
      $("#myRating").val('');
      return false;
    }
    sumWeightBalance.val('');
  } <
  /script> 

i observed that each time the modal form pops up, it doesn't reset the values of each of these:

   sumWeightBalance, sumPercBalance, percVal, mult, sumValue

How do I first clear or reset these values each time the modal form runs?

Thanks

0 likes
2 replies
noblemfd's avatar

@michaloravec - When I applied $('form').trigger('reset'); , As I typed into :

<input type="text" id="myRating" name="employee_year_end_weighted_score" class="form-control myRating" placeholder="Enter Rating here e.g. 10" 
          style="width: 100%;" maxlength="4" onkeyup="checkScore(this.value)" onkeypress="allowNumbersOnly(event)" required>

it clears off whatever is in the text input

Basically, the problem I initially have is that it retains the old values of myWeightedScore, myRatingLimit and myRating and this affects the result of my calculation

Please or to participate in this conversation.