Using Repeater control in vb.net - asp.net

I am using a repeater control to view database table data, I want to add a link button next to each row to delete a specific row, how can I do that using vb.net??

There is nothing to do much, do you want to display it(link button for all the rows? if yes then try the following code)
<table cellpadding="0" cellspacing="0">
<tr valign="top" class="list_heading">
<td width="25%">
Column
</td>
<td width="25%">
Operation
</td>
<td width="19%" style="display: none;">
And/Or
</td>
<td width="25%">
Value
</td>
<td width="06%">
Remove
</td>
</tr>
<tbody>
<asp:Repeater ID="rpSearchItems" runat="server">
<ItemTemplate>
<tr>
<td style="display: none;">
</td>
<td>
<%# Eval("ColumnName") %>
</td>
<td>
<%# Eval("Operation") %>
</td>
<td style="display: none;">
<%# Eval("AndOr") %>
</td>
<td>
<%# Eval("Value") %>
</td>
<td align="center">
<asp:ImageButton ID="ibtnRemoveSearchItem" ImageUrl="~/Controls/ImagesForSearch/Remove.png"
CommandArgument=' <%# Eval("Id") %>' CssClass="RemoveUitem" ToolTip="Remove Item"
runat="server" OnClick="ibtnRemoveSearchItem_Click" />
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
</tbody>
<tr valign="top" class="list_bottom">
<td colspan="6">
</td>
</tr>
</table>
And in code behind code you can go like this:
Protected Sub ibtnRemoveSearchItem_Click(sender As Object, e As EventArgs)
ImageButton ibtnRemoveSearchItem = (ImageButton)sender;
Int32 Id = Convert.ToInt32(ibtnRemoveSearchItem.CommandArgument);
//Using the above two lines you can get the Coomand Argument, pass it to you delete stored proc thats all
// do your stuff here
End Sub
hope this will help you
UPDATE : If you want to add it conditionally then you can do it from "OnItemDataBound" event of repeater
for much info review this
This one also can help you

Related

how to implement dirty bit functionality or some other method in asp.net page

I have an asp.net page in which I have a ckeditor control and ajax file upload tool. I want to show user certain message when he tries to leave the page without saving data.I am beginner in JavaScript/JQuery and would like to find some easy solution directly implemented into asp.net code.If possible can you provide step by step implementation of dirty bit functionality.
`<script>
window.onbeforeunload = function (e) {
return 'Dialog text here.';
};
</script>`
Above code shows me the message even if nothing has changed on the page.How do I apply it to specific control like ckeditor/ajaxuploadctrl etc
Below is the HTML code
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<div id="DirtyBit">
<form id="form" runat="server">
Country : <asp:DropDownList ID="drpCountry" runat="server"></asp:DropDownList>
<br />
<table style="width: 100%; height: 337px;">
<tr>
<td class="auto-style2">TV :</td>
<td class="auto-style3"> <CKEditor:CKEditorControl ID="CKTV" BasePath="/ckeditor/" runat="server"
</CKEditor:CKEditorControl> </td>
</tr>
<tr>
<td class="auto-style6">BV :</td>
<td class="auto-style7"> <CKEditor:CKEditorControl ID="CKBV" BasePath="/ckeditor/" runat="server">
</CKEditor:CKEditorControl></td>
</tr>
<tr>
<td class="auto-style8">CA :</td>
<td class="auto-style9"> <CKEditor:CKEditorControl ID="CKCA" BasePath="/ckeditor/" runat="server">
</CKEditor:CKEditorControl></td>
</tr>
<tr>
<td class="auto-style10">CJ :</td>
<td class="auto-style11"> <CKEditor:CKEditorControl ID="CKCJ" BasePath="/ckeditor/" runat="server">
</CKEditor:CKEditorControl></td>
</tr>
<tr>
<td class="auto-style1">
Visa Form :</td>
<td><table id="attachedfiles">
<tr>
<td class="auto-style12">
<asp:ScriptManager runat="server">
</asp:ScriptManager>
<asp:AjaxFileUpload ID="AjaxFileUpload11" runat="server" MaximumNumberOfFiles="5"
Width="400px" OnUploadComplete="OnUploadComplete" />
</td>
</tr>
</table></td>
</tr>
<tr>
<td class="auto-style4">
</td>
<td class="auto-style5">
<asp:Button ID="btnSave" runat="server" Height="30px" OnClick="btnSave_Click" Text="Save" Width="109px" />
</td>
</tr>
<tr>
<td class="auto-style4">
</td>
<td class="auto-style5">
</td>
</tr>
</table>
</form>
</div>
</asp:Content>

