将复选框添加到复选框列表中。
例如:我将数据集值传递为“1001”,“1002”,“1003”,“1004”,“1005”,并使用GetXml()函数将此值作为XML获取。
以上值,将分别为5个复选框添加到复选框列表中。
Default.apsx.vb
<WebMethod()> _
Public Shared Function returnData() As String
Dim dsUtil As New DataSet
Dim lstSQL As String
Dim fdat, tdat, detai, valG, sta As String
Try
fdat = "20140317"
tdat = "20140318"
detai = "College"
valG = "Y"
sta = "2"
lstrSQL = ("Exec SP_College '" & fdat & "','" & tdat & "','" & detai & "','" & valG & "','" & sta & "'")
_Command = New SqlCommand(lstSQL)
Return GetDataset(_Command).GetXml()
Catch Ex As Exception
Throw New Exception("Error " & Ex.Message)
End Try
'Return ms
End Function
Public Shared Function GetDataset(ByVal tSQLQuery As SqlCommand) As DataSet
Dim ds As New DataSet
cn = New SqlConnection("Data Source=localhost; Initial Catalog = master;uid=sa;pwd=sa;")
Try
cn.Open()
Dim da As New SqlDataAdapter(_Command)
_Command.CommandType = CommandType.Text
_Command.Connection = cn
da.Fill(ds, "UTable")
Return ds
Catch oEx As Exception
Throw New Exception("GetDataset-" & oEx.Message)
Finally
ds.Dispose()
End Try
End Function
**Default.aspx page**
<table>
<tr>
<td>
<input type="button" id="btnTray" value="Click here" onclick="checnkAjaxfn()"/>
</td>
<td>
<div id="divCheckBoxList" >
<asp:CheckBoxList ID="chklistId" runat="server">
</asp:CheckBoxList>
</div>
</td>
</tr>
</table>
**Ajax. Json script:**
function checnkAjaxfn() {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "Default.aspx/returnData",
data:{},
dataType: "json",
success: OnSuccess,
failure: function (response) {
alert(response.d);
},
error: function (response) {
alert(response.d);
}
});
}
function OnSuccess(response) {
debugger;
var xmlDoc = $.parseXML(response.d);
var xml = $(xmlDoc);
var xmlData = xml.find("UTable");
var row = $("[id*=chklistId] tr:last-child").clone(true);
$("[id*=chklistId] tr").remove();
$.each(xmlData , function () {
var xData = $(this);
$("label", row).val($(this).find("Sys_ID").text());
$("[id*=chklistId] tbody").append(row);
row = $("[id*=chklistId] tr:last-child").clone(true);
});
}
以上内容不会将复选框添加到复选框列表中。
我调试了。 到达时
$。each(xmlData,function(){
这一行,它来到终点。
请说明如何在checkboxlist
中生成复选框答案 0 :(得分:3)
如果您使用的是asp.net CheckboxList控件,它将在将数据源绑定到它后呈现。如果您不想绑定数据源,则使用CheckboxList没有意义,而是生成具有相同名称的纯HTML复选框。
示例:
<input type="checkbox" name="vehicle" value="Bike">I have a bike<br>
<input type="checkbox" name="vehicle" value="Car">I have a car
您可以使用jQuery生成此html,如下所示:
$(function () {
var arry = ["Bike","Car"];
$(arry).each(function () {
var checkBox = "<input type='checkbox' name='vehicle' value='" + this + "'/>" + this + "<br/>";
$(checkBox).appendTo('#divPlaceHolder');
});});
现在,在您的查询中,您可以使用上面的示例,只需将数组替换为xml输出。
答案 1 :(得分:0)
您在Ajax请求中建议的dataType是JSON,但您正在发送XML数据。 参考https://api.jquery.com/jQuery.ajax/说:
“json”:将响应评估为JSON并返回JavaScript对象。 JSON数据以严格的方式解析;任何格式错误的JSON都会被拒绝,并抛出一个解析错误。从jQuery 1.9开始,空响应也被拒绝;服务器应该返回null或{}的响应。 (有关正确的JSON格式的更多信息,请参阅json.org。)
也许你的ForEach循环只是跳到结束行,你的xmlData变量是空的吗?
答案 2 :(得分:0)
<html>
<head><h1><b><i><center>RADIO BUTTONS </center></i></b></h1></head>
<body bgcolor="palegoldenrod">
<form>
<script src="jquery-1.11.1.js">
</script>
<script>
$(document).ready(function(){
$("#age").blur(function() {
var test = $(this).val();
if(test=="")
{
$("#dropdown").hide();
}
else
{
$("#dropdown").show();
}
});
$.ajax({
type: "GET",
url: "count.xml",
dataType: "xml",
success: function (xml) {
$(xml).find('countrylist').each(function () {
var name = $(this).find('cname1').text();
var option1 = $("<radio>" + name + "</radio>");
var select=$("#div1");
select.append(option1);
var name = $(this).find('cname2').text();
var option2 = $("<radio>" + name + "</radio>");
var select=$("#div2");
select.append(option2);
var name = $(this).find('cname3').text();
var option3 = $("<radio>" + name + "</radio>");
var select=$("#div3");
select.append(option3);
});
}
});
});
function myCountry(country)
{
alert("HI" +country);
$.ajax({
type: "GET",
url: "stat.xml",
dataType: "xml",
success: function (xml) {
var select = $('#div4');
$(xml).find('state').each(function ()
{
var cval=$(this).find('country').text();
if(country==cval){
var name = $(this).find('sname').text();
select.append($("<label>" + name + "</label>"));
}
});
var select = $('#div5');
$(xml).find('state').each(function ()
{
var cval=$(this).find('country').text();
if(country==cval){
var name = $(this).find('sname1').text();
select.append($("<label>" + name + "</label>"));
}
});
var select = $('#div6');
$(xml).find('state').each(function ()
{
var cval=$(this).find('country').text();
if(country==cval){
var name = $(this).find('sname2').text();
select.append($("<label>" + name + "</label>"));
}
});
var select = $('#div7');
$(xml).find('state').each(function ()
{
var cval=$(this).find('country').text();
if(country==cval){
var name = $(this).find('sname3').text();
select.append($("<label>" + name + "</label>"));
}
});
var select = $('#div8');
$(xml).find('state').each(function ()
{
var cval=$(this).find('country').text();
if(country==cval){
var name = $(this).find('sname4').text();
select.append($("<label>" + name + "</label>"));
}
});
var select = $('#div9');
$(xml).find('state').each(function ()
{
var cval=$(this).find('country').text();
if(country==cval){
var name = $(this).find('sname5').text();
select.append($("<label>" + name + "</label>"));
}
});
}
});
}
function myFun(city)
{
alert("hiiiii" +city);
$.ajax({
type: "GET",
url: "city.xml",
dataType: "xml",
success: function (xml) {
$(xml).find('city').each(function ()
{
var sval=$(this).find('state').text();
if(city==sval)
{
var select = $('#div10');
var name = $(this).find('cname').text();
select.append($("<label>" + name + "</label>"));
}
var sval=$(this).find('state').text();
if(city==sval)
{
var select = $('#div11');
var name = $(this).find('cname1').text();
select.append($("<label>" + name + "</label>"));
}
var sval=$(this).find('state').text();
if(city==sval)
{
var select = $('#div12');
var name = $(this).find('cname2').text();
select.append($("<label>" + name + "</label>"));
}
var sval=$(this).find('state').text();
if(city==sval)
{
var select = $('#div13');
var name = $(this).find('cname3').text();
select.append($("<label>" + name + "</label>"));
}
var sval=$(this).find('state').text();
if(city==sval)
{
var select = $('#div14');
var name = $(this).find('cname4').text();
select.append($("<label>" + name + "</label>"));
}
var sval=$(this).find('state').text();
if(city==sval)
{
var select = $('#div15');
var name = $(this).find('cname5').text();
select.append($("<label>" + name + "</label>"));
}
});
}
});
}
</script>
<br>
<br>
<br>
<label style="width:100px;float:left;">First Name</label> <input type="text" id="name"><br><br>
<label style="width:100px;float:left;">Middle Name</label> <input type="text"><br><br>
<label style="width:100px;float:left;">Last Name</label> <input type="text"><br><br>
<label style="width:100px;float:left;">Address Line1</label> <textarea rows="3" cols="16"></textarea><br><br>
<label style="width:100px;float:left;">Address Line2</label> <textarea rows="3" cols="16"></textarea><br><br>
<label style="width:100px;float:left;">Age</label> <input type="number" id="age" value="a"><br><br>
<div id="dropdown" style="display:none">
<label style="width:100px;float:left;">Country</label> <br>
<div id="div1">
<input type="radio" name="country" id="ind" value="India" onclick="myCountry(this.value)">
<label style="width:100px;float:left;"></label> </div><br>
<div id="div2">
<input type="radio" name="country" id="usa" value="US" onclick="myCountry(this.value)">
<label style="width:100px;float:left;"></label> </div><br>
<div id="div3">
<input type="radio" name="country" id="cnd" value="Australia" onclick="myCountry(this.value)">
<label style="width:100px;float:left;"></label></div>
<br>
<br>
<br>
<label style="width:100px;float:left;">State</label> <br>
<br>
<div id="div4">
<input type="radio" name="rad" id="radio2" value="Tamil Nadu" onchange="myFun(this.value)"><label style="width:100px;float:left;"></label>
</div>
<div id="div5">
<input type="radio" name="rad" id="radio2" value="Andhra Pradesh" onchange="myFun(this.value)"><label style="width:100px;float:left;"></label>
</div>
<div id="div6">
<input type="radio" name="rad" id="radio2" value="Florida" onchange="myFun(this.value)"><label style="width:100px;float:left;"></label>
</div>
<div id="div7">
<input type="radio" name="rad" id="radio2" value="NewJersey" onchange="myFun(this.value)"><label style="width:100px;float:left;"></label>
</div>
<div id="div8">
<input type="radio" name="rad" id="radio2" value="Queensland" onchange="myFun(this.value)"><label style="width:100px;float:left;"></label>
</div>
<div id="div9">
<input type="radio" name="rad" id="radio2" value="Maryland" onchange="myFun(this.value)"><label style="width:100px;float:left;"></label>
</div>
<br>
<br>
<br>
<label style="width:100px;float:left;">City:</label> <br>
<div id="div10">
<input type="radio" name="ra" id="c1" >
</div>
<div id="div11">
<input type="radio" name="ra" id="c1" >
</div>
<div id="div12">
<input type="radio" name="ra" id="c1" >
</div>
<div id="div13">
<input type="radio" name="ra" id="c1" >
</div>
<div id="div14">
<input type="radio" name="ra" id="c1" >
</div>
<div id="div15">
<input type="radio" name="ra" id="c1" >
</div>
<br>
<br>
<br>
<br>
<br>
<br>
<button value="" id="but">OK</button>
</b>
</form>
</body>
</html>
*/xml code/*