I'm retrieving an article from my db but it appears in a too long one line ! ,so I want to display it in a multiline way in my webpage
I'm using a datalist element to receive and show the data retrieved from db
articlesDL.DataSource = DS.select_all_articles();
articlesDL.DataBind();
and that's what my datalist appear in tags :
<asp:DataList ID="articlesDL" runat="server">
<ItemTemplate>
<table class="auto-style1">
<tr>
<td class="auto-style2">
<asp:ImageButton ID="ImageButton1" runat="server" Height="50px" ImageUrl='<%# "~/images/"+Eval("imageurl")+".jpg" %>' Width="50px" />
</td>
<td class="auto-style2">
<asp:LinkButton ID="LinkButton1" runat="server" PostBackUrl='<%# "~/reviewart.aspx?id="+Eval("articleid") %>' Text='<%# Eval("articlebody") %>'></asp:LinkButton>
</td>
</tr>
</table>
</ItemTemplate>
Try to set width to the panel where you are showing the data.
<div ID="articlesDL">
</div>
<style>
#articlesDL
{
width:100%;
}
</style>
Related
I am facing problems while using the ListView Control in asp.net
I used two buttons links in a ListView ItemTemplate. For both buttons, I used Command Name and Command Argument. But first one is working fine and the second one is giving errors. I.e.
System.InvalidOperationException: Insert can only be called on an insert item. Ensure only the InsertTemplate has a button with CommandName=Insert.
If I want to add the InsertTemplate, where do we have to place it?
I am copying my code. Please help me.
Design View :
<asp:ListView ID="ListView1" runat="server" GroupPlaceholderID="groupPlaceHolder1" ItemPlaceholderID="itemPlaceHolder1" GroupItemCount="2" OnPagePropertiesChanging="ListView1_PagePropertiesChanging" DataKeyNames="InventoryID" OnItemCommand="ListView1_ItemCommand">
<LayoutTemplate>
<table width="100%">
<tr style="background-color:lightblue;color:blue;text-align:center;font-size:25px;font-weight:bold">
<td colspan="2">Available Books</td>
</tr>
<asp:PlaceHolder ID="groupPlaceHolder1" runat="server"></asp:PlaceHolder>
</table>
</LayoutTemplate>
<GroupTemplate>
<tr>
<asp:PlaceHolder ID="itemPlaceHolder1" runat="server"></asp:PlaceHolder>
</tr>
</GroupTemplate>
<ItemTemplate>
<td>
<table cellpadding="2" cellspacing="0" border="1" style="width:100%;height:100px; border:dashed 1px #04AFEF;background-color:#B0E2F5">
<tr>
<td>
<asp:Button ID="btnReview" runat="server" Text="Review" CommandName="Select" CommandArgument='<%# Eval("InventoryID") %>'/>
</td>
<td></td>
<td>
<asp:Button ID="btnAddToCart" runat="server" Text="Add To Cart" CommandName="Insert" CommandArgument='<%# Eval("InventoryID") %>' />
</td>
</tr>
</table>
</td>
</ItemTemplate>
</asp:ListView>
Well you can insert a InsertItemTemplate like here :
<InsertItemTemplate>
<tr style="background-color:#D3D3D3">
<td valign="top">
<asp:Label runat="server" ID="FirstNameLabel"
AssociatedControlID="FirstNameTextBox" Text="First Name"/>
<asp:TextBox ID="FirstNameTextBox" runat="server"
Text='<%#Bind("FirstName") %>' /><br />
<asp:Label runat="server" ID="LastNameLabel"
AssociatedControlID="LastNameTextBox" Text="Last Name" />
<asp:TextBox ID="LastNameTextBox" runat="server"
Text='<%#Bind("LastName") %>' /><br />
<asp:Label runat="server" ID="EmailLabel"
AssociatedControlID="EmailTextBox" Text="E-mail" />
<asp:TextBox ID="EmailTextBox" runat="server"
Text='<%#Bind("EmailAddress") %>' />
</td>
<td>
<asp:LinkButton ID="InsertButton" runat="server"
CommandName="Insert" Text="Insert" />
</td>
</tr>
</InsertItemTemplate>
Used From : https://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.listview.insertitemtemplate(v=vs.110).aspx
I want to display records in Horizontal Layout. I used Data List control for the same which displays only 5 records.
I want select functionality so that when i click the items in Data List , complete details will be displayed in another page.
Thanks a lot.
<div style="margin-left: 25%; margin-top: 5%">
<asp:DataList ID="dlTop5" runat="server" RepeatDirection="Horizontal" RepeatLayout="Flow" RepeatColumns="5"
ItemStyle-Width="40%" >
<ItemTemplate>
<table>
<tr>
<td rowspan="3" style="margin-left: 3%">
<asp:ImageButton ID="imgServant" runat="server" ImageUrl='<%#Eval("photo")%>' Height="150px"
Width="150px" />
</td>
<td style="width: 50%">
<asp:Label ID="lblName" runat="server" Text='<%#Eval("name")%>' Font-Bold="true"
ForeColor="BlueViolet"></asp:Label>
</td>
</tr>
<tr>
<td style="width: 50%">
<asp:Label ID="lblPhone" runat="server" Text='<%#Eval("phone")%>' ForeColor="BlueViolet"> </asp:Label>
</td>
</tr>
<tr>
<td style="width: 50%">
<asp:Label ID="lblSrno" runat="server" Text='<%#Eval("sysno")%>'> </asp:Label>
</td>
</tr>
</table>
</ItemTemplate>
<FooterTemplate>
<asp:Button ID="btnViewMore" runat="server" Text="View More" />
</FooterTemplate>
</asp:DataList>
</div>
</asp:Content>
This is what I do ...
<asp:DataList ID="DataList1" runat="server" BorderColor="Black" BorderWidth="1px"
DataSourceID="SqlDataSource2" GridLines="Both" RepeatDirection="Horizontal"
ShowFooter="False" ShowHeader="False">
<ItemTemplate>
<asp:LinkButton ID="LinkButton1" runat="server" Text='<%# Eval("RollCallPeriod") %>' OnClick="LinkButton1_Click"></asp:LinkButton><br />
</ItemTemplate>
</asp:DataList><asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:ATCNTV1ConnectionString %>"
SelectCommand="SELECT RollCallPeriod FROM tblBoardingRollCallPeriods">
</asp:SqlDataSource>
And use the OnClick event to fire up a call into your code behind to reveal a panel for example and put all your specific code about the selection inside the panel - ie: Gridview, etc.
You don't have to use a LinkButton of course. It can be anything you want - a button, a hyperlink, etc
Labels do not have OnClick etc. Unless you "trap" them using JavaScript like mouseclick or mouseover.
This is my first post, so please be gentle. With regard to the markup and code below (this is all inside a user control), this works fine to begin with. The problem occurs when I try to delete more than one item from the list that the formview renders.
I can delete an item and the page reloads and the item that I deleted is gone. If I then click delete on another item there is no apparent response at all. Putting breakpoints on all of the functions etc in the page behind shows that it does actually go through everything that it should do, but the browser shows no response at all. If I then manually refresh the browser the second item that I have deleted has gone.
I really need to get the browser to refresh every time I click delete and if possible I could do with understanding the problem please. I have tried using ViewStateMode="Disabled/Enabled" in both the formview and the repeater separately and together.
Additional - I have also tried disabling caching.
Thanks in advance.
<asp:FormView ID="fvDrugActiveSubstance" runat="server" DefaultMode="ReadOnly" UseSubmitBehavior="false" Width="100%">
<ItemTemplate>
<table style="border-collapse: collapse; border-spacing: 0;width: 100%;">
<tr>
<th style="width:80%;">Name</th>
<th style="width:10%;">Edit</th>
<th style="width:10%;">Delete</th>
</tr>
<asp:Repeater ID="rptrDrugActiveSubstance" runat="server" OnItemCommand="rptrDrugActiveSubstance_ItemCommand">
<ItemTemplate>
<tr class="view_table" style="">
<td>
<asp:Label Text='<%# Eval("ActiveSubstanceName") %>' ID="lblName" runat="server" />
<asp:Label Text='<%# Eval("DrugSafetyDrugCode") %>' ID="lblCode" runat="server" Visible="false" />
</td>
<td>
<img onclick='<%# String.Format("openDrugActiveSubstanceWindow( {1},{0},\"Write\" );return false;",((DrugActiveSubstance)Container.DataItem).DrugSafetyDrugCode.ToString(),((DrugActiveSubstance)Container.DataItem).DrugSafetyDrugActiveSubstanceCode) %>' src="/images/grid_icons/edit.png" style="cursor: pointer;" title="Edit" />
</td>
<td>
<asp:ImageButton ID="btnDelete" runat="server" CommandArgument='<%# Eval("DrugSafetyDrugActiveSubstanceCode") %>' style="cursor: pointer;" CommandName="cmd_delete" ImageUrl="~/images/grid_icons/Delete.gif" ToolTip="Delete" />
</td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr class="view_table_alt">
<td>
<asp:Label Text='<%# Eval("ActiveSubstanceName") %>' ID="lblName" runat="server" />
<asp:Label Text='<%# Eval("DrugSafetyDrugCode") %>' ID="lblCode" runat="server" Visible="false" />
</td>
<td>
<img onclick='<%# String.Format("openDrugActiveSubstanceWindow( {1},{0},\"Write\" );return false;",((DrugActiveSubstance)Container.DataItem).DrugSafetyDrugCode.ToString(),((DrugActiveSubstance)Container.DataItem).DrugSafetyDrugActiveSubstanceCode) %>' src="/images/grid_icons/edit.png" style="cursor: pointer;" title="Edit" />
</td>
<td id="tdDelete">
<asp:ImageButton ID="btnDelete" runat="server" CommandArgument='<%# Eval("DrugSafetyDrugActiveSubstanceCode") %>' style="cursor: pointer;" CommandName="cmd_delete" ImageUrl="~/images/grid_icons/Delete.gif" ToolTip="Delete" />
</td>
</tr>
</AlternatingItemTemplate>
</asp:Repeater>
</table>
</ItemTemplate>
</asp:FormView>
protected void rptrDrugActiveSubstance_ItemCommand(object source, RepeaterCommandEventArgs e)
{
drugSafetyService.DeleteDrugActiveSubstance(int.Parse(e.CommandArgument.ToString()));
Response.Redirect(HttpContext.Current.Request.Url.ToString().Split('?')[0] + "?#drugAS_accordian");
}
I'm going to chalk this one up as experience. Having found a javascript function that was causing the abort the problem is now resolved.
Afternoon All,
I am wonding if i can configure and use a collapsiblePanelextender in ASP.net within a table. I would likt this to be used for a minutes of meeting system that i am creating. I have the following code and thought that if i added pnlPresenter and pnlTime to the CollapseControlID along with pnlHeader i would be able to get this to work but i cant.
Has anyone got any other suggestions?
<table width="100%">
<tr>
<td class="style3">Topic</td>
<td class="style2">Presenter</td>
<td>Time Alloted</td>
</tr>
<tr >
<td class="style1" colspan="3">
<asp:Panel ID="pnlHeader" runat="server" CssClass="cpHeader" Width="228%" Height="18px">
1. Agenda Item 1
<asp:Image ID="ImgToggle" runat="server" ImageUrl="~/Images/collapse.jpg" ImageAlign="Middle" />
</asp:Panel>
</td>
</tr>
<tr>
<td class="style3">
<asp:Panel ID="pnlInfo" runat="server" CssClass="cpBody" >
The Agenda topic details goes within here, The Agenda topic details goes within here,
The Agenda topic details goes within here, The Agenda topic details goes within here,.
</asp:Panel>
</td>
<td class="style2">
<asp:Panel ID="pnlPresenter" runat="server" CssClass="cpBody" Width="107px">
Presenters Name
</asp:Panel>
</td>
<td class="style2">
<asp:Panel ID="pnlTime" runat="server" CssClass="cpBody" Width="107px">
Time
</asp:Panel>
</td>
</tr>
</table>
Many Thanks in advance
Regards
Betty
It's not entirely clear what you want to achieve here, especially as there's no CollapsiblePanelExtender in the markup you've posted, so I'm writing this on the assumption that you want to display a page for a meeting where each agenda item is expandable/collapsible.
I suggest you build your table using a Repeater instead of hard-coding it into your page, then for each agenda item the Repeater can render a new row for you. Inside the row that's rendered by the Repeater, you can then have the agenda topic as a header, and the agenda item details as a panel that's expanded/collapsed using the extender:
<asp:Repeater runat="server" ID="AgendaRepeater" DataSourceID="AgendaDataSource">
<HeaderTemplate>
<table border="1">
<tr>
<td>
</td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td>
<asp:Label runat="server" ID="AgendaTopicLabel" Text='<%# Eval("Topic") %>' />
<asp:ImageButton runat="server" ID="PanelExpandContractImageButton" ImageUrl="~/images/zoom_in_16x16.gif" />
<asp:Panel runat="server" ID="AgendaItemDetailsPanel" Height="0px">
<asp:Label runat="server" ID="TopicDetailsLabel" Text='<%# Eval("Details") %>' /><br />
<asp:Label runat="server" ID="PresenterLabel" Text='<%# Eval("Presenter") %>' /><br />
<asp:Label runat="server" ID="TimeLabel" Text='<%# Eval("Time") %>' />
</asp:Panel>
<ajaxToolkit:CollapsiblePanelExtender runat="server" TargetControlID="AgendaItemDetailsPanel"
Collapsed="true" ExpandControlID="PanelExpandContractImageButton" CollapseControlID="PanelExpandContractImageButton"
ImageControlID="PanelExpandContractImageButton" CollapsedImage="~/images/zoom_in_16x16.gif"
ExpandedImage="~/images/zoom_out_16x16.gif" ExpandedSize="100" ExpandDirection="Vertical"
ScrollContents="true" />
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
I'm an asp.net newbie. Basically, I have a DropDownList within and EditItemTemplate within a ListView. When a new item is selected in the drop down, the user would like to NOT have to click the LinkButton for update, but have the update happen automatically. I've experimented with the OnSelectedIndexChanged="ddlrank_itemChanged" using code behind, as well as OnChange="MyFoo()" in javascript, but the details of what to do are beyound me.
I hope I am including the code sample correctly. Any suggestions will be greatly appreciated. Thanks.
<asp:ListView ID="ListView1" runat="server" DataKeyNames="rankingID" DataSourceID="SqlDataSource1" OnItemUpdated="ListView1_Item_Updated">
<LayoutTemplate>
<table cellpadding="2" width="640px" border="1" runat="server" id="tblRankings">
<tr id="Tr1" runat="server">
<th id="Th1" runat="server">Action</th>
<th id="Th3" runat="server">Rank</th>
<th id="Th4" runat="server">Committee name</th>
<th id="Th5" runat="server">Committee type</th>
</tr>
<tr runat="server" id="itemPlaceholder" />
</table>
<asp:DataPager runat="server" ID="RankingDataPager" PageSize="100">
<Fields>
<asp:NextPreviousPagerField ShowFirstPageButton="true" ShowLastPageButton="true"
FirstPageText="|<< " LastPageText=" >>|"
NextPageText=" > " PreviousPageText=" < " />
</Fields>
</asp:DataPager>
</LayoutTemplate>
<ItemTemplate >
<tr id="Tr2" runat="server">
<td>
<asp:LinkButton ID="EditButton" runat="Server" Text="Edit" CommandName="Edit" />
</td>
<td valign="top">
<asp:Label ID="RankLabel" runat="Server" Text='<%#Eval("rank") %>' />
</td>
<td valign="top">
<asp:Label ID="CommitteeNameLabel" runat="Server" Text='<%#Eval("committeename") %>' />
</td>
<td valign="top">
<asp:Label ID="CommitteeTypeLabel" runat="Server" Text='<%#Eval("committeetype") %>' />
</td>
</tr>
</ItemTemplate>
<EditItemTemplate >
<tr style="background-color: #ADD8E6">
<td>
<asp:LinkButton ID="UpdateButton" runat="server" CommandName="Update" Text="Update" />
<asp:LinkButton ID="CancelButton" runat="server" CommandName="Cancel" Text="Cancel" />
</td>
<td>
<asp:DropDownList ID="ddlrank"
DataSourceID="sdsrank"
DataValueField="vchvalue"
DataTextField="vchvalue"
OnSelectedIndexChanged="ddlrank_itemChanged"
OnChange="MyFoo()"
SelectedValue='<%# Bind("rank") %>' runat="server" >
</asp:DropDownList>
</td>
<td>
<asp:TextBox ID="CommitteeNameTextBox" runat="server" Enabled="false" ReadOnly="true" Text='<%#Bind("committeename") %>'
MaxLength="200" /><br />
</td>
<td>
<asp:TextBox ID="CommitteeTypeTextBox" runat="server" Enabled="false" ReadOnly="true" Text='<%#Bind("committeetype") %>'
MaxLength="20" /><br />
</td>
</tr>
</EditItemTemplate>
</asp:ListView>
I think you are missing AutoPostBack="true" on your dropdownlist property. Hope it helps.
You're headed in the right direction. You can use "OnSelectedIndexChanged", or you can create a function in your codebehind page that handles the SelectedIndexChanged event. Either way, when the user makes a selection from the dropdown, you get a postback and that function is executed. In the function you can do whatever you want. In a case like this that might mean checking what the selected value is and setting other values on the screen based on the new selection. When the function exits, a new screen is sent to the user's browser with any updated data.
Thanks for the replies, they helped direct and refine my internet searching!
I finally found a simple solution.
It just requires two lines of code in the OnSelectedIndexChanged code-behind function defined on the dropdownlist:
protected void ddlrank_itemChanged(object sender, EventArgs e)
{
ListViewDataItem item = (ListViewDataItem)((DropDownList)sender).Parent;
ListView1.UpdateItem(item.DisplayIndex, false);
}