如何使用jquery将数据库数据绑定到MVC中的数据表 [英] How to bind data base data to datatable in MVC using jquery
本文介绍了如何使用jquery将数据库数据绑定到MVC中的数据表的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
如何使用Jquery将数据库数据绑定到mvc中的数据表
i我正在尝试下面的代码,但我会得到
没有数据可用 表
in datatable
i am使用
return Json( new {data = objEmp},JsonRequestBehavior.AllowGet );
在控制器中获取详细信息但它会出现Json输出
但是我需要数据输出
请帮帮我朋友
预付款.........
我尝试过:
controler ..
public ActionResult Pandu()
{
// 列表<员工> objEmp = new List< Employee>();
Employee objEmp = new Employee();
DataBaseData objDB = new DataBaseData();
objEmp.ShowallCustomer = objDB.Selectalldata();
// return View(new {data = objEmp});
< span class =code-comment> // 返回Json(new {data = objEmp},JsonRequestBehavior.AllowGet);
return 查看(Json(objEmp));
}
型号......
public 列表<员工> Selectalldata()
{
// string result =;
列表<员工> Emplist = null ;
MySqlCommand cmd = new MySqlCommand( 选择*来自学生,Con);
MySqlDataAdapter da = new MySqlDataAdapter(cmd);
DataSet Ds = new DataSet();
da.Fill(Ds);
Emplist = new 列表< Employee>();
for ( int i = 0 ; i < Ds.Tables [ 0 ]。Rows.Count; i ++)
{
员工cobj = 新员工();
cobj.Id = Convert.ToInt32(Ds.Tables [ 0 ]。行[i] [ Id]。ToString());
cobj.Name = Ds.Tables [ 0 ]。行[i] [ < span class =code-string> Name]。ToString();
cobj.EmailId = Ds.Tables [ 0 ]。行[i] [ < span class =code-string> EmailId]。ToString();
cobj.MobileNo = Ds.Tables [ 0 ]。行[i] [ < span class =code-string> MobileNo]。ToString();
cobj.City = Ds.Tables [ 0 ]。行[i] [ < span class =code-string> City]。ToString();
cobj.image = Ds.Tables [ 0 ]。行[i] [ < span class =code-string> Image]。ToString();
Emplist.Add(cobj);
}
return Emplist;
}
查看....
< link href = http://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css rel = stylesheet >
< script src = http://code.jquery.com/jquery-1.10.2.js\"> < / script >
< script src = http://code.jquery.com/ui/1.10.4/jquery-ui.js > < / script >
< 链接 rel = stylesheet type = text / css href = http://cdn.datatables.net/1.10.9/css /jquery.dataTables.min.css\">
< < span class =code-leadattribute> script >
$( document )。ready( function (){
$(' #myTable的'跨度>)数据表();
});
< / script >
< div style = width:90%; margin:0 auto; >
< 表 id = myTable >
< thead >
< tr >
< th > Id < / th >
< th > 名称< / th >
< th > EmailId < / th >
< th > MobileNo < / th >
< th > 城市< / th >
< th > image < / th >
< / tr >
< / thead >
< tbody &g t; < / tbody >
< / table >
< / div >
< style >
tr 。甚至 {
< span class =code-attribute> background-color : #F5F5F5 !important ;
}
< / style >
< link href = // cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css\" rel = 样式表 / >
@section脚本{
< script src = / /cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js\"> < / script >
< script < span class =code-keyword>>
$( document )。ready( function (){
$(' #myTable')。DataTable( {
bJQueryUI: true ,
bServerSide: true ,
ajax:{
url: / Employees / Pandu,
type: GET,
contentType: application / json; charset = utf-8,
dataType: json,
data:data
},
});
});
< / < span class =code-leadattribute> script >
}
解决方案
( document )。ready( function (){
(' #myTable')。DataTable();
});
< / script >
< div style = width:90%;保证金:0自动; >
< 表 id = myTable >
< thead >
< tr >
< th > Id < / th >
< th > 名称< / th >
< th > EmailId < / th >
< th > MobileNo < / th >
< th > 城市< / th >
< th > image < / th >
< / tr >
< / thead >
< tbody > < < span class =code-leadattribute> / tbody >
< / table >
< / div >
< style >
tr 。甚至 {
background-color : #F5F5F5 !important ;
}
< / style >
< link href = //cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css\" rel = stylesheet / >
@section脚本{
< script src = // cdn.datatables .net / 1.10.9 / js / jquery.dataTables.min.js > < / script >
< script >
( document )。ready( function (){
how to bind data base data to datatable in mvc using Jquery
i am trying bellow code but i will get
No data available in table
in datatable
i am using
return Json(new { data = objEmp }, JsonRequestBehavior.AllowGet);
in controler getting details but it will comes Json output
but i need datatable output
please Help me Friends
Advance thanks.........
What I have tried:
controler..
public ActionResult Pandu()
{
//List<Employee> objEmp = new List<Employee>();
Employee objEmp = new Employee();
DataBaseData objDB = new DataBaseData();
objEmp.ShowallCustomer = objDB.Selectalldata();
//return View(new { data = objEmp });
//return Json(new { data = objEmp }, JsonRequestBehavior.AllowGet);
return View(Json(objEmp));
}
Model...
public List<Employee> Selectalldata()
{
//string result = "";
List<Employee> Emplist = null;
MySqlCommand cmd = new MySqlCommand("Select * from student", Con);
MySqlDataAdapter da = new MySqlDataAdapter(cmd);
DataSet Ds = new DataSet();
da.Fill(Ds);
Emplist = new List<Employee>();
for (int i = 0; i < Ds.Tables[0].Rows.Count; i++)
{
Employee cobj = new Employee();
cobj.Id = Convert.ToInt32(Ds.Tables[0].Rows[i]["Id"].ToString());
cobj.Name = Ds.Tables[0].Rows[i]["Name"].ToString();
cobj.EmailId = Ds.Tables[0].Rows[i]["EmailId"].ToString();
cobj.MobileNo = Ds.Tables[0].Rows[i]["MobileNo"].ToString();
cobj.City = Ds.Tables[0].Rows[i]["City"].ToString();
cobj.image = Ds.Tables[0].Rows[i]["Image"].ToString();
Emplist.Add(cobj);
}
return Emplist;
}
View....
<link href="http://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="http://cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css">
<script>
$(document).ready(function () {
$('#myTable').DataTable();
});
</script>
<div style="width:90%; margin:0 auto;">
<table id="myTable">
<thead>
<tr>
<th>Id</th>
<th>Name</th>
<th>EmailId</th>
<th>MobileNo</th>
<th>City</th>
<th>image</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<style>
tr.even {
background-color: #F5F5F5 !important;
}
</style>
<link href="//cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css" rel="stylesheet" />
@section Scripts{
<script src="//cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script>
<script>
$(document).ready(function () {
$('#myTable').DataTable({
"bJQueryUI": true,
"bServerSide": true,
"ajax": {
"url": "/Employees/Pandu",
"type": "GET",
contentType: "application/json; charset=utf-8",
dataType: "json",
"data": data
},
});
});
</script>
}
解决方案
(document).ready(function () {
('#myTable').DataTable(); }); </script> <div style="width:90%; margin:0 auto;"> <table id="myTable"> <thead> <tr> <th>Id</th> <th>Name</th> <th>EmailId</th> <th>MobileNo</th> <th>City</th> <th>image</th> </tr> </thead> <tbody></tbody> </table> </div> <style> tr.even { background-color: #F5F5F5 !important; } </style> <link href="//cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css" rel="stylesheet" /> @section Scripts{ <script src="//cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script> <script>
(document).ready(function () {
这篇关于如何使用jquery将数据库数据绑定到MVC中的数据表的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文