复选框的状态不会被保存时更新面板火灾 [英] checkbox status not saved when update panel fires
问题描述
我有一个DIV ID = campaignDiv 我动态地加载其内容
I have an div id = campaignDiv and I load its content dynamically
含量复选框。
我有每30秒触发一个更新面板。
I have an update panel that fires every 30 seconds.
在更新面板火灾，复选框返回到默认状态，这是不选。
when the update panel fires, the checkboxes return to the default state, which is unselected.
我会给你我所有的code。其实这是很简单的code。 您可以复制，粘贴在你的Visual Studio，也将努力
I will give you all my code. Actually it is very simple code. you can copy paste it in you visual studio and it will work
WebForm4.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm4.aspx.cs" Inherits="TestDropdownChecklist.WebForm4" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link rel="stylesheet" href="StyleSheet1.css"/>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Timer ID="Timer1" runat="server" OnTick="Timer1_Tick">
</asp:Timer>
<div id="campaignDiv" runat="server">
<ul>
</ul>
</div>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
</Triggers>
</asp:UpdatePanel>
</form>
</body>
</html>
WebForm4.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace TestDropdownChecklist
{
public partial class WebForm4 : System.Web.UI.Page
{
private string CreateLiCheckbox(string checkBoxText)
{
return string.Format("<li><span class=\"textDropdown\">{0}</span><input runat=\"server\" id=\"{1}\" value=\"{0}\" type=\"checkbox\"><label for=\"{1}\"></label></li>", checkBoxText, checkBoxText + "dropdownID");
}
protected void Page_Load(object sender, EventArgs e)
{
int refreshtime = 30000;
Timer1.Interval = refreshtime;
if (!IsPostBack)
{
string[] comps = new string[] { "default", "sales", "direct"};
string html = "<ul>";
for (int i = 0; i < comps.Count(); i++)
{
html = html + CreateLiCheckbox(comps[i]);
}
html = html + "</ul>";
campaignDiv.InnerHtml = html;
}
else
{
}
}
protected void Timer1_Tick(object sender, EventArgs e)
{
}
}
}
StyleSheet1.css
#DropdownSeviceLink {
float: right;
margin-right: 10px;
}
a#DropdownServiceLink:visited {
color: inherit;
}
#campaignDiv {
background-color: #374954;
width: 200px;
height: 170px;
padding-bottom: 10px;
position: absolute;
top: 40px;
right: 0;
}
#campaignDiv ul {
color: #fff;
list-style: none;
overflow: auto;
padding-left: 5px;
height:100%;
}
#campaignDiv input[type=checkbox] {
visibility: hidden;
}
#campaignDiv input[type=checkbox]:checked + label {
left: 60px;
background: #26ca28;
}
#campaignDiv li {
width: 100px; /*120*/
height: 25px; /*40*/
background: #333;
margin: 13px 0px; /*20px 60px*/
border-radius: 50px;
position: relative;
}
#campaignDiv li:before {
content: 'On';
position: absolute;
top: 4px; /*12*/
left: 13px;
height: 2px;
color: #26ca28;
font-size: 16px;
}
#campaignDiv li:after {
content: 'Off';
position: absolute;
top: 4px; /*12*/
left: 71px; /*84*/
height: 2px;
color: #111;
font-size: 16px;
}
#campaignDiv li label {
display: block;
width: 36px; /*52*/
height: 18px; /*22*/
border-radius: 50px;
-webkit-transition: all .5s ease;
-moz-transition: all .5s ease;
-o-transition: all .5s ease;
-ms-transition: all .5s ease;
transition: all .5s ease;
cursor: pointer;
position: absolute;
top: 4px; /*9*/
z-index: 1;
left: 12px;
background: #ddd;
}
.textDropdown {
margin:0px;
padding:0px;
margin-left: 110px;
}
请注意，我用的 RUNAT服务器了。也许我应该以另一种方式动态地添加复选框？
Please notice that I am using runat server already. maybe I should have added the checkbox dynamically in another way?
通过互联网准备好后，我发现我可能需要复选框添加到我这样的更新面板 UpdatePanel1.ContentTemplateContainer.Controls.Add（动态控制）;
但问题是在我的情况下，该复选框是字符串不是对象。对吧？
after readying through internet, I find that I may need to add the checkboxes to my update panel like this
UpdatePanel1.ContentTemplateContainer.Controls.Add(dynamic controls);
but the problem is the the checkbox in my case is string not objects. right?
您的帮助是非常AP preciated。
Your help is highly appreciated.
你的答案是真的有用，我thaaaaaaaaaaaaaank你，但请我还是老样子没有解决这个问题，
您code使这个呈现的HTML
Your answer is really works, I thaaaaaaaaaaaaaank you , but please I stil have this issue not solved, your code made this rendered html
<ul id="campaignDiv"> <li><input id="campaignDiv_0" type="checkbox" name="campaignDiv$0" checked="checked" value="default"><label for="campaignDiv_0">default</label></li> <li><input id="campaignDiv_1" type="checkbox" name="campaignDiv$1" value="sales"><label for="campaignDiv_1">sales</label></li> <li><input id="campaignDiv_2" type="checkbox" name="campaignDiv$2" value="direct"><label for="campaignDiv_2">direct</label></li> </ul>
其中 campaignDiv 是UL的ID。好心你可以编辑你的答案让呈现的HTML可以是这样的：
where the campaignDiv is the ID of the ul. kindly can you edit your answer so the rendered html can be like this:
<div id = campaignDiv>
<ul>
<li>
checkbox here
</li>
</ul>
</div>
在code我做了campaginDiv 的id ASP：的CheckBoxList
推荐答案
要对code更多的空间，这是我的建议的CheckBoxList再次。我希望这是你所要求的东西。
To have more space for code here is my suggestion for the checkboxlist again. I hope it's that what you are asking for.
的.aspx
<asp:UpdatePanel ID="upStuff" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<div id="campaignDiv">
<asp:CheckBoxList runat="server" RepeatLayout="UnorderedList" ID="myCheckboxList" TextAlign="Left">
</div>
</asp:CheckBoxList>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick"/>
</Triggers>
</asp:UpdatePanel>
.aspx.cs
if (!IsPostBack)
{
var comps = new[] { "default", "sales", "direct" };
for (int i = 0; i < comps.Count(); i++)
{
myCheckboxList.Items.Add(new ListItem{Text = comps[i]});
}
}
此方式，将让您选中复选框
This way it will keep your checkbox checked
这篇关于复选框的状态不会被保存时更新面板火灾的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
