Insert My .NET Control In Template - c#

I am new to ASP.NET. As a follow up question from THIS POST I have the following .Net Control in Ektron that I would like to display in my webpage template.
Control:
<%# Control Language="C#" AutoEventWireup="true" CodeFile="Gallery.ascx.cs" Inherits="Source_Controls_Alumni_Gallery" %>
<asp:ListView ID="uxPhotoGallery" runat="server" ItemPlaceholderID="itemPlaceholder">
<LayoutTemplate>
<ul>
<asp:PlaceHolder ID="itemPlaceholder" runat="server" />
</ul>
</LayoutTemplate>
<ItemTemplate>
<li>
<%--
I'm mixing up two different ways of referencing the incoming data. One is by casting
the DataItem to the incoming type, which gives you intellisense access to the properties.
The other is more of a dictionary approach in which you have to type out the property name
as a string.
I really like the casting approach, but it's mega-wordy.
--%>
<a href="<%#((Ektron.Custom.ViewModels.PressPhotoViewModel)Container.DataItem).ImageUrl %>">
<img src="<%#((Ektron.Custom.ViewModels.PressPhotoViewModel)Container.DataItem).ImageUrl %>" alt="<%#Eval("Description") %>" />
<div><%#Eval("Description") %></div>
</a>
</li>
</ItemTemplate>
</asp:ListView>
and code behind:
using Ektron.Custom.SmartForms;
using System;
using System.Linq;
public partial class Source_Controls_Alumni_Gallery : System.Web.UI.UserControl
{
protected void Page_Load(object sender, EventArgs e)
{
var pressPhotoManager = new PressPhotoManager();
// Whichever folder Id...
var photos = pressPhotoManager.GetList(75);
if (photos != null && photos.Any())
{
uxPhotoGallery.DataSource = photos;
uxPhotoGallery.DataBind();
}
}
}
I would like to insert the control into this template:
<%# Page Title="" Language="C#" MasterPageFile="~/Source/Masterpages/MainMaster.master" AutoEventWireup="true" CodeFile="AlumniJobOpenings.aspx.cs" Inherits="Source_Templates_AlumniJobOpenings" %>
<%# Register Src="~/Source/Controls/SubHeader.ascx" TagPrefix="uc1" TagName="SubHeader" %>
<%# Register Src="~/Source/Controls/Shared/PrimarySection.ascx" TagPrefix="uc1" TagName="PrimarySection" %>
<%# Register Src="~/Source/Controls/JoinUs/StaffAndParalegals/SPOpenings.ascx" TagPrefix="uc1" TagName="SPOpenings" %>
<%# Register Src="~/Source/Controls/JoinUs/StaffAndParalegals/SPFilters.ascx" TagPrefix="uc1" TagName="SPFilters" %>
<%# Register Src="~/Source/Controls/Shared/RelatedContentModules.ascx" TagPrefix="uc1" TagName="RelatedContentModules" %>
<%# Register Src="~/Source/Controls/JoinUs/StaffAndParalegals/SPContactDetails.ascx" TagPrefix="uc1" TagName="SPContactDetails" %>
<%# Register Src="~/Source/Controls/Shared/TextImageAssetBlockModules.ascx" TagPrefix="uc1" TagName="TextImageAssetBlockModules" %>
<%# Register Src="~/Source/Controls/Shared/TextLinkBlockControl.ascx" TagPrefix="uc1" TagName="TextLinkBlockControl" %>
<%# Register TagPrefix="sp" TagName="Spinner" Src="~/Source/Controls/Alumni/Gallery.ascx" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<uc1:SubHeader runat="server" ID="SubHeader" />
<div class="container non-responsive">
<div class="row">
<div class="col-sm-8 alpha">
<uc1:PrimarySection runat="server" ID="PrimarySection" />
<div class="primary">
<div class="container non-responsive">
<div class="row">
<div class="col-sm-8 alpha">
<div class="primary">
IMAGE GALLERY LIST SHOULD BE INSERTED HERE.
</div>
</div>
<div class="col-sm-4 beta">
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-4 beta">
<uc1:SPContactDetails runat="server" ID="SPContactDetails" />
<uc1:SPFilters runat="server" ID="SPFilters" Heading="Staff and Paralegal Openings" Text="Select an office below to learn more about current opportunities" />
<uc1:RelatedContentModules runat="server" ID="RelatedContentModules" />
<uc1:TextLinkBlockControl runat="server" ID="TextLinkBlockControl" />
<uc1:TextImageAssetBlockModules runat="server" ID="TextImageAssetBlockModules" />
</div>
</div>
</div>
</asp:Content>

