Question

I have made a small application on a school. Where there is a dropdown field. In that dropdown I have all the students name and there are also 4 remaining input fields. where the input fields will have values for marks like marks in physics, chemistry, maths and the last one will make the total and that will be addition of marks in physics+chemistry+maths.
Now I have used some ajax and jquery tricks and have done some changes like when one student name will be selected from the dropdown box it will show the mark for that particular student in physics, chemistry, maths. Now I want that the marks for physics, chemistry, maths will be added and will be sum in total field. For that I have written jQuery like this

  <script type="text/javascript">
  jQuery(document).ready(function(){
    jQuery('#student_name').on('change',function(event){
    var totalmarks = jQuery("#marks_physics").val() + jQuery("#marks_chemistry").val()+ jQuery("#marks_chemistry");
    jQuery("#marks_total").val(totalmarks);
  });
});
</script>

Here id student_name is the dropdown field for the students name and id marks_total is the field name where the total mark should show after addition. Now my problem is that it is showing the marks of that student when once the name has been changed in that drop down.
Suppose I have two students named as A and B. When once A is selected it is showing nothing but as I am selecting B from the dropdown it is showing the values of A.I had also used select in place of change but its not working there. So can someone tell me how to solve this. Any help and suggestions will be highly appreciable. Thanks in advance.

UPDATE

Actually it is showing the actual values of that field but when I tried the console tab to see the value of that field as console.log(#marks_physics) it is showing the previous value for that field and also in place of total it is showing the previous entered total marks value.

Answer 1

Try this

<script type="text/javascript">
  jQuery(document).ready(function(){
    jQuery('#student_name').ajaxComplete(function(event,request,settings){
    var totalmarks = jQuery("#marks_physics").val() + jQuery("#marks_chemistry").val()+ jQuery("#marks_chemistry");
    jQuery("#marks_total").val(totalmarks);
  });
});
</script>

Now you can alert your actual entered values as console.log(#marks_physics) and it will show you the right one.