Adding more than 1 column to ListView (ASP.NET)

I am creating a webpage that is listing the names of places using ASP.NET. I am using a data source to read the data from a database file. The list view is displaying all the data in one column. What I am trying to do is add 7 rows of data and then as soon as the 7th row has been added, add another column, and then continue writing the data in the new created column. Here is my code:
<asp:ListView runat="server" DataSourceID="cwDataSource">
<ItemTemplate>
<tr style="">
<td>
<asp:Label ID="NameLabel" runat="server" Text='<%# Eval("Name") %>' />
</td>
<td>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp</td>
<td>
VIEW STORE PAGE
</td>
</tr>
</ItemTemplate>
<LayoutTemplate>
<table runat="server">
<tr>
<td>
&nbsp
</td>
</tr>
<tr>
<td>
&nbsp
</td>
</tr>
<tr runat="server">
<td runat="server">
<table ID="itemPlaceholderContainer" runat="server" border="0" style="">
<tr runat="server" style="">
<td>COLUMN #</td>
</tr>
<tr>
<td>
&nbsp
</td>
</tr>
<tr ID="itemPlaceholder" runat="server">
</tr>
</table>
</td>
</tr>
<tr>
<td>
&nbsp
</td>
</tr>
<tr>
<td>
&nbsp
</td>
</tr>
</table>
</LayoutTemplate>
</asp:ListView>
Example of what the output should look like (The 'VIEW STORE PAGE' is just a link):
COLUMN 1 COLUMN 2
A.ADDED VIEW STORE PAGE H.ADDED VIEW STORE PAGE
B.ADDED VIEW STORE PAGE I.ADDED VIEW STORE PAGE
C.ADDED VIEW STORE PAGE J.ADDED VIEW STORE PAGE
D.ADDED VIEW STORE PAGE K.ADDED VIEW STORE PAGE
E.ADDED VIEW STORE PAGE L.ADDED VIEW STORE PAGE
F.ADDED VIEW STORE PAGE M.ADDED VIEW STORE PAGE
G.ADDED VIEW STORE PAGE N.ADDED VIEW STORE PAGE
Any help would be appreciated.
I got it working:
<asp:DataList ID="cwDataList" runat="server" DataSourceID="cwDataSource" RepeatDirection=Vertical RepeatColumns=2 style="text-align: center">
<ItemTemplate>
<table style="width: 500px;">
<tr style="">
<td align="left" style="width: 250px; height: 18px">
<asp:Label ID="NameLabel" runat="server" Text='<%# Eval("Name") %>' />
</td>
<td align="left" style="width: 250px; height: 18px">
VIEW STORE PAGE
</td>
</tr>
</table>
</ItemTemplate>
</asp:DataList>

show matrix like data in listview