Here's your line from the top:
<%# Register TagPrefix="sp" TagName="Spinner" Src="~/Source/Controls/Alumni/Gallery.ascx" %>
And a similar line used to register another control in the same page:
<%# Register Src="~/Source/Controls/SubHeader.ascx" TagPrefix="uc1" TagName="SubHeader" %>
Now, take a look at the control placement for the pre-existing item referenced above.
<uc1:SubHeader runat="server" ID="SubHeader" />
What you'll find is that the placement tag is made up of configured properties in the <%# Register ... %> line. Specifically, the TagPrefix and TagName values. You'll use those values to set up your own control placement, following this format:
<TagPrefix:TagName runat="server" ID="SomeUniqueID" [optional parameters] />
So, in the case of your control, you've set TagPrefix="sp" and TagName="Spinner". So your control placement will look like this:
<sp:Spinner runat="server" ID="uxAlumniSpinner" />
(ID is an example)
From your control code, you don't have any parameters configured, so the above would work fine. But you could provide at least one parameter, and probably should in order to make the control more reusable.
For example, you've got a hard-coded value of 75 in your method call. I assume that's pointing to an Ektron Folder, Taxonomy, or Collection. Regardless, it's some container ID. You might want to use this control in multiple places with different sources for the data - different container IDs. The way you've set this up, you'll have to make a new control every time just to update that value.
So if we add a public property to your control, so that the code-behind looks like this:
using Ektron.Custom.SmartForms;
using System;
using System.Linq;
public partial class Source_Controls_Alumni_Gallery : System.Web.UI.UserControl
{
// Added Property
private long _containerId = 0;
public long ContainerID {
get { return _containerId; }
set { _containerId = value; }
}
/////////
protected void Page_Load(object sender, EventArgs e)
{
// Added inverted conditional to escape method
// if the _containerId is invalid.
if(_containerId <= 0) return;
///////////
var pressPhotoManager = new PressPhotoManager();
// Whichever folder Id...
var photos = pressPhotoManager.GetList(_containerId);
if (photos != null && photos.Any())
{
uxPhotoGallery.DataSource = photos;
uxPhotoGallery.DataBind();
}
}
}
Then you could specify the container ID whenever and wherever you place the control. Like so:
<sp:Spinner runat="server" ID="uxAlumniSpinner" ContainerID="75" />
Making your final in-template markup:
<%# Register Src="~/Source/Controls/JoinUs/StaffAndParalegals/SPContactDetails.ascx" TagPrefix="uc1" TagName="SPContactDetails" %>
<%# Register Src="~/Source/Controls/Shared/TextImageAssetBlockModules.ascx" TagPrefix="uc1" TagName="TextImageAssetBlockModules" %>
<%# Register Src="~/Source/Controls/Shared/TextLinkBlockControl.ascx" TagPrefix="uc1" TagName="TextLinkBlockControl" %>
<%# Register TagPrefix="sp" TagName="Spinner" Src="~/Source/Controls/Alumni/Gallery.ascx" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<uc1:SubHeader runat="server" ID="SubHeader" />
<div class="container non-responsive">
<div class="row">
<div class="col-sm-8 alpha">
<uc1:PrimarySection runat="server" ID="PrimarySection" />
<div class="primary">
<div class="container non-responsive">
<div class="row">
<div class="col-sm-8 alpha">
<div class="primary">
<sp:Spinner runat="server" ID="uxAlumniSpinner" ContainerID="75" />
</div>
</div>
<div class="col-sm-4 beta">
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-4 beta">
<uc1:SPContactDetails runat="server" ID="SPContactDetails" />
<uc1:SPFilters runat="server" ID="SPFilters" Heading="Staff and Paralegal Openings" Text="Select an office below to learn more about current opportunities" />
<uc1:RelatedContentModules runat="server" ID="RelatedContentModules" />
<uc1:TextLinkBlockControl runat="server" ID="TextLinkBlockControl" />
<uc1:TextImageAssetBlockModules runat="server" ID="TextImageAssetBlockModules" />
</div>
</div>
</div>
</asp:Content>

