CRUD JQuery1

<form id="form2" runat="server">
     <input type="hidden" id="lblId" />
       <table style="font-size: 18px" id="tblStudentForm">
            <tr>
                <td colspan="2">
                    <h1>Registration Form</h1>
                </td>
            </tr>
            <tr>
                <td>Name</td>
                <td>
                    <input type="text" id="txtName" /></td>
            </tr>
            <tr>
                <td>Subject:</td>
                <td>
                    <select name="pets" id="ddlSub">
                        <option value="">--Select Subjects--</option>
                        <option value="1">Physics</option>
                        <option value="2">Chemistry</option>
                        <option value="3">Biology</option>
                        <option value="4">Maths</option>
                        <option value="5">English</option>
                        <option value="6">Computer</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>Email:</td>
                <td>
                    <input type="email" id="txtEmail" /></td>
            </tr>
            <tr>
                <td>Gender:</td>
                <td>
                    <label>
                        Male
            <input type="radio" id="rbtnmale" name="gender" value="male" />
                    </label>
                     
            <label>
                FeMale
            <input type="radio" id="rbtnfemale" name="gender" value="female" />
            </label>
                </td>
            </tr>
            <tr>
                <td></td>
                <td>
                    <button type="button" onclick="adddata()">Save<</button>
                    <asp:Button ID="btnClear" runat="server" Text="Clear" />
                </td>
            </tr>
        </table>
     <h2>Registration Data</h2>
        <div>
            <table class="table" id="tblStudents">
                <thead class="thead-dark">
                    <tr>
                        <th scope="col">Id</th>
                        <th scope="col">Name</th>
                       <th scope="col">Email</th>
                        <th scope="col">Gender</<th>
                        <th scope="col">Subject</<th>
                        <th scope="col">Actions</<th>
                    </tr>
               </thead>
                <tbody id="tabledata">
             </tbody>
          </table>
      </div>
</form>

$(document).ready(function () {
    getAllStudent();
});

function getAllStudent() { 
    $.ajax({
        type: "POST",
        url: 'StudentForm.aspx/GetAll',
        crossDomain: true,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (response) {
            var datas = JSON.parse(response.d); 
            $('#tabledata').empty();
            for (var i = 0; i < datas.length; i++) {
                $('#tabledata').append('<tr id="trStudent_' + datas[i].Id+'"><td>' + 
                            '<a href="#" onclick="getStudentDetail(' + datas[i].Id +
                            ',this)">edit</a> | <a href="#"  onclick="deleteStudent(' + 
                             datas[i].Id + ')">delete</a>' + '</td>' +
                    '<td id>' + datas[i].Id + '</td>' +
                    '<td name>' + datas[i].Name + '</td>' +
                    '<td email>' + datas[i].Email + '</td>' +
                    '<td gen>' + datas[i].Gender + '</td>' +
                    '<td sub>'+ datas[i].SubjectId + '</td></tr>');
            }  
        },
        error: function (err) {
            console.log(err);
        }
    });
}

function getStudentDetail(id) {
    $.ajax({
        type: "POST",
        url: 'StudentForm.aspx/GetById',
        crossDomain: true,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        data: JSON.stringify({ id: id }),
        success: function (response) {
            var data1 = (JSON.parse(response.d))
            $('#lblId').val(data1[0].id);
            $('#txtName').val(data1[0].name);
            $('#txtEmail').val(data1[0].email);
            if (data1[0].gender == "male") {
                $('#rbtnmale').prop("checked", true)
            } if (data1[0].gender == "female") {
                $('#rbtnfemale').prop("checked", true)
            }
            alert(data1[0].gender)
            $('#ddlSub option[value=' + data1[0].subjectid + ']').attr("selected", ""); 
        },
        error: function (err) {
            console.log(err);
        }
    });
}

function deleteStudent(id) {
    if (confirm("do you want to delete ")) {
        $.ajax({
            type: "POST",
            url: 'StudentForm.aspx/Delete',
            crossDomain: true,
            contentType: "application/json; charset=utf-8",
            data: "{'id':" + id + "}",
            success: function (response) {
                alert("Row Deleted Successfully");
            },
            error: function (err) {
                console.log(err);
            }
        });
    }
}

function adddata() { 
    $.ajax({
        type: "POST",
        url: 'StudentForm.aspx/InsertOrUpdate',
        crossDomain: true,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        data: "{'id':'" + $('#lblId').val() +
            "','name':'" + $('#txtName').val() +
            "','email':'" + $('#txtEmail').val() +
            "','gender':'" + $('[name="gender"]:checked').attr("value") +
            "','subject':'" + $('#ddlSub').val() + "'}",
        success: function (response) {
            alert("data added");
        },
        error: function (err) {
            console.log(err);
        }
    });
}

[WebMethod]
public static string GetAll()
{
 sqlHelper sqlhel = new sqlHelper();
 return JsonConvert.SerializeObject(sqlhel.getDataTable(@"select * from tblStudents"));
}
[WebMethod]
public static string GetById(int id)
{
 sqlHelper sqlhel = new sqlHelper();
 var query = @" select s.id,s.name,s.email,s.gender,m.Sub_Name from tblStudents s
 left outer join MasterSubjects m on s.Id = m.Id    
 where s.Id=" + id;
 return JsonConvert.SerializeObject(sqlhel.getDataTable(query));
     }
[WebMethod]
public static string Delete(int id)
{
    sqlHelper sqlhel = new sqlHelper();
     var query = @"delete from tblStudents where id=" + id;
      return JsonConvert.SerializeObject(sqlhel.getDataRow(query));
}
[WebMethod]
public static string InsertOrUpdate(string id, string name, string email, string gender, string subject )
{
    sqlHelper sqlhel = new sqlHelper();
    string[] cols = { "Name", "email", "gender", "subjectId" };
    object[] vals = { name, email, gender, subject  };
    if (string.IsNullOrEmpty(id))
     {
        sqlhel.insertValIntoTable("tblStudents", cols, vals);
     }
    else
     {
         sqlhel.updateValIntoTable("tblStudents", cols, vals, "id", id);
     }
      return "";
}