Introduction:
HI, Here i will explain How to Bind the CheckboxList from Ajax call and Web method. In this Section i will bind the values by selecting the value in Dropdownlist.I used a drop downlist control and a Divtag with ID 'BindingDiv' Here Value changes by selecting the value in DropdownList. Use JQuery Support Files.
Aspx code :
HI, Here i will explain How to Bind the CheckboxList from Ajax call and Web method. In this Section i will bind the values by selecting the value in Dropdownlist.I used a drop downlist control and a Divtag with ID 'BindingDiv' Here Value changes by selecting the value in DropdownList. Use JQuery Support Files.
Aspx code :
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="Scripts/jquery-1.4.1.min.js"
type="text/javascript"></script>
<script src="Scripts/jquery-1.4.1.js"
type="text/javascript"></script>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript">
function Load_Details() {
var Regno = document.getElementById('DropDownList2').value;
$.ajax(
{
type: "POST",
contentType: "application/json;charset=utf-8",
url: "drop.aspx/LoadstudentDetails",
data: JSON.stringify({ Regno: Regno }),
dataType: "json",
success: Succe,
error: function (XMLHttpRequest,
textStatus, errorThrown) {
if (XMLHttpRequest.status == 0) {
alert(' Check
Your Network.');
} else if
(XMLHttpRequest.status == 404) {
alert('Requested URL not found.');
} else if
(XMLHttpRequest.status == 500) {
alert('Internel Server Error.');
} else {
alert('Unknow Error.\n' + XMLHttpRequest.responseText);
}
}
});
return false;
}
function Succe(result) {
BindCheck(result);
}
function BindCheck(result) {
var items = JSON.parse(result.d);
CreateCheckBox(items);
}
function CreateCheckBox(checkboxlistItems) {
var table = $('<table></table>');
var counter = 0;
$('.Chkclass').remove();
$('#dvCheckBoxListControl').empty();
$(checkboxlistItems).each(function () table.append($('<tr></tr>').append($('<td></td>').append($('<input>').attr({
type: 'checkbox', name: 'chklistitem', value: this.Value,
id: 'chklistitem' + counter , class : 'Chkclass'
})).append(
$("<label class='Chkclass'>").attr({
for: 'chklistitem'
+ counter++
}).text(this.StudentName))));
});
$(checkboxlistItems).each(function () {
table.append($('<tr></tr>').append($('<td></td>').append($('<input>').attr({
type: 'checkbox', name: 'chklistitem', value: this.Value,
id: 'chklistitem' + counter , class : 'Chkclass'
})).append(
$("<label class='Chkclass'>").attr({
for:
'chklistitem' + counter++
}).text(this.StudentID))));
});
$('#BindingDiv').append(table);
}
</script>
</head>
<body >
<form id="form1" runat="server">
<div align="center">
<br />
<br />
<asp:DropDownList ID="DropDownList2"
runat="server"
onchange="return
Load_Details();">
</asp:DropDownList>
<div id="BindingDiv">
</div>
</div>
</form>
</body>
</html>
C# code :
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.Script.Serialization;
using System.Web.UI.WebControls;
using System.Data;
using System.Windows.Forms;
using System.Configuration;
using System.Data.SqlClient;
using System.Runtime.Serialization;
namespace GridLoad
{
public partial class drop :
System.Web.UI.Page
{
protected void
Page_Load(object sender, EventArgs e)
{
string Conec = ConfigurationManager.ConnectionStrings["Student"].ConnectionString;
SqlConnection con = new
SqlConnection(Conec);
con.Open();
SqlDataAdapter da = new
SqlDataAdapter("
select StudentRegistration from StuRegno", con);
DataTable dt = new
DataTable();
da.Fill(dt);
DropDownList2.DataSource = dt;
DropDownList2.DataValueField = dt.Columns["StudentRegistration"].ColumnName.ToString();
DropDownList2.DataTextField = dt.Columns["StudentRegistration"].ColumnName.ToString();
DropDownList2.DataBind();
}
public class StudentDetails
{
public string
StudentName { get; set;
}
public string Gender
{ get; set; }
public string
StudentID { get; set;
}
}
[System.Web.Services.WebMethod]
public static string LoadstudentDetails(string
Regno)
{
string Conec = ConfigurationManager.ConnectionStrings["Student"].ConnectionString;
SqlConnection con = new
SqlConnection(Conec);
con.Open();
SqlDataAdapter da = new
SqlDataAdapter("SELECT
a.StudentID, a.Studentname, a.Gender FROM StudentMarks AS a INNER JOIN StuRegno
AS b ON a.StudentID = b.StudentID WHERE
(b.StudentRegistration = '" + Regno + "') ", con);
DataTable st = new
DataTable();
da.Fill(st);
List<StudentDetails>
details = new List<StudentDetails>();
foreach (DataRow
dtrow in st.Rows)
{
StudentDetails obj = new StudentDetails();
obj.StudentID = dtrow["StudentID"].ToString();
obj.StudentName = dtrow["StudentName"].ToString();
obj.Gender = dtrow["Gender"].ToString();
details.Add(obj);
}
JavaScriptSerializer ser = new JavaScriptSerializer();
return ser.Serialize(details);
}
}
}