Related

Repeater does not show data

As posted earlier , Here is my HTML :
<%# Page Title="" Language="C#" MasterPageFile="~/VendorMaster.master" AutoEventWireup="true" CodeFile="PastOrders.aspx.cs" Inherits="PastOrders" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<br />
<asp:Repeater ID="rptr" runat="server">
<HeaderTemplate>
<div class="col-lg-4 col-md-4 col-sm-4 mb">
<a href="VendorProfile.aspx">
<div class="twitter-panel pn">
<i class="fa fa-twitter fa-4x"></i>
</HeaderTemplate>
<ItemTemplate>
<%# DataBinder.Eval(Container.DataItem, "Name") %>
</ItemTemplate>
<FooterTemplate>
</div>
</a>
</FooterTemplate>
</asp:Repeater>
</asp:Content>
C# :
public partial class PastOrders : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (Session["vendor"] != null)
{
if (!IsPostBack)
{
ArrayList values = new ArrayList();
values.Add(new Testing
{
Name = "Caterer"
});
values.Add(new Testing
{
Name = "Florist"
});
values.Add(new Testing
{
Name = "Cab Services"
});
rptr.DataSource = values;
rptr.DataBind();
}
}
else
{
Response.Redirect("VendorLogin.aspx");
}
}
public class Testing
{
public string Name { get; set; }
}
}
Now i want to generate 3 separate divs, with the Names on them as : "Caterer","Florist","Cab Services",etc.
Instead it is only generating one div with all the 3 names inside it .
I tried formatting it with the Header Template and the Footer Template where i put the parent divs and the anchor tag in the Header Template and the closing of the same in the Footer Template . Bt it doesn't produce the expected result still.
Now you do bind data, but you do not access your data within your repater. Change it to
<form id="form1" runat="server">
<asp:Repeater ID="rptr" runat="server" >
<ItemTemplate>
<div class="divStyle" id="divStyle">
<%# DataBinder.Eval(Container.DataItem, "Name") %>
</div>
</ItemTemplate>
</asp:Repeater>
</form>
and it should work!

Is there a simple way to call a method used to change display from a parent control?

