I need to change ASPxGridView SettingsLoadingPanel dynamically (from code behind if is possible).
For example, when I clicked on checkbox I want text to be 'selecting...' and after click the button to see text 'loading...'
Thanks!
You can use ASPxClientLoadingPanel method. And also .Shov() method invokes the loading panel.
<dxlp:ASPxLoadingPanel ID="ASPxLoadingPanel1" runat="server" ClientInstanceName="lp">
</dxlp:ASPxLoadingPanel>
<dxe:ASPxButton ID="btnShow" runat="server" AutoPostBack="False"
Text="Show" ClientInstanceName="button" >
<ClientSideEvents Click="function(s, e) {
lp.Show();
}" />
</dxe:ASPxButton>
<dxe:ASPxButton ID="btnHide" runat="server" AutoPostBack="False"
Text="Hide" ClientInstanceName="button" >
<ClientSideEvents Click="function(s, e) {
lp.Hide();
}" />
</dxe:ASPxButton>
Also you can find a demo in this link.
ASPX
<%# Page Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="Example.aspx.cs"
Inherits="ASPxLoadingPanel_Example" %>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentHolder" runat="Server">
<dx:ASPxCallback ID="ASPxCallback1" runat="server" ClientInstanceName="Callback">
<ClientSideEvents CallbackComplete="function(s, e) { LoadingPanel.Hide(); }" />
</dx:ASPxCallback>
<div class="BottomPadding">
<dx:ASPxCheckBox ID="ASPxCheckBox1" runat="server" AutoPostBack="true" Checked="True"
Text="Display the ASPxLoadingPanel over a specific control">
</dx:ASPxCheckBox>
</div>
<table id="Panel" style="border: Dashed 1px Gray; height: 125px; width: 60%; margin: 30px 20%">
<tr>
<td align="center" valign="middle">
<dx:ASPxButton ID="ASPxButton1" runat="server" Text="Show Loading Panel" AutoPostBack="False">
<ClientSideEvents Click="function(s, e) {
Callback.PerformCallback();
LoadingPanel.Show();
}" />
</dx:ASPxButton>
</td>
</tr>
</table>
<dx:ASPxLoadingPanel ID="LoadingPanel" runat="server" ClientInstanceName="LoadingPanel"
Modal="True">
</dx:ASPxLoadingPanel>
</asp:Content>
C#
using System;
using System.Threading;
using System.Web.UI;
public partial class ASPxLoadingPanel_Example : Page {
protected void Page_Load(object sender, EventArgs e) {
if(IsCallback) {
// Intentionally pauses server-side processing,
// to demonstrate the Loading Panel functionality.
Thread.Sleep(500);
}
LoadingPanel.ContainerElementID = ASPxCheckBox1.Checked ? "Panel" : "";
}
}
Related
I have a ASPxGridView consist of a image column. When I click the ExportToPDF,images are shown in pdf. But if I click the ExportToXls, images are not shown in the excel. What is the problem ?
I use Devexpress 14.2 in visual studio.
P.S. = Images in gridview are different sizes.
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<table>
<tr>
<td style="padding-right: 4px">
<dx:ASPxButton ID="btnPdfExport" runat="server" Text="Export to PDF" OnClick="btnPdfExport_Click" />
</td>
<td style="padding-right: 4px">
<dx:ASPxButton ID="btnXlsExport" runat="server" Text="Export to XLS" OnClick="btnXlsExport_Click" />
</td>
<td style="padding-right: 4px">
<dx:ASPxButton ID="btnXlsxExport" runat="server" Text="Export to XLSX" OnClick="btnXlsxExport_Click" />
</td>
<td style="padding-right: 4px">
<dx:ASPxButton ID="btnRtfExport" runat="server" Text="Export to RTF" OnClick="btnRtfExport_Click" />
</td>
<td>
<dx:ASPxButton ID="btnCsvExport" runat="server" Text="Export to CSV" OnClick="btnCsvExport_Click" />
</td>
</tr>
</table>
<dx:ASPxGridView ID="Grid" runat="server" AutoGenerateColumns="False" DataSourceID="XmlDataSource1">
<Columns>
<dx:GridViewDataTextColumn FieldName="Common_Name" Caption="Common name" />
<dx:GridViewDataTextColumn FieldName="Species_Name" Caption="Species name" />
<dx:GridViewDataImageColumn FieldName="ImagePath" Caption="Image">
<PropertiesImage>
<ExportImageSettings Width="180" Height="120" />
</PropertiesImage>
</dx:GridViewDataImageColumn>
</Columns>
<SettingsPager PageSize="30" />
</dx:ASPxGridView>
<dx:ASPxGridViewExporter ID="GridExporter" runat="server" GridViewID="Grid" OnRenderBrick="GridExporter_RenderBrick" />
<asp:XmlDataSource ID="XmlDataSource1" runat="server" DataFile="~/Intranet/denemebru/Fishes.xml" />
</form>
</body>
</html>
public partial class Intranet_denemebru_RaporDeneme2 : System.Web.UI.Page
{
protected void GridExporter_RenderBrick(object sender, ASPxGridViewExportRenderingEventArgs e)
{
var dataColumn = e.Column as GridViewDataColumn;
if (dataColumn != null && dataColumn.FieldName == "ImagePath" && e.RowType == GridViewRowType.Data)
e.ImageValue = GetImageBinaryData(e.Value.ToString());
}
protected void btnPdfExport_Click(object sender, EventArgs e)
{
GridExporter.WritePdfToResponse();
}
protected void btnXlsExport_Click(object sender, EventArgs e)
{
GridExporter.WriteXlsToResponse();
}
protected void btnXlsxExport_Click(object sender, EventArgs e)
{
GridExporter.WriteXlsxToResponse();
}
byte[] GetImageBinaryData(string relativePath)
{
string path = Server.MapPath(relativePath);
return File.Exists(path) ? File.ReadAllBytes(path) : null;
}
}
I have a tabcontainer with two tabs. The first tab contains a textbox, while the second tab contains a panel.
I want the second tab to be disabled at first page load, and I want it to become enabled as soon as the user enters an input in the textbox in tab1. When textbox in tab1 is emptied again, the second tab should again be disabled.
I tried the following code, but the second tab remains disabled no matter what.
Any help would be appreciated. Thank you!
aspx
<asp:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="4" HeaderText=""
Height="578px" Width="900px" TabStripPlacement="Top" ScrollBars="None" UseVerticalStripPlacement="false"
VerticalStripWidth="120px" BackColor="White" BorderColor="White" Style="margin-right: 84px">
<asp:TabPanel ID="TabPanel1" runat="server">
<HeaderTemplate>
General
</HeaderTemplate>
<ContentTemplate>
<asp:UpdatePanel ID="TestUpdatePanel" runat="server">
<ContentTemplate>
<table style="height: 247px; width: 100%;">
<tr>
<td>
<asp:TextBox ID="HorizonTextBox" runat="server" OnTextChanged="HorizonTextBox_TextChanged"
AutoPostBack="True"></asp:TextBox>
</td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
<ContentTemplate>
</asp:TabPanel>
<asp:TabPanel ID="TabPanel2" runat="server">
<HeaderTemplate>
Dashboard
</HeaderTemplate>
<ContentTemplate>
<asp:Button ID="RunSimulationButton" runat="server" Text="Run Simulation" OnClick="RunSimulationButton_OnClick" />
<br />
<br />
<asp:Panel ID="PlotPanel" runat="server">
</asp:Panel>
</ContentTemplate>
</asp:TabPanel>
aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
TabContainer1.ActiveTabIndex = 0;
TabPanel2.Enabled = false;
}
}
protected void HorizonTextBox_TextChanged(object sender, EventArgs e)
{
if(HorizonTextBox.Text != "")
{
TabPanel2.Enabled = true;
}
}
you may need to enclose whole tab container into updatepanel to allow update panel enable/disable child controls
We have added a new gallery page to our website, which displays a series of thumbnails using
We would like to display popup window to display the image in a larger format and have used the following code so far -
ScriptManager.RegisterStartupScript(Me, GetType(String), "New_Window", "window.open('" & webUrl & "Cacique4.jpg', null, 'height=400,width=400,status=yes,toolbar=yes,menubar=yes,location=no' );", True)
The window displays like a normal browser only sized to 400x400.
Is there any way to display the image in a pop up window?
Here's an example:
ASPX:
<head runat="server">
<title>Modal Popup</title>
<style type="text/css">
.modalStyle
{
background-color: Gray;
filter: alpha(opacity=70);
opacity: 0.7;
}
.panelStyle
{
width: 300px;
height: 180px;
border: 2px solid Gray;
background-color:White;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:ToolkitScriptManager ID="scripManager" runat="server" />
<asp:ModalPopupExtender ID="modal" CancelControlID="btnCancel" BackgroundCssClass="modalStyle" PopupControlID="popup" TargetControlID="lblPopup" runat="server" />
<asp:Label ID="lblPopup" runat="server" />
<asp:Panel runat="server" ID="popup" CssClass="panelStyle">
<table style="width: 100%;">
<tr>
<td>
<asp:RadioButton ID="rdboption1" AutoPostBack="true" OnCheckedChanged="CheckedChanged" runat="server" Text="Option 1" GroupName="Options" /><br />
<asp:RadioButton ID="rdboption11" runat="server" Text="Option 1.1" GroupName="SubOption1"
Visible="false" /><br />
<asp:RadioButton ID="rdboption12" runat="server" Text="Option 1.2" GroupName="SubOption1"
Visible="false" />
</td>
</tr>
<tr>
<td>
<asp:RadioButton ID="rdboption2" AutoPostBack="true" OnCheckedChanged="CheckedChanged" runat="server" Text="Option 2" GroupName="Options" /><br />
<asp:RadioButton ID="rdboption21" runat="server" Text="Option 2.1" GroupName="SubOption2"
Visible="false" /><br />
<asp:RadioButton ID="rdboption22" runat="server" Text="Option 2.2" GroupName="SubOption2"
Visible="false" />
</td>
</tr>
<tr>
<td style="text-align: center;">
<asp:Button ID="btnCancel" runat="server" Text="Cancel" />
</td>
</tr>
</table>
</asp:Panel>
</form>
</body>
Code behind:
public partial class Test : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
modal.Show();
}
protected void CheckedChanged(object sender, EventArgs e)
{
var radioButton = sender as RadioButton;
ResetOptions();
switch(radioButton.ID)
{
case "rdboption1":
rdboption11.Visible = true;
rdboption12.Visible = true;
break;
case "rdboption2":
rdboption21.Visible = true;
rdboption22.Visible = true;
break;
}
}
private void ResetOptions()
{
rdboption11.Visible = false;
rdboption12.Visible = false;
rdboption21.Visible = false;
rdboption22.Visible = false;
}
}
I encountered a problem where i add two ajax modal popup in a single page. This two modal popup each do different things. one is is create and one is for update. When two modal popup, my update button cannot be click ans execute the update codes. And when i remove my create modal popup, my updates work? Can anyone tell me how do i make two popup exist in the same page?
<!--Modal Popup: Create Topic-->
<cc1:modalpopupextender ID="ModalPopupExtender1" runat="server"
TargetControlID="btnShowPopup" PopupControlID="pnlCreatePopup"
CancelControlID="btnCancel" BackgroundCssClass="modalBackground">
</cc1:modalpopupextender>
<asp:Panel ID="pnlCreatePopup" runat="server" CssClass="createModalPopup">
<!--Modal Popup: Update Topic-->
<asp:Button ID="bnUpdateShow" runat="server" style="display:none;" />
<cc1:ModalPopupExtender ID="ModalPopupExtender2" runat="server" TargetControlID="bnUpdateShow" PopupControlID="pnlpopup" CancelControlID="btnUpdateCancel" BackgroundCssClass="modalBackground">
</cc1:ModalPopupExtender>
<asp:Panel ID="pnlpopup" runat="server" CssClass="topicModalPopup">
I solved this hiding the ajax pop up inside a panel configured as visible=false. I fire the popUp in codeBehind. here is some code:
<asp:LinkButton runat="server" ID="lbCredits1" Font-Underline="true"
CausesValidation="false" OnClick="btMpeCredits_Click">Credits</asp:LinkButton>
|
<asp:LinkButton runat="server" ID="lbPrivacy2" Font-Underline="true"
CausesValidation="false" OnClick="btMpePrivacy_Click">Privacy</asp:LinkButton>
<%--AjaxPopUpExtenderArea--%>
<asp:Panel ID="pnlAjaxArea" runat="server" Visible="false">
<%--PrivacyMPE--%>
<%--I have to hide the link button referenced in the AjaxPopUpExtender. I will use a different button to show the pop up--%>
<div style="display:none;">
<asp:LinkButton runat="server" ID="lbPrivacy" Text="PRIVACY"/>
</div>
<asp:ModalPopupExtender ID="MpePrivacy" runat="server" TargetControlID="lbPrivacy"
PopupControlID="PnlPrivacy" BackgroundCssClass="modalBackground" >
</asp:ModalPopupExtender>
<asp:Panel runat="server" ID="PnlPrivacy" Height="500px" Width="600px" BorderStyle="Solid"
BorderColor="#1E549E" BorderWidth="3px" BackColor="#FFFFFF" ScrollBars="Auto">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<UcPrivacy:Privacy runat="server" ID="Privacy" />
</td>
</tr>
<tr>
<td align="center">
<asp:ImageButton ImageUrl="~/App_Themes/GfRegistrationPage/images/chiudi-btn.gif" runat="server" OnClick="btMpeClose"
CausesValidation="False" />
<br />
<br />
</td>
</tr>
</table>
</asp:Panel>
<%--CreditsMPE--%>
<div style="display:none;">
<asp:LinkButton runat="server" ID="lbCredits" Text="credits"/>
</div>
<asp:ModalPopupExtender ID="MpeCredits" runat="server" TargetControlID="lbCredits"
PopupControlID="PnlCredits" BackgroundCssClass="modalBackground" >
</asp:ModalPopupExtender>
<asp:Panel runat="server" ID="PnlCredits" Height="500px" Width="600px" BorderStyle="Solid"
BorderColor="#1E549E" BorderWidth="3px" BackColor="#FFFFFF" ScrollBars="Auto">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<UcCredits:Credits runat="server" ID="Credits" />
</td>
</tr>
<tr>
<td align="center">
<asp:ImageButton ImageUrl="~/App_Themes/GfRegistrationPage/images/chiudi-btn.gif" runat="server" OnClick="btMpeClose"
CausesValidation="False" />
<br />
<br />
</td>
</tr>
</table>
</asp:Panel>
</asp:Panel>
and here some code behind:
#region ModalPopUpS Privacy credits
protected void btMpePrivacy_Click(object sender, EventArgs e)
{
pnlAjaxArea.Visible = true;
AjaxControlToolkit.ModalPopupExtender modalPop = ((AjaxControlToolkit.ModalPopupExtender)(this.Master.FindControl("ContentPlaceHolder1").FindControl("MpePrivacy")));
modalPop.Show();
}
protected void btMpeCredits_Click(object sender, EventArgs e)
{
pnlAjaxArea.Visible = true;
AjaxControlToolkit.ModalPopupExtender modalPop = ((AjaxControlToolkit.ModalPopupExtender)(this.Master.FindControl("ContentPlaceHolder1").FindControl("MpeCredits")));
modalPop.Show();
}
protected void btMpeClose(object sender, EventArgs e)
{
pnlAjaxArea.Visible = false;
}
#endregion
I got stucked to some weird condition where I have a gridview inside a ajax toolkit tabcontainer. On tab index change i am binding grid. But nothing happend. Grid is not appearing. I have check the following
Viewstate
Visibility of grid
Visibility of the parent table.
Data is coming from the method
visibility of the tab panel
Even i have debugged and added watch to check if its getting null before loading the page.
Please help me out
** BELOW IS THE UPDATED CODE**
<HTMLCode>
<Toolkit:TabPanel HeaderText="Pending Challans" ID="tpPendingChallan" runat="server" Height="200px" >
<ContentTemplate>
<table style="width: 100%">
<tr>
<td>
<asp:GridView ID="gvPendingChallans" runat="server" AutoGenerateColumns="True" CellPadding="4" Width="100%" OnPageIndexChanging="gvPendingChallans_PageIndexChanging"
OnRowCommand="gvPendingChallans_RowCommand" AllowPaging="True" GridLines="None">
</asp:GridView>
</td>
</tr>
</table>
</ContentTemplate>
</Toolkit:TabPanel>
</HTMLCode>
========================================================================
<C#>
private void BindPendingChallans()
{
var dat = JobCardManager.DisplayChallan();
gvPendingChallans.DataSource = dat;
gvPendingChallans.DataBind();
}
protected void tcMembers_ActiveTabChanged(object sender, EventArgs e)
{
if(tcMembers.ActiveTabIndex == 6)
{
BindPendingChallans();
}
}
</C#>
Sorry for miss interpretation of your code with my first answer. I thought that it just a simple population of grid view, but as review I found that you are using the Ajax Toolkit library and your grid is inside the tab selection. You can try this:
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="Toolkit" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head2" runat="server">
<title>Untitled Page</title>
<style type="text/css">
.style1
{
font-family: Arial;
color: #3399FF;
}
</style>
</head>
<body class="style1">
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager2" runat="server" EnablePageMethods="true" />
<div>
<asp:UpdatePanel ID="upMember" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<table cellpadding="1" cellspacing="4" border="0" width="100%">
<tr>
<td>
<Toolkit:TabContainer ID="tcMembers" runat="server" AutoPostBack="true"
ActiveTabIndex="0" onactivetabchanged="tcMembers_ActiveTabChanged">
<Toolkit:TabPanel HeaderText="Pending Challans" ID="tpPendingChallan" runat="server"
Height="200px">
<ContentTemplate>
<asp:GridView ID="gvPendingChallans" runat="server" AutoGenerateColumns="True" CellPadding="4"
Width="100%" OnPageIndexChanging="gvPendingChallans_PageIndexChanging" OnRowCommand="gvPendingChallans_RowCommand"
AllowPaging="True" GridLines="None">
</asp:GridView>
</ContentTemplate>
</Toolkit:TabPanel>
<Toolkit:TabPanel HeaderText="Pending 2" ID="tpPending2" runat="server"
Height="200px">
<ContentTemplate>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="True" CellPadding="4"
Width="100%" OnPageIndexChanging="gvPendingChallans_PageIndexChanging" OnRowCommand="gvPendingChallans_RowCommand"
AllowPaging="True" GridLines="None">
</asp:GridView>
</ContentTemplate>
</Toolkit:TabPanel>
</Toolkit:TabContainer>
</td>
<td width="2%">
</td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
</html>
Then in your code behind:
protected void Page_Load(object sender, EventArgs e)
{
upMember.Update();
}
private void BindPendingChallans()
{
//var dat = JobCardManager.DisplayChallan();
//gvPendingChallans.DataSource = dat; gvPendingChallans.DataBind();
}
protected void tcMembers_ActiveTabChanged(object sender, EventArgs e)
{
if (tcMembers.ActiveTabIndex == 6)
{
BindPendingChallans();
}
}
protected void gvPendingChallans_PageIndexChanging(object sender, GridViewPageEventArgs e){
}
protected void gvPendingChallans_RowCommand(object sender, GridViewCommandEventArgs e){
}
Note: That in you 'tcMembers_ActiveTabChanged' you had specify tab index 6
The Tab index begins with 0. Maybe you can adjust it depending the number of
you Intended tab....
Regards,