Hi ibrahimayh,
The code is correct. You are missing the document ready function end brackets.
Check the exmaple.
Master Page
<%@ Master Language="C#" AutoEventWireup="true" CodeFile="TemsilciIslemleri.master.cs"
Inherits="TemsilciIslemleri" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Aktürk Bilişim Teknolojileri Anonim Şirketi | Bilgi Yönetim Sistemi</title>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" />
<link type="text/css" rel="stylesheet" href="https://cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css" />
<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<header class="header">
<nav class="navbar navbar-expand-lg px-4 py-2 bg-white shadow">
<a href="#" class="sidebar-toggler text-gray-500 mr-4 mr-lg-5 lead"><i class="fas fa-align-left"></i></a><a href="TemsilciBilgilendirme.aspx" class="navbar-brand font-weight-bold text-uppercase text-base">Bilgi Yönetim Sistemi</a>
<ul class="ml-auto d-flex align-items-center list-unstyled mb-0">
<li class="nav-item dropdown ml-auto">
<a id="userInfo" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="nav-link dropdown-toggle">
<img src="Dosyalarim/img/ProfileImage.jpg" style="max-width: 2.5rem;" class="img-fluid rounded-circle shadow"></a>
<div aria-labelledby="userInfo" class="dropdown-menu">
<a href="TemsilciSifreDegistirme.aspx" class="dropdown-item">Şifre Değiştirme</a>
<div class="dropdown-divider"></div>
<a href="Default.aspx" class="dropdown-item">Çıkış</a>
</div>
</li>
</ul>
</nav>
</header>
<div class="d-flex align-items-stretch">
<div id="sidebar" class="sidebar py-3">
<div class="text-gray-400 text-uppercase px-3 px-lg-4 py-4 font-weight-bold small headings-font-family">
İşlemler</div>
<ul class="sidebar-menu list-unstyled">
<li class="sidebar-list-item"><a href="TemsilciBilgilendirme.aspx" class="sidebar-link text-muted bg-hover-gradient-primary">
<i class="o-home-1 mr-3 text-gray"></i><span>Ana Sayfa</span></a></li>
<li class="sidebar-list-item"><a href="GRTemsilciCariHesapIslemleri.aspx" class="sidebar-link text-muted bg-hover-gradient-primary">
<i class="o-paperwork-1 mr-3 text-gray"></i><span>Cari Hesap Bilgileri</span></a></li>
</ul>
<div class="text-gray-400 text-uppercase px-3 px-lg-4 py-4 font-weight-bold small headings-font-family">
Sipariş</div>
<ul class="sidebar-menu list-unstyled">
<li class="sidebar-list-item"><a href="TemsilciSiparisIslemleri.aspx" class="sidebar-link text-muted bg-hover-gradient-primary">
<i class="o-paperwork-1 mr-3 text-gray"></i><span>Sipariş İşlemleri</span></a></li>
</ul>
</div>
<div class="page-holder w-100 d-flex flex-wrap">
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
<footer class="footer bg-white shadow align-self-end py-3 px-xl-5 w-100">
<div class="container-fluid">
<div class="row">
<div class="col-md-6 text-center text-md-left text-primary">
<p class="mb-2 mb-md-0">Aktürk Bilişim Teknolojileri Anonim Şirketi © 2019 - ∞</p>
</div>
<div class="col-md-6 text-center text-md-right text-gray-400">
<p class="mb-0">Halil İbrahim AYHAN | System and Infrastructure Manager</p>
</div>
</div>
</div>
</footer>
</div>
</div>
</form>
</body>
</html>
Content Page
<%@ Page Title="" Language="C#" MasterPageFile="~/TemsilciIslemleri.master" AutoEventWireup="true"
CodeFile="TemsilciSiparisIslemleri.aspx.cs" Inherits="TemsilciSiparisIslemleri" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<div class="container-fluid px-xl-5">
<section class="py-5">
<div class="row">
<div class="col-lg-12 mb-4">
<div class="card">
<div class="card-header">
<h6 class="text-uppercase mb-0">Satış Temsilci Sipariş İşlemleri</h6>
</div>
<div class="card-body">
<div style="overflow-x: auto;">
<div>
<asp:TextBox ID="TextBox1" runat="server" CssClass="form-control"></asp:TextBox>
<br />
<asp:TextBox ID="TextBox2" runat="server" CssClass="form-control"></asp:TextBox>
<br />
<asp:TextBox ID="TextBox3" runat="server" CssClass="form-control"></asp:TextBox>
<br />
<asp:Button ID="BTNSatisIslemleri" runat="server" CssClass="btn btn-primary shadow px-5 shadow form-control-range" Text="Ekle" OnClientClick="return false" />
<br /><br />
</div>
<table id="SatisTemsilcisiSiparisListesi" class="table table-striped card-text">
<thead>
<tr>
<th scope="col">Name and Surname</th>
<th scope="col">Age</th>
<th scope="col">Country</th>
</tr>
</thead>
</table>
<br />
<asp:Button ID="BTNIslemTamamla" runat="server" CssClass="btn btn-primary shadow px-5 shadow form-control-range" Text="Tamamla" OnClientClick="return false" />
</div>
</div>
</div>
</div>
</div>
</section>
</div>
<script type="text/javascript">
$(document).ready(function () {
var table = $('[id*=SatisTemsilcisiSiparisListesi]').DataTable({
"order": [[2, "asc"]],
dom: 'Bfrtip',
buttons: ['copy', 'csv', 'excel', 'pdf', 'print']
});
$('[id*=BTNSatisIslemleri]').click(function () {
var rowNode = table
.row.add([$('[id*=TextBox1]').val(), $('[id*=TextBox2]').val(), $('[id*=TextBox3]').val()])
.draw()
.node();
$(rowNode).css('color', 'black').animate({ color: 'black' });
});
$('[id*=BTNIslemTamamla]').click(function () {
var customers = [];
table.rows().data().each(function (value, index) {
var obj = {};
obj.Name = value[0];
obj.Age = value[1];
obj.Country = value[2];
customers.push(obj);
});
//Send the JSON array to WebMethod using AJAX.
$.ajax({
type: "POST",
url: "TemsilciSiparisIslemleri.aspx/InsertCustomers",
data: '{ customers :' + JSON.stringify(customers) + '}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (r) {
alert(r.d + " record(s) inserted.");
}, error: function (r) {
}
});
});
});
</script>
</asp:Content>
Code
public class SiparisListesi
{
public string Name { get; set; }
public int Age { get; set; }
public string Country { get; set; }
}
[System.Web.Services.WebMethod]
public static int InsertCustomers(List<SiparisListesi> customers)
{
// Rest of your code.
return customers.Count;
}
Screenshots
The Page
List in Code