I am trying to create a page using Ajax Tabs and user controls. The .aspx page contains a reference to a default control
<%# Register src="~/Controls/DefaultControl.ascx" tagname="DefaultControl" tagprefix="uc1" %>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<uc1:DefaultControl ID="DefaultControl1" runat="server" />
<%--<uc2:CorrespondenceControl ID="CorrespondenceControl" runat="server" />--%>
</asp:Content>
And the DefaultControl.ascx is using Ajax Tabs, one of which contains a child control within an Update Panel
asp:TabPanel ID="tbpnl2" runat="server" HeaderText="Tab With GridView with select buttons" Visible="True">
<ContentTemplate>
<asp:UpdatePanel ID="updpnl2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<uc2:Control1 ID="Control1" runat="server" />
</ContentTemplate>
</asp:UpdatePanel>
</ContentTemplate>
</asp:TabPanel>
The DefaultControl holds a method in the code behind page which is successfully called directly from other tabs (with the markup contained directly in DefaultControl.ascx) on the DefaultControl.ascx page to change the display when Select is clicked on a gridview -
public void ShowPage()
{
gv1.DataBind();
fv1.DataBind();
tbpnl1.Visible = true; //show details tab
tbpnl2.Visible = true;
tab1.ActiveTabIndex = 1; //set details tab as current tab
txt.Text = String.Empty;
updPnl1.Update();
}
I am trying to call this method from the child Control1 when Select on a gridview is selected there, but obviously none of the elements referenced are in Control1.
I have been searching for a way to be able to use the existing method and have seen a number of suggestions including Interfaces, references like ((DefaultControl)this.DefaultControl).ShowPage(); on the code behind Control1
But as I am just starting to program I have no idea how to implement any of these solutions or what the syntax should be to get them to work.
Is there a simple, even if dirty, way to use the method from a parent control in a child control contained in an Ajax tab?
Not sure if this is what you are looking for... Below example shows calling of direct UserControl and nested UserControl method's from Web page
Default.aspx
<%# Register TagPrefix="uc" TagName="WebUserControl" Src="WebUserControl.ascx" %>
<%# Register TagPrefix="uc2" TagName="WebUserControl2" Src="WebUserControl2.ascx" %>
<form runat="server" id="form1">
<uc:WebUserControl ID="control1" runat="server" />
<hr />
<h4>
At Default.aspx</h4>
<asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Call the function" />
</form>
Default.aspx.cs
protected void Button1_Click(object sender, EventArgs e)
{
control1.CallMe();
var control2 = (WebUserControl2)control1.FindControl("control2");
control2.CallMe2();
}
WebUserControl.ascx
<%# Register TagPrefix="uc2" TagName="WebUserControl2" Src="WebUserControl2.ascx" %>
<div runat="server">
<h3>
WebUserControl</h3>
<asp:Label ID="lbl1" Text="I am ready at WebUserControl" runat="server"></asp:Label>
<div runat="server" id="toAdd" style="color: Red;">
</div>
</div>
<hr />
<uc2:WebUserControl2 ID="control2" runat="server" />
WebUserControl.ascx.cs
public void CallMe()
{
Label lbl = new Label();
lbl.Text = "I am at WebUserControl";
toAdd.Controls.Add(lbl);
}
WebUserControl2.ascx
<div runat="server">
<h3>
WebUserControl2</h3>
<asp:Label ID="lbl1" Text="I am ready at WebUserControl2" runat="server"></asp:Label>
<div runat="server" id="toAdd" style="color: Red;">
</div>
</div>
WebUserControl2.ascx.cs
public void CallMe2()
{
Label lbl = new Label();
lbl.Text = "I am at WebUserControl2";
toAdd.Controls.Add(lbl);
}
Hope it helps someone...!!

ASP how to find controls of type on a child page of a master page

I have a master page master.page.
And I have a child page default.aspx that inheirts master.
How do I preform the following and actually find controls. In the below code I never find my panels.
codebehind - content-page
foreach (Panel pnl in this.Page.Controls.OfType<Panel>())
{
if (pnl.ID.ToUpper() == texthi.ToUpper().Replace(" ", ""))
{
pnl.Visible = true;
}
else
{
pnl.Visible = false;
}
}
aspx - content-page
<%# Page Title="" Language="C#" MasterPageFile="~/secure/Wizard.master" AutoEventWireup="true"
CodeFile="AddWarranty.aspx.cs" Inherits="secure_Warranties_AddWarranty" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder_NavigationPanel"
runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<asp:ScriptManager runat="server" ID="sm1">
</asp:ScriptManager>
<div id="header">
<p id="layoutdims">
</p>
</div>
<div class="colmask leftmenu">
<div class="colleft">
<div class="col1">
<asp:Panel runat="server" ID="VehicleInformation" Visible="true">
<legend>VEHICLE INFORMATION</legend>
</asp:Panel>
<asp:Panel runat="server" ID="CustomerInformation" Visible="false">
<legend>CUSTOMER INFORMATION</legend>
</asp:Panel>
</div>
The reason is that Enumerable.TypeOf does not look recursivelsy into child controls but only the top-container. Since you're using it on the page's ControlCollection you'll find only panels which are sitting on the top of the page. But your panels are inside of other divs.
Make the parent div(with class="col1") runat=server(or use Panel) and access it in codebehind:
foreach (Panel pnl in div.Controls.OfType<Panel>())
{
// ...
}

Changing the text of a hyperlink in asp.net on click?

