脚本:
$(document).ready(function () {
$('#Custom').hide('fast');
$('#rbtnEntire').click(function () {
$('#Custom').hide('fast');
$('#Entire').show('fast');
});
$('#rbtnCustom').click(function () {
$('#Entire').hide('fast');
$('#Custom').show('fast');
});
});
function showdiv() {
document.getElementById("divChkList").style.display = "block";
}
aspx文件:
<div style="height:700; width:500;">
<div id="select scan type">
<asp:RadioButton ID="rbtnEntire" runat="server" Text="Entire"
GroupName="s1"/>
<asp:RadioButton ID="rbtnCustom" runat="server" Text="Custom"
GroupName="s1"/>
</div>
<div id="Entire" style="float:left; height:1000; width:1000; border: solid 1px; margin-left:5px;">
Entire<br />
<asp:TreeView ID="TreeView1" runat="server" ShowCheckBoxes="All" ShowLines="True" ExpandDepth="2">
<Nodes>
<asp:TreeNode Text="Entire">
<asp:TreeNode Text="VM">
<asp:TreeNode Text="MBS1">
</asp:TreeNode>
<asp:TreeNode Text="PF1"></asp:TreeNode>
</asp:TreeNode>
<asp:TreeNode Text="VM1">
<asp:TreeNode Text="MBS2"></asp:TreeNode>
<asp:TreeNode Text="PF2"></asp:TreeNode>
</asp:TreeNode>
</asp:TreeNode>
</Nodes>
</asp:TreeView>
<p>
<asp:Button ID="btnCreateXML" runat="server" onclick="btnCreateXML_Click"
Text="Create XML" />
<asp:Label ID="lblResult" runat="server" Text="Label"></asp:Label>
</p></div>
<div id="Custom" style="float:left; height:1000; width:2000; border: solid 1px; margin-left:10px;">
Custom <br />
<div id="Manual" style="border:solid 1px; float:left;">
Manual Scan Controls
</div>
<div id="Multiple" style="border:solid 1px; float:left;">
Multiple Scan Controls
<table>
<tr>
<td valign="top" style="width: 165px">
<asp:PlaceHolder ID="phDDLCHK" runat="server"></asp:PlaceHolder>
</td>
<td valign="top">
<asp:Button ID="btn" runat="server" Text="Get Checked" OnClick="btn_Click" />
</td>
<td valign="top">
<asp:Label ID="lblSelectedItem" runat="server"></asp:Label>
</td>
</tr>
</table>
</div>
<asp:HiddenField ID="hidList" runat="server" />
</div>
<br />
</div>
代码背后的代码:
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
initialiseCheckBoxList();
rbtnEntire.Checked = true;
try
{
TreeView1.Attributes.Add("onclick", "javascript: OnTreeClick();");
}
catch(Exception)
{
Response.Write("Error Occured While onTreeClick");
}
}
}
public void initialiseCheckBoxList()
{
CheckBoxList chkBxLst = new CheckBoxList();
chkBxLst.ID = "chkLstItem";
chkBxLst.Attributes.Add("onmouseover", "showdiv()");
DataTable dtListItem = GetListItem();
int rowNo = dtListItem.Rows.Count;
string lstValue = string.Empty;
string lstID = string.Empty;
for (int i = 0; i < rowNo - 1; i++)
{
lstValue = dtListItem.Rows[i]["Value"].ToString();
lstID = dtListItem.Rows[i]["ID"].ToString();
chkBxLst.Items.Add(lstValue);
}
System.Web.UI.HtmlControls.HtmlGenericControl div = new System.Web.UI.HtmlControls.HtmlGenericControl("div");
div.ID = "divChkList";
div.Controls.Add(chkBxLst);
div.Style.Add("border", "black 1px solid");
div.Style.Add("width", "160px");
div.Style.Add("height", "130px");
div.Style.Add("overflow", "AUTO");
div.Style.Add("display", "block");
}//end of initialiseCheckBoxList()
protected void btn_Click(object sender, EventArgs e)
{
string x=string.Empty;
string strSelectedItem = "Selected Items ";
CheckBoxList chk = (CheckBoxList)phDDLCHK.FindControl("chkLstItem"); // phDDLCHK is placeholder's ID
for (int i = 0; i < chk.Items.Count; i++)
{
if (chk.Items[i].Selected)
{
if (strSelectedItem.Length == 0)
{
strSelectedItem = strSelectedItem + ":" + chk.Items[i].Text;
}
else
{
strSelectedItem = strSelectedItem + ":" + chk.Items[i].Text;
}
}
}
lblSelectedItem.Text =strSelectedItem;
}
public DataTable GetListItem()
{
DataTable table = new DataTable();
table.Columns.Add("ID", typeof(int));
table.Columns.Add("Value", typeof(string));
for (int icnt = 0; icnt < 10; icnt++)
{
table.Rows.Add(icnt, "ListItem"+":"+icnt);
}
return table;
}
问题:当我选择单选按钮rbtnCustom时,它应该显示div Custom以及CheckboxList控件,这不会发生。当我不隐藏div时,会显示它。可以用什么来显示checkboxList控件? 这是我的代码,任何人都可以告诉我哪里出错了? 任何帮助都会得到满足!谢谢!
答案 0 :(得分:0)
您的某些Javascript无法正常工作的原因是您在客户端(Javascript)代码中使用服务器 ID。
<asp:RadioButton ID="rbtnCustom" runat="server" Text="Custom"
GroupName="s1"/>
由于上述控制设置为runat="server"
,ID属性正在设置服务器端控制ID,因此将生成客户端ID。如果您不需要在服务器上访问此控件,则可能更容易使用'input'元素而不是asp.net控件。另一个选项是设置ClientIDMode="Static"
,以便客户端ID与服务器ID相同。
<asp:RadioButton ID="rbtnCustom" runat="server" Text="Custom" ClientIDMode="Static"
GroupName="s1"/>
如果您未在后面的代码中设置ID并且在客户端Javascript中使用ID,则将此用于任何控件。
编辑:您在phDDLCHK.Controls.Add(div);
方法结束时也遗漏了initialiseCheckBoxList
。
你也没有提供什么javascript“OnTreeClick();”是。它在后面的代码中被引用。据我所知,你只是在initialiseCheckBoxList上填充一次自定义复选框列表的内容。
答案 1 :(得分:0)
首先我们创建一个这样的脚本:
<script type="text/javascript">
function check(sender) {
var chkBox;
var i;
var j;
for (i = 1; i < 6; i++) {
for (j = 1; j < 6; j++) {
if (i != j) {
if (sender.id == "ck" + i) {
chkBox = document.getElementById("ck" + j);
}
else {
chkBox = document.getElementById("ck" + i);
}
if (sender.checked) {
if (chkBox.checked) {
chkBox.checked = false;
}
}
}
}
}
}
</script>
现在我们为ASP CheckBox控件使用以下代码
<div>
<asp:CheckBox ID="ck1" runat="server" Text="P1" onclick="check(this)"/>
<asp:CheckBox ID="ck2" runat="server" Text="P2" onclick="check(this)"/>
<asp:CheckBox ID="ck3" runat="server" Text="P3" onclick="check(this)"/>
<asp:CheckBox ID="ck4" runat="server" Text="P4" onclick="check(this)"/>
<asp:CheckBox ID="ck5" runat="server" Text="P5" onclick="check(this)"/>
</div>
谢谢......