I have an aspx c# page for bank account numbers and credit card installment list in one page
if user want to bank transfer it choose bank account else if user want to pay credit card installment it did it.
the problem is radio buttons group name. I didn't group the radio buttons and didn't get the selected radio button value.
Here is my codes.
This İs Bank Account List
<asp:Repeater ID="RptBankalar" runat="server">
<ItemTemplate>
<div class="BankaListBox">
<table width="100%" height="100" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="200" align="center" valign="middle">
<img alt="<%#Eval("BankName").ToString() %>" src="../../Files/<%#Eval("Logo").ToString() %>" /></td>
<td>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="120" height="22"><strong>Account Owner</strong></td>
<td width="15"><strong>:</strong></td>
<td><%#Eval("AcOwner").ToString() %></td>
</tr>
<tr>
<td width="120" height="22"><strong>Branch No</strong></td>
<td width="15"><strong>:</strong></td>
<td><%#Eval("Branch").ToString() %></td>
</tr>
<tr>
<td width="120" height="22"><strong>Account Number</strong></td>
<td width="15"><strong>:</strong></td>
<td><%#Eval("AccountNum").ToString() %></td>
</tr>
<tr>
<td width="120" height="22"><strong>IBAN</strong></td>
<td width="15"><strong>:</strong></td>
<td><%#Eval("Iban").ToString() %></td>
</tr>
</table>
</td>
<td width="100" align="center" valign="middle">
<asp:RadioButton ID="RadioBtn" Text='<%#Eval("id").ToString() %>' runat="server" />
</td>
</tr>
</table>
</div>
</ItemTemplate>
</asp:Repeater>
Same Page Credit card installment list
<asp:Repeater ID="RptTaksitList" OnItemDataBound="RptTaksitList_ItemDataBound" runat="server">
<ItemTemplate>
<tr runat="server" id="arka_tr">
<td align="center" height="22" width="40" runat="server" id="td1">
<b style="display: none; visibility: hidden">
<asp:Literal ID="lt_id" Text='<%#Eval("BankaID").ToString() %>' runat="server"></asp:Literal>
</b>
<asp:Literal ID="lt_taksit_sayisi" Text='<%#Eval("TaksitSayisi").ToString() %>' runat="server"></asp:Literal></td>
<td width="150" runat="server" id="td2">
<asp:Literal ID="LblSepetTotal" runat="server" Text='<%#Session["SepetUrunToplami"] %>'></asp:Literal></td>
<td runat="server" id="td3"><b style="display: none; visibility: hidden">
<asp:Literal ID="lt_komisyon_orani" Text='<%#Eval("KomisyonOrani").ToString() %>' runat="server"></asp:Literal>
</b>
<asp:Literal ID="lt_toplam_tutar" runat="server" Text=''></asp:Literal>
<b style="display: none; visibility: hidden">
<asp:Literal ID="lt_alt_limit" Text='<%#Eval("AltLimit").ToString() %>' runat="server"></asp:Literal>
</b>
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
How can i get the values and grouping this radio buttons.
Normally i did in classic asp but i change my coding language.
Kindly regards.
Thanks for your helps.
i never help in Stack. So i will contribute for the first time after been helped so many times by the community.
I hove you like. I have a more simple solution.
Surround your radio button with some element (DIV) with a className that you might like just to pick all the radio in jQuery.
EDITED IN: The aspnet wasnt persisting the viewstate when i changed that way. Now it works just fine :)
$(document).ready(function () {
$(".radiofix").each(function () {
var objRadiosContainer = $(this);
objRadiosContainer.find("input[type=radio]").each(function () {
var objRadio = $(this);
objRadio.change(function () {
if(objRadio.get(0).checked)
{
objRadiosContainer.find("input[type=radio]").each(function () {
if($(this).get(0).id != objRadio.get(0).id)
{
$(this).get(0).checked = false;
}
});
}
});
});
});
});
Let's take a look in the HTML file (or ASPX file):
<asp:Repeater ID="questions" runat="server">
<ItemTemplate>
<h3>%# getQuestionNumber() %>) <%# Eval("questionDescription").ToString() %></h3>
<div class="nameOfTheClass">
<asp:Repeater ID="answers" runat="server">
<ItemTemplate>
<asp:RadioButton ID="radioId" runat="server" />
</ItemTemplate>
</asp:Repeater>
</div>
</ItemTemplate>
This you will work just fine. Just create some javascript file (.js) and call it, fixTheRadios.js and choose a name for "nameOfTheClass" that you like.
Important: I didnt tested the code inside an update panel. I suggest you do that.
Here's how I do it.
In the markup I declare the radio button as server side html control:
<input id="rbMyRadio" type="radio"runat="server" class="myClass" />
And in the code access the value:
foreach (RepeaterItem item in RptBankalar.Items)
{
if (item.ItemType == ListItemType.Item || item.ItemType == ListItemType.AlternatingItem)
{
HtmlInputRadioButton rbMyRadio = (HtmlInputRadioButton)item.FindControl("rbMyRadio");
if (rbMyRadio != null && rbMyRadio.Checked)
{
//Do tasks
}
}
}
Grouping is done using jquery in page head:
<script type="text/javascript">
$(document).ready(function () {
$('input[type=radio]').click(function () {
var cname = $(this).attr('class');
$('.' + cname).each(function () {
$(this).prop('checked', false);
});
$(this).prop('checked', true);
});
});
</script>
And reference jquery in the head:
<script src="Scripts/jquery-1.8.2.js"></script>
Very late answer but you can also try adding the radio buttons like this in the repeater:
<asp:TemplateColumn>
<ItemTemplate>
<div style="text-align: center">
<input type="radio" id="rptMyRadio" runat="server" />
</div>
</ItemTemplate>
</asp:TemplateColumn>
Then in a script block add:
$('input[type=radio]').click(function () {
$('input[type=radio]').removeAttr("checked");
$(this).prop('checked', true);
});
Related
I have used a repeater button for show a set of videos. The issue is when the image button in the repeater is clicked twice the data base count is increasing twice.
I don't want that to be happening?
<asp:Repeater ID="rptVideos" runat="server" OnItemCommand="rpViewReports_ItemCommand">
<HeaderTemplate>
<table width="100%">
</HeaderTemplate>
<ItemTemplate>
<tr>
<td style="width: 7%">
<asp:ImageButton ID="imgRP" CommandName="Play" CommandArgument='<%#Eval("ComponentId")%>'
runat="server" ImageUrl="../../../Images/VideoHelp.png" />
</td>
<td>
<span style="font-weight: bold"><%#Eval("ComponentName")%></span>
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
Please add the following script in your aspx page.
<script type="text/javascript" language="javascript">
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);
function BeginRequestHandler(sender, args) { var oControl = args.get_postBackElement(); oControl.disabled = true; }
</script>
Or add the following code in your Page_load function ¨
imgRP.Attributes.Add("onclick", "this.disabled='true';");
imgRP.Attributes.Add("onload", "this.disabled='false';");
In past, i worked on ListViews (.net 2.0) using a custom Template field but what i am trying to achieve here is the following
I am now working on .net 4.6
So basically a list which shows items like above and on mouse-hover few options show up as shown in the following screenshot
I also have to trigger those option to do different things -
How can I do that in asp.net, may I please have some code references.
Cheers
P.S.
This is a rough example of how i am creating the List Item Template (as requested)
<asp:ListView ID="ListView1" runat="server" DataSourceID="SqlDataSource1">
<AlternatingItemTemplate>
<table >
<tr>
<td ><asp:Image ID="image1" ImageUrl='<%# Bind("url") %>' runat="server" Width="98px" /> </td>
<td><h2><asp:Label ID="_label" runat="server" Text ='<%# Bind("title") %>'></asp:Label></h2><asp:Label ID="Label1" runat="server" Text ='<%# Bind("description") %>'></asp:Label></td>
</tr>
</table>
</AlternatingItemTemplate>
<EmptyDataTemplate>
No data was returned.
</EmptyDataTemplate>
<ItemSeparatorTemplate>
<br />
</ItemSeparatorTemplate>
<ItemTemplate>
<table >
<tr>
<td ><asp:Image ID="image1" ImageUrl='<%# Bind("url") %>' runat="server" Width="98px" /> </td>
<td><h2><asp:Label ID="_label" runat="server" Text ='<%# Bind("title") %>'></asp:Label></h2><asp:Label ID="Label1" runat="server" Text ='<%# Bind("description") %>'></asp:Label></td>
</tr>
</table>
</ItemTemplate>
<LayoutTemplate>
<ul id="itemPlaceholderContainer" runat="server" style="">
<li runat="server" id="itemPlaceholder" />
</ul>
<div style="">
</div>
</LayoutTemplate>
</asp:ListView>
I can add any html formatting to this template e,g i can add ASP:button etc but i don't know how to trigger those to perform certain tasks.
One easy way to achieve your requirement is to keep those buttons there but invisible and show them up when the parent container is hovered. following as a quick sample
aspx
<asp:ListView ID="ListView1" runat="server">
<ItemTemplate>
<tr class="row-data">
<td>
<asp:Label ID="NameLabel" runat="server" Text='<%# Eval("Name") %>' />
</td>
<td>
<asp:Label ID="PositionLabel" runat="server" Text='<%# Eval("Position") %>' />
</td>
<td>
<div class="btn-area">
<asp:Button runat="server" Text="Button1" />
<asp:Button runat="server" Text="Button2" />
</div>
</td>
</tr>
</ItemTemplate>
<LayoutTemplate>
<table id="itemPlaceholderContainer" runat="server" border="0" style="">
<tr runat="server" style="">
<th runat="server">
Name
</th>
<th runat="server">
Position
</th>
<th>
</th>
</tr>
<tr id="itemPlaceholder" runat="server">
</tr>
</table>
</LayoutTemplate>
</asp:ListView>
css
.btn-area
{
display: none;
}
.row-data:hover .btn-area
{
display: block;
}
code-behind
protected void Page_Load(object sender, EventArgs e)
{
ListView1.DataSource = new List<dynamic>() {
new { Name = "Andy", Position = "PG"},
new { Name = "Bill", Position = "SD"},
new { Name = "Caroline", Position = "Manager"}
};
ListView1.DataBind();
}
UPDATE
ListView ItemCommand can capture the postback by button pressed and CommandName makes you able to recognize which button fired it.
<asp:Button runat="server" Text="Button1" CommandName="c1" />
<asp:Button runat="server" Text="Button2" CommandName="c2" />
code-behind
protected void ListView1_ItemCommand(object sender, ListViewCommandEventArgs e)
{
if (e.CommandName == "c1")
{
// do something when button1 pressed
}
else if (e.CommandName == "c1")
{
// do something when button2 pressed
}
}
NET. i am trying to access the div tag in code behind which is inside the SeparatorTemplate
Here is my aspx code
<div>
<asp:DataList ID="DataList1" runat="server">
<ItemStyle ForeColor="#4A3C8C" BackColor="#E7E7FF"></ItemStyle>
<HeaderTemplate>
<table width="900px">
<tr>
<td width="300px">
<b>Name</b>
</td>
<td width="300px">
<b>Account No</b>
</td>
<td width="300px">
<b>Company</b>
</td>
</tr>
</table>
</HeaderTemplate>
<ItemTemplate>
<table width="900px">
<tr>
<td align="left" width="300px">
<%# DataBinder.Eval(Container.DataItem, "Name")%>
</td>
<td align="left" width="300px">
<%# DataBinder.Eval(Container.DataItem, "AccountNo")%>
</td>
<td align="left" width="300px">
<%# DataBinder.Eval(Container.DataItem, "Company")%>
</td>
</tr>
</table>
</ItemTemplate>
<HeaderStyle Font-Bold="True" ForeColor="#F7F7F7" BackColor="#4A3C8C"></HeaderStyle>
<SeparatorTemplate>
<div id="divSeprator" runat="server">//This div tag i want to access in the code behind
<br />
</div>
</SeparatorTemplate>
</asp:DataList>
</div>
I have tried accessing the this.Controls and DataList1.Controls but both of those doesn't contain this div i know it is in the SepratorTemplate but i don't know how to access control from that template because there is nothing to find the controls.
protected void DataList1_ItemDataBound(object sender, DataListItemEventArgs e)
{
// Find the div control as htmlgenericcontrol type, if found apply style
System.Web.UI.HtmlControls.HtmlGenericControl div = (System.Web.UI.HtmlControls.HtmlGenericControl)e.Item.FindControl("DivContent");
if(div != null)
div.Style.Add("border-color", "Red");
}
You will need to find it from the datalist row as below.
HtmlGenericControl div = (HtmlGenericControl)yourDataList.Items[0].FindControl("dvSeparator");
You can pass the index of the data list item (row) in .Items[] for which you want to find the div for processing.
If you want to process div from all the datalist items then you can do it in the item data bound event of the datalist as #Upvote MarkAnswer has suggested in his answer.
HtmlGenericControl divSeprator = (HtmlGenericControl)DataList1.Items[0].FindControl("divSeprator");
Where 0 is your item index.
Or just bind a DataList1_ItemDataBoud event and use:
if(e.Item.ItemType == ListItemType.Separator)
HtmlGenericControl divSeprator = (HtmlGenericControl)e.Item.FindControl("divSeprator");
you need to make tag runat="sever" and give it id
<div id="div" runat="server">
Then you can access it by using
HtmlGenericControl div = HtmlGenericControl("div")
I have a page that showing a game list (videogames.aspx)
I have a DataGrid inside an update panel that use a usercontrol to show each videogame. (game.ascx) that is used in my videogames page.
In this usercontrol I have the ability to say progression in the game (Finish, to play etc... by using asp button)
Now I would like to have the possibility to rate a game when showing the list.
To do that I use http://www.wbotelhos.com/raty/
I have created another usercontrol (for rate).
I use this usercontrol inside my game.ascx usercontrol.
When the page load for the first time I have no problem (my current rate is display)
I decide to change my rate on the first game to try and my rate is well save in the database using webmethods and well display on the sreen by javascript.
Now I decide to change my progression in the second videogame and at this moment (postback) the rating of my first game is go back to my old rating value...
I have the impression that my updatepanel keep the old value in the ViewState no?
How do I get out of this situation ?
VideoGames.aspx:
<asp:UpdatePanel ID="Update" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:DataGrid ID="dgJeux" runat="server" AutoGenerateColumns="false" OnItemDataBound="dgJeux_ItemDataBound" AllowPaging="true" PagerStyle-Position="TopAndBottom"
PageSize="10" GridLines="None" CssClass="table" ShowHeader="false" OnPageIndexChanged="dgJeux_PageIndexChanged">
<PagerStyle Mode="NumericPages" HorizontalAlign="Right" CssClass="paginationASP"/>
<Columns>
<asp:BoundColumn DataField="jeu_id" Visible="false"></asp:BoundColumn>
<asp:TemplateColumn HeaderText="Jeu" ItemStyle-HorizontalAlign="Center" ItemStyle-VerticalAlign="Middle">
<ItemTemplate>
<UC:UCJeu ID="ucJeu" runat="server"></UC:UCJeu>
</ItemTemplate>
</asp:TemplateColumn>
</Columns>
</asp:DataGrid>
</ContentTemplate>
</asp:UpdatePanel>
My game.ascx:
<table>
<tr>
<td><UC:UCNote ID="ucNote" runat="server"></UC:UCNote></td>
<td class="pull-right">
<asp:Repeater ID="rptAvancementJeu" runat="server" Visible="false" OnItemDataBound="rptAvancementJeu_ItemDataBound">
<HeaderTemplate>
<div class="btn-group" data-toggle="buttons-checkbox">
</HeaderTemplate>
<ItemTemplate>
<asp:Button ID="butAvancementJeu" CssClass="btn btn-success" runat="server" Text='<%# Eval("jeuavancement_libelle") %>' OnCommand="butAvancementJeu_OnCommand" CommandName="ChangerAvancement" Width="85"/>
</ItemTemplate>
<FooterTemplate>
</div>
</FooterTemplate>
</asp:Repeater>
</tr>
</table>
My GameRate.Ascx :
<script type="text/javascript">
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
function EndRequestHandler(sender, args) {
if (args.get_error() == undefined) {
$(document).ready(function() {
$('#<%= noteMoyenne.ClientID %>').raty({
score: function () {
return $('#<%= noteMoyenne.ClientID %>').attr('data-rating');
},
readOnly: true
});
$('#<%=noteUtilisateur.ClientID %>').raty({
half: true,
click: function (score, evt) {
var contexte = new Array('<%= noteUtilisateur.ClientID %>', '<%= noteMoyenne.ClientID %>');
PageMethods.AffecteNoteEtRetourneNoteMoyenne($('#<%= hfObjectID.ClientID %>').val(), score, AffecterNoteEtMoyenne, null, contexte)
},
score: function () {
return $('#<%= noteUtilisateur.ClientID %>').attr('data-rating');
}
});
});
}
}
</script>
<table>
<asp:Panel ID="pnlNoteUtilisateur" runat="server" Visible="false">
<tr>
<td>
Note :
</td>
<td>
<div id="noteUtilisateur" runat="server"></div>
<asp:HiddenField ID="hfObjectID" runat="server" />
</td>
</tr>
</asp:Panel>
<tr>
<td>
Moyenne :
</td>
<td>
<div id="noteMoyenne" runat="server"></div>
</td>
</tr>
<tr>
<td></td>
<td>
<asp:Label ID="lblNombreNotes" runat="server" Text="(pas de note)"></asp:Label>
</td>
</tr>
</table>
Exemple of html generated by raty :
<div id="ctl00_content_dgJeux_ctl03_ucJeu_ucNote_noteUtilisateur" data-rating="0.5" style="cursor: pointer; width: 100px;">
<img src="../img/stars/star-half.png" alt="1" title="Beurk">
<img src="../img/stars/star-off.png" alt="2" title="Mauvais">
<img src="../img/stars/star-off.png" alt="3" title="Pas mal">
<img src="../img/stars/star-off.png" alt="4" title="Bon">
<img src="../img/stars/star-off.png" alt="5" title="Addictif">
<input type="hidden" name="score" value="0.5">
</div>
It use data-rating attribute to show rating value. In my case, after my new rate the value would be 3.5. My webmethod is well called and the value is save in the database. The new data-rating is changed in the html. The problem begin when I wish to change the game progression on another game. The old rate value of the first game come back after postback...
Thanks a lot for your help... I am lost
I have a repeater control where the <%#DataBinder.Eval(Container.DataItem, "Display")%> part doesn't show up. The code that the "Display" stores is set as follows:
item.Display = "<script type='text/javascript'>
AudioPlayer.embed('ffcedea7-4822-465f-85b6-89924f7b81fa',
{soundFile: 'http://s3.amazonaws.com/blah/af8g7fd3-1793-4b5e-92b7-9d11ad1cc19c.mp3'});
</script>";
After the page load, the audio embed file doesn't show up. The code doesn't even show up in the source. If I add a random string after the ending script tag, that random string will show up.
item.Display = "<script type='text/javascript'>
AudioPlayer.embed('ffcedea7-4822-465f-85b6-89924f7b81fa',
{soundFile: 'http://s3.amazonaws.com/blah/af8g7fd3-1793-4b5e-92b7-9d11ad1cc19c.mp3'});
</script> THIS IS THE RANDOM STRING";
So, on the page source it will have " THIS IS THE RANDOM STRING" but not the script part.
Does anyone know what is causing this issue and how it can be fixed? Thanks!
Edit: Here is the repeater code:
<asp:Repeater ID="repeaterAddable" runat="server">
<ItemTemplate>
<div class="background-white">
<div style="padding: 15px;">
<table style="width: 100%" cellspacing="5">
<tr>
<td colspan="3" align="right">
Include this? <input type="checkbox" name="include<%#DataBinder.Eval(Container.DataItem, "Index")%>" />
</td>
</tr>
<tr>
<td style="width: 30%;" valign="top">
</td>
<td style="width: 30%;" valign="top">
<div class="media">
<%#DataBinder.Eval(Container.DataItem, "Display")%>
</div>
</td>
<td style="width: 30%;" valign="top">
</td>
</tr>
</table>
</div>
</div>
<br />
</ItemTemplate>
</asp:Repeater>
Try adding a Literal control instead, and bind its text property to the desired content. E.g:
<div class="media">
<asp:Literal runat="server" Text='<%# Eval("Display") %>' />
</div>
Maybe you have some safe settings on your page or webconfig...
I tried to reproduce your situation in a brand new page, but it actually worked.
public class A
{
public string Display { get; set; }
}
protected void Page_Load(object sender, EventArgs e)
{
var list = new List<A>();
var a = new A();
a.Display = "<script>alert('hi')</script>S<br/>";
list.Add(a);
rep.DataSource = list;
rep.DataBind();
}
And in the page
<asp:Repeater ID="rep" runat="server">
<ItemTemplate>
<%# DataBinder.Eval(Container.DataItem, "Display") %>
</ItemTemplate>
</asp:Repeater>
Perhaps you can try to set the Display with HttpUtility.UrlEncode and get it with HttpUtility.UrlDecode...