I am trying to change the text of my hyperlink after the user has clicked it. Here is the hyperlink:
<asp:hyperlink id="OpenClose" runat="server" onclick="OpenClose_Click" AutoPostBack="true">Close</asp:hyperlink>
And here is my code behind:
protected void Page_Load(object sender, EventArgs e)
{
OpenClose.Attributes.Add("onclick", "OpenClose_Click");
}
protected void OpenClose_Click(object sender, EventArgs e)
{
if (OpenClose.Text == "Close")
OpenClose.Text = "Open";
else
OpenClose.Text = "Close";
}
The problem is that it does not seem to see the function OpenClose_Click. I am not sure why. Is there another method to do this or am I missing something?
EDIT
Here is the entire aspx code
<%# Page Title="" Language="C#" MasterPageFile="../MasterPageLite.master" AutoEventWireup="true" CodeFile="testPageLoad2.aspx.cs" Inherits="BuilderPages_testPageLoad2" %>
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">
<div class="left_side">
<form id="form1" runat="server">
This is the second test page I am making. Practice collapse and expand panels!
<div class="msg_list">
<h3 class="msg_head">Header-1</h3>
<div class="msg_body">
Collapse this panel!!
<asp:button runat="server" text="Can you see me?" />
</div>
<h3 class="msg_head">Header-2</h3>
<div class="msg_body">
Congratulations you opened the panel!!
</div>
<h3 class="msg_head">Header-3</h3>
<div class="msg_body">
The third panel has been opened!!
</div>
</div>
</form>
</div>
<div class="right_side">
<div class="lBorder">
<asp:Panel ID="OpenClosePanel" runat="server"></asp:Panel>
<asp:HyperLink id="OpenClose" runat="server" AutoPostBack="true" style="cursor:pointer; text-decoration:underline;">Show/Hide</asp:HyperLink>
</div>
<div class="rscontent">
<p>
Lorem ipsum...
</p>
<p>
Nulla...
</p>
<p>
Vivamus...
</p>
<p>
Phasellus...
</p>
<p>
Aenean...
</p>
</div>
</div>
</asp:Content>
You should use a LinkButton instead of a HyperLink control, like this:
Markup:
<asp:LinkButton id="OpenClose"
runat="server"
OnClick="OpenClose_Click"
AutoPostBack="true"
Text="Close"></asp:LinkButton>
Code-Behind:
protected void OpenClose_Click(object sender, EventArgs e)
{
if (OpenClose.Text == "Close")
{
OpenClose.Text = "Open";
}
else
{
OpenClose.Text = "Close";
}
}
The LinkButton class derives from the Button class thus it has similar events to a button, which is the effect you want, but it renders like a hyperlink.
<asp:hyperlink ... is not a valid type of control since .NET is case sensitive. Try changing it to:
<asp:HyperLink ...
I would also get rid of the code in your page load event.

Only Content Controls are Allowed (C# webcontrols)

So, I'm not sure what's going on. My boss wasn't pleased with me using MVC and Razor, so I'm being forced to code with this nasty webcontrol/codebehind style. =/
The error is:
Only Content controls are allowed directly in a content page that contains Content controls.
Here is the masterpage:
<%# Master Language="C#"%>
<!DOCTYPE html>
<html>
<head>
<title>Application Form</title>
</head>
<body>
<div id="container">
<asp:contentplaceholder id="contentPlaceHolder" runat="server" />
</div>
</body>
</html>
And here is the Default.aspx page that's throwing the error.
<%# Page Language="C#" Inherits="dumb.Default" MasterPageFile="MasterPage.master" %>
<h2>Application Form</h2>
<asp:Content id="content" ContentPlaceHolderID="contentPlaceHolder" runat="server">
<p>Please complete this application.</p>
<form action="Default.aspx" method="post" runat="server">
<div>
<span class="spaced">Name:</span><asp:TextBox id="name" runat="server" />
</div>
</form>
<p>
<asp:Label id="finalmessage" runat="server" />
</p>
</asp:Content>
And the silly Default.aspx.cs codebehind...
using System;
using System.Web;
using System.Web.UI;
namespace dumb
{
public partial class Default : System.Web.UI.Page
{
protected void Page_Load (object sender, EventArgs e)
{
if (IsPostBack) {
finalmessage.Text = "Submission Processed Successfully!";
}
}
}
}
All of your content, including static HTML must be inside Content tags in the content page. You have a <h2> outside:
<h2>Application Form</h2>
<asp:Content id="content" ContentPlaceHolderID="contentPlaceHolder" runat="server">
Should be:
<asp:Content id="content" ContentPlaceHolderID="contentPlaceHolder" runat="server">
<h2>Application Form</h2>

Categories

Resources