Auto Save form fields

Question

Please I want to achieve this: Submitting students scores onblur the form input field And these are my codes

Form.php

    <span id="ref_report"></span><br>
Student One:<input  type="text" name='ref_no[]' id='ref_no'><input  type="text" name='admin'id="admin" value='st1'><br>
Students Two  <input  type="text" name='ref_no[]' id='ref_no'><input  type="text" name='admin[]'id="admin" value='st2'><br>
Student  three  <input  type="text" name='ref_no[]' id='ref_no'><input  type="text" name='admin[]'id="admin" value='st3'><br>

//jquery

 $('#ref_no').blur(function(){
            var query_string = $(this).val();
            if(query_string.length>0)
            {
            //var filter = /^[0-9a-zA-Z_-]{4,}$/;
            //if ( preg_match('/^[a-zA-Z0-9.,()@#!?]+$/', $string) )
            var filter = /^[a-zA-Z0-9/#-]{1,}$/;// this allows special characters "/" and "-"
                if (!(filter.test(query_string))) {
                    $('#ref_report').html('<font color=red>This #Ref No. is not accepted</font>');
                    $('.login-apt').attr('disabled', 'disabled');
                    return false;
                }
            $.ajax({
                    type: 'POST',
                    url: "validate.php",
                    //data: query_string,
                    data: {ref_no:query_string},//ref_no

                    success: function(data)
                        {
                        if(data=='exist')
                        {
                            $('#ref_report').html('<font color=red><b>This #Ref. Number does not exist here</b></font>');
                            $('.login-apt').attr('disabled', 'disabled');
                        }
                        else
                        {
                            $('#ref_report').html('<img src=yes.png><font color="Green">Accepted</font>');
                            $('.login-apt').removeAttr('disabled',false);

                        }               
                    }
                });
            }
        });

bellow are the php codes i used on the validat.php to do the trick:

if(isset($_POST['ref_no']))
{
    $ref_no = mysql_real_escape_string(trim($_POST['ref_no']));
    $admin = mysql_real_escape_string(trim($_POST['admin']));
    $sql = "SELECT * FROM `tbl_cms` WHERE `admin`= '$ref_no'";
    $myquery = mysql_query($sql) or die(mysql_error());
    if(mysql_num_rows($myquery) !=0)
    {
        $row = mysql_fetch_array($myquery);

  for($i=0;$i< count($_POST['ref_no']); $i++){
     $data = $_POST['ref_no'][$i];
     $admin = $_POST['admin'][$i];

   $sql="INSERT INTO `tbl_cms` (`admin`, `content`) values('$admin', '" . $data . "')";
           mysql_query($sql);

           }

                echo 'not exist';

    }
    else
    {
            echo 'exist';

    }
}

I have a very simple MySQL table where I want the Scores for each students with their admin to automatically stored as key-in the score.It looks like that:

admin   Content
std1     3      
std2     5 
std3     6 
  .......................................................

My problem is that the code work but save only the content of the first form field i.e std1 score only. Instead of saving the scores of the three students Please guide me on how to perfect this. Thanks

Answer 1

You can not have multiple id attributes with the same value. Use class instead:

Student One:<input  type="text" name='ref_no[]' class='ref_no'><input  type="text" name='admin' id="admin-1" value='st1'><br>
Students Two  <input  type="text" name='ref_no[]' class='ref_no'><input  type="text" name='admin[]' id="admin-2" value='st2'><br>
Student  three  <input  type="text" name='ref_no[]' class='ref_no'><input  type="text" name='admin[]' id="admin-3" value='st3'><br>

$('.ref_no').blur(...);

Note I also changed id="admin" to id="admin-1" etc.