i'm working on a advertising web site that shows its goods on one of pages.
i want to show that goods in a listview but i want to my list view shows its goods in matrix like view.
for example my listview reads data like name,description and image of goods and shows first four of those in first row and next four in second row and so on.
could you please help me how do i do this? i want to use div ins Listview's Itemtemplate
is this proper code for my reson?
<asp:DataList ID="datalist_Data" runat="server">
<HeaderTemplate>
<table>
<tr style="background-color: #6699FF; color: #FFFFFF; font-size: large;">
<td width="150">Column 1</td>
<td width="150">Column 2</td>
<td width="150">Column 3</td>
<td width="150">Column 4</td>
</tr>
</table>
</HeaderTemplate>
<ItemTemplate>
<table>
<tr>
<td width="150"><%# Eval("c1") %></td>
<td width="150"><%# Eval("c2") %></td>
<td width="150"><%# Eval("c3") %></td>
<td width="150"><%# Eval("c4") %></td>
</tr>
</table>
</ItemTemplate>
DataList has a set of property to deal with your problem : RepeatColumns, RepeatDirection and RepeatLayout
Read more about DataList control on MSDN
Here's the code for your need (where Foois the type of your good) :
<asp:DataList runat="server" ID="datalist" RepeatColumns="4" RepeatDirection="Horizontal" RepeatLayout="Table">
<HeaderTemplate>
<table>
<tr style="background-color: #6699FF; color: #FFFFFF; font-size: large;">
<td width="150">Column 1</td>
<td width="150">Column 2</td>
<td width="150">Column 3</td>
<td width="150">Column 4</td>
</tr>
</table>
</HeaderTemplate>
<ItemStyle Width="150" Wrap="true" />
<ItemTemplate>
<%# (Container.DataItem as Foo).Name %><br />
<%# (Container.DataItem as Foo).Description %><br />
<%# (Container.DataItem as Foo).ImageUrl %>
</ItemTemplate>
</asp:DataList>
Note that this writing avoid the Eval, which is poorly effective since it requires reflection.
EDIT : Here's the C# code :
protected void Page_Load(object sender, EventArgs e)
{
List<Foo> list = GetGoods();
datalist.DataSource = list;
datalist.DataBind();
}

How to be overflow the row of table?

I created a webpage with the uploaded files and the uploading control in asp.net. I got a problem that is design problem.
<table style="width:500px;height:500px">
<tr>
<td>Uploading page<td>
</tr>
<tr>
<td style="height:300px;overflow:auto">
<asp:Repeater ID="UploadedFileList" runat="server">
<ItemTemplate>
<%# Eval("FileName") %>
</ItemTemplate>
</asp:Repeater>
<td>
</tr>
<tr>
<td><asp:FileUpload ID="FileUpload1" runat="server"/></td>
</tr>
</table>
I want to be overflow the sencod row. How can I do that?
You should keep another DIV inside the td to work better in this situation.
<table style="width:500px;height:500px">
<tr>
<td>Uploading page<td>
</tr>
<tr>
<td style="height:300px;">
<div style="height:300px;overflow:auto">
<asp:Repeater ID="UploadedFileList" runat="server">
<ItemTemplate>
<%# Eval("FileName") %>
</ItemTemplate>
</asp:Repeater>
</div>
<td>
</tr>
<tr>
<td><asp:FileUpload ID="FileUpload1" runat="server"/></td>
</tr>
</table>

Toggle rows created using Repeater Control ASP.NET

I am creating a list of data using Repeater Control. Some of the rows might have other rows that should be toggled using the main row's clickable image.
Here, is the HTML part
<table cellpadding="2" cellspacing="0" width="100%">
<asp:Repeater ID="repeatLockers" runat="Server">
<HeaderTemplate>
<tr>
<td> </td>
<td>A</td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr id="trItem" class="SomeParentClass" runat="server">
<td>
<img id="imgToggleHomeInfo" runat="server" alt="show/hide repetitves" src="icon_plus.gif"
style="cursor: pointer" />
</td>
<td>
<asp:Label ID="lbl" runat="server"></asp:Label>
</td>
</tr>
<tr id="trAddOnFee" runat="server" class="SomeClass" style="display: none;">
<td colspan="2">
<table cellpadding="4" cellspacing="2" width="100%">
<tr>
<td class="DgHeader">A</td>
<td class="DgHeader">B</td>
</tr>
<asp:Repeater ID="repeatRepetitives" runat="server">
<ItemTemplate>
<tr>
<td>
<asp:Label ID="lblA" runat="server"></asp:Label>
</td>
<td align="right">
<asp:Label ID="lblB" runat="server"></asp:Label>
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
</table>
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
</table>
How could I toggle the Rows with class as "SomeClass" inside on click of imgToggleHomeInfo" image on its parent row using Jquery?
I'd find the parent row of the image then toggle it's next sibling.
$(document).ready( function() {
$("[id$='imageToggleHomeInfo']").click( function() {
$(this).closest('tr').next().toggle();
});
})

Resources