I have to dynamically populate a checkbox inside an update panel in a Sharepoint site.
The problem is that eventhough i clear the selections after a button is clicked,the checkbox somehow remembers the previous selections and and shows checkbox.items[i].selected as true even for the previous selections
This issue is resolved if i remove the update panel.However i cant remove the update panel coz the whole page reloads every time a selection is made
Below is my code
<div align="left">
<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="True" >
<ContentTemplate>
<asp:CheckBoxList BackColor="White" AutoPostBack="true" ID="cbHideTabs"
runat="server" isCheckable="true" ForeColor="#0072bc" Width="300px" >
</asp:CheckBoxList>
<input type ="button" Visible ="true" ID="HideShowTabButton" value="HideShowTab" title="HideShowTab" runat="server" style="background-color: #0072bc; color: #FFFFFF;" enableviewstate="False" />
</ContentTemplate>
</asp:UpdatePanel>
</div>
</asp:Panel>
<br />
<asp:PopupControlExtender ID="PopupControlExtender1" Enableviewstate="false" runat="server" CommitProperty="value"
PopupControlID="Panel1"
Position="Bottom" TargetControlID="ShowHideLabel">
</asp:PopupControlExtender>
Can you share the code which you are using for Clearing the selection.
I modified your code and its working for me.
Code for aspx page
<%# Page Title="Home Page" Language="vb" MasterPageFile="~/Site.Master" AutoEventWireup="false"
CodeBehind="Default.aspx.vb" Inherits="UpdateCheckbox._Default" %>
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<div>
<asp:scriptmanager ID="Scriptmanager1" runat="server"></asp:scriptmanager>
<asp:updatepanel ID="Updatepanel1" runat="server">
<ContentTemplate>
<asp:CheckBoxList ID="chkAll" BackColor="White" AutoPostBack="true"
runat="server" isCheckable="true" ForeColor="#0072bc" Width="300px" >
<asp:ListItem Enabled="true" Text="1"></asp:ListItem>
<asp:ListItem Enabled="true" Text="1"></asp:ListItem>
<asp:ListItem Enabled="true" Text="1"></asp:ListItem>
<asp:ListItem Enabled="true" Text="1"></asp:ListItem>
<asp:ListItem Enabled="true" Text="1"></asp:ListItem>
<asp:ListItem Enabled="true" Text="1"></asp:ListItem>
<asp:ListItem Enabled="true" Text="1"></asp:ListItem>
<asp:ListItem Enabled="true" Text="1"></asp:ListItem>
</asp:CheckBoxList>
<asp:Button runat="server" Text="HideShowTab" runat="server" OnClick="Clear_Click" style="background-color: #0072bc; color: #FFFFFF;" enableviewstate="False" />
</ContentTemplate>
</asp:updatepanel>
</div>
</asp:Content>
Code in vb.net
Protected Sub Clear_Click(ByVal sender As Object, ByVal e As System.EventArgs)
chkAll.ClearSelection()
End Sub
Related
I have pagination in an UpdatePanel.
I have a dropdownlist that controls which field will be sorted on.
I have added both the sort button and the pagination menu as AsyncPostBackTriggers. My sort button works fine, but my pagination menu resets the sort dropdownlist to the default value every time I click it. When I step through the code, I can see the sort button fires the (!IsPostBack) section, and the pagination menu fires the "Else" section of my page load.
So, I can click any page and it works fine. I can sort and it will return the proper records sorted for that page. When I click on a page number again, the sort returns to the default. I want to allow my users to sort one time and then page through the sorted data.
So, how can I turn off PostBack on a menu?
My relevant code looks like this:
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server" >
<table>
<tr>
<td width="150">
<asp:DropDownList ID="cboSortBy" runat="server" Width="120" ViewStateMode="Enabled">
<asp:ListItem Value="StatusText">Benefit Type</asp:ListItem>
<asp:ListItem Value="PRIORITY_RANK">Priority Rank</asp:ListItem>
<asp:ListItem Value="ACTIVE_FLG">Active Flag</asp:ListItem>
</asp:DropDownList>
</td>
<td width="180"><asp:Button ID="btnSort" runat="server"
Text="Sort" Width="121px" onclick="btnSort_Click" /></td>
</tr>
</table>
<asp:Label ID="Label1" runat="server" Font-Bold="True" />
<br />
<div class="clear" id="NavDiv" style="width:1000px; margin:0 auto; display: table;">
<asp:Menu ID="NavMenu" runat="server" CssClass="navmenu"
IncludeStyleBlock="false" Orientation="Horizontal" width="703px"
BackColor="#CC3300">
<Items>
<asp:MenuItem NavigateUrl="~/Default.aspx" Text="First" Selectable="true" />
</Items>
</asp:Menu>
</div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<table width="570">
<tr>
<td>
<asp:UpdatePanel ID="SearchPanel" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="NavMenu" />
<asp:AsyncPostBackTrigger ControlID="btnSort" EventName="Click" />
</Triggers>
<ContentTemplate>
<asp:Repeater ID="BenTypeRepeater" runat="server" onitemcommand="Repeater2_ItemCommand">
<HeaderTemplate>
<table>
<tr bgcolor="#007ACC" style="color:White">
<td></td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td colspan = "2"></td>
<tr>
</ItemTemplate>
<SeparatorTemplate>
<tr>
<td colspan="5"></td>
</tr>
</SeparatorTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</ContentTemplate>
</asp:UpdatePanel>
</td>
</tr>
</table>
Add AutoPostBack="true" to dropdown
<asp:DropDownList ID="cboSortBy" runat="server" Width="120" ViewStateMode="Enabled" AutoPostBack="true">
<asp:ListItem Value="StatusText">Benefit Type</asp:ListItem>
<asp:ListItem Value="PRIORITY_RANK">Priority Rank</asp:ListItem>
<asp:ListItem Value="ACTIVE_FLG">Active Flag</asp:ListItem>
</asp:DropDownList>
I just want to ask what's the problem in my codes here? The OnSelectedIndexChanged event in #cbList is working fine but the ondrop event in #sortable2 is not working. I tried placing it inside and outside the update panel. The code that is being called in the ondrop is in code behind. It just change the dummyText's text.
Here's my code:
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="true">
<ContentTemplate>
<input type="hidden" runat="server" id="hdnSelectedValue" />
<asp:CheckBoxList ID="cbList" runat="server" AutoPostBack="true" OnSelectedIndexChanged="cbList_SelectedIndexChanged">
<asp:ListItem Text="One" Value="1">
</asp:ListItem>
<asp:ListItem Text="Two" Value="2">
</asp:ListItem>
<asp:ListItem Text="Three" Value="3">
</asp:ListItem>
<asp:ListItem Text="Four" Value="4">
</asp:ListItem>
<asp:ListItem Text="Five" Value="5">
</asp:ListItem>
</asp:CheckBoxList>
<br />
<asp:Label ID="lblSelection" runat="server"></asp:Label>
<asp:Label ID="dummyText" runat="server" Text="Here"></asp:Label>
<ul id="sortable2" runat="server" class="connectedSortable" ondrop="Change_Text"></ul>
</ContentTemplate>
</asp:UpdatePanel>
</form>
ondrop="" is client side event. You cannot wired up this event in code behind.
Check this link for more information on OnDrop event
I am having trouble with asp:UpdatePanel and Trigger of ASP.NET WebForms. Trigger could not find the event on my UpdatePanel. I've seen a lot of examples and I copied their implementations but could not get it right. I'm totally new in WebForms. Please help. Thank you.
<tr>
<td class="label1">Will use ETL?</td>
<td>
<asp:UpdatePanel runat="server" UpdateMode="Conditional" ID="updatePanel1">
<ContentTemplate>
<asp:RadioButtonList ID="useEtl" runat="server" RepeatDirection="Horizontal" Width="120" OnSelectedIndexChanged="useEtl_SelectedIndexChanged">
<asp:ListItem Text="Yes" Value="1" />
<asp:ListItem Text="No" Value="0" />
</asp:RadioButtonList>
</ContentTemplate>
</asp:UpdatePanel>
</td>
<td class="label1">ETL Box</td>
<td>
<asp:UpdatePanel runat="server" UpdateMode="Conditional" ID="updatePanel2">
<ContentTemplate>
<asp:TextBox ID="etlBox" runat="server"/>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="useEtl" EventName="OnSelectedIndexChanged" />
</Triggers>
</asp:UpdatePanel>
</td>
</tr>
change your code as follows:
<asp:AsyncPostBackTrigger ControlID="useEtl" EventName="SelectedIndexChanged" />
the event name you mentioned was wrong that's the reason for not working.
you can also try the following code for the same
UpdatePanel1.Triggers.Add(new AsyncPostBackTrigger()
{
ControlID = useEtl,
EventName = "SelectedIndexChanged", // this may be optional
}
td>
<asp:UpdatePanel runat="server" UpdateMode="Conditional" ID="updatePanel1">
<ContentTemplate>
<asp:RadioButtonList ID="useEtl" runat="server" RepeatDirection="Horizontal" AutoPostBack="true" Width="120" OnSelectedIndexChanged="useEtl_SelectedIndexChanged">
<asp:ListItem Text="Yes" Value="1" />
<asp:ListItem Text="No" Value="0" />
</asp:RadioButtonList>
</ContentTemplate>
</asp:UpdatePanel>
</td>
<td class="label1">ETL Box</td>
<td>
<asp:UpdatePanel runat="server" UpdateMode="Conditional" ID="updatePanel2">
<ContentTemplate>
<asp:TextBox ID="etlBox" runat="server" Enabled="false"/>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="useEtl" EventName="SelectedIndexChanged" />
</Triggers>
</asp:UpdatePanel>
</td>
I have a drop down list named "DropDownList1". Any value picked from the drop down list must not refresh the page, but only refresh the panel My code is as follows.
<asp:DropDownList ID="DropDownList1" runat="server" Width="200px" autopostback="true" OnSelectedIndexChanged="DropDownList1sel">
<asp:ListItem Text="abc" Value="0"></asp:ListItem>
<asp:ListItem Text="a" Value="1"></asp:ListItem>
<asp:ListItem Text="b" Value="2"></asp:ListItem>
<asp:ListItem Text="c" Value="3"></asp:ListItem>
</asp:DropDownList>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Label ID="Label1" runat="server" Text=""></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
When i run this code, it must call the function named "DropDownList1sel" in the ascx.cs where "Label1" is populated. Now the page is refreshed and the values are populated. I want to have the panel refreshed without the page being reloaded. Please help.
Few things to do
Set UpdateMode=conditional then add Trigger as DropDownList1
<asp:UpdatePanel ID="UpdatePanel1" UpdateMode="conditional" runat="server">
<ContentTemplate>
<asp:Label ID="Label1" runat="server" Text=""></asp:Label>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="DropDownList1"
EventName="SelectedIndexChanged" />
</Triggers>
</asp:UpdatePanel>
Why not add the DropDown inside your UpdatePanel.
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:DropDownList ID="DropDownList1" runat="server" Width="200px"
AutoPostBack="true" OnSelectedIndexChanged="DropDownList1_OnSelectedIndexChanged">
<asp:ListItem Text="abc" Value="0"></asp:ListItem>
<asp:ListItem Text="a" Value="1"></asp:ListItem>
<asp:ListItem Text="b" Value="2"></asp:ListItem>
<asp:ListItem Text="c" Value="3"></asp:ListItem>
</asp:DropDownList>
<asp:Label ID="Label1" runat="server" Text=""></asp:Label>
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="DropDownList1"/>
</Triggers>
</asp:UpdatePanel>
You must place that panel inside an update panel..
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<panel id="panel1">
</panel>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="DropDownList1" />
</Triggers>
</asp:UpdatePanel>
I am putting the following controls inside an update panel so that the whole page does not refresh. When clicking the button, the page does not refresh but when I try to change the radio button, the page refreshes and causes a full postback. Here is my code:
<ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager" runat="Server" EnablePartialRendering="true" />
<asp:UpdatePanel ID="updatePanelToggle" runat="server">
<ContentTemplate>
<asp:RadioButton ID="radioOn" AutoPostBack="true" runat="server" GroupName="toggle" Text="On" OnCheckedChanged="radioOn_CheckedChanged" />
<asp:RadioButton ID="radioOff" AutoPostBack="true" runat="server" GroupName="toggle" Text="Off" OnCheckedChanged="radioOff_CheckedChanged" />
<asp:Button ID="testButton" runat="server" OnClick="mybutton_click"/>
</ContentTemplate>
</asp:UpdatePanel>
Depending on your requirement you can control post backs by adding triggers. Use AsyncPostBackTrigger when you want to update only the update panel content. If you need full post back use PostBackTrigger.
<asp:UpdatePanel ID="updatePanelToggle" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:RadioButton ID="radioOn" AutoPostBack="true" runat="server" GroupName="toggle" Text="On" OnCheckedChanged="radioOn_CheckedChanged" />
<asp:RadioButton ID="radioOff" AutoPostBack="true" runat="server" GroupName="toggle" Text="Off" OnCheckedChanged="radioOff_CheckedChanged" />
<asp:Button ID="testButton" runat="server" OnClick="mybutton_click"/>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="radioOn" />
<asp:AsyncPostBackTrigger ControlID="radioOff" />
<asp:PostBackTrigger ControlID="testButton" />
</Triggers>
</asp:UpdatePanel>