I have created repeater with radiobutton inside and binding data from db, all works good instead css and groupName.. when render - it doesn't works, user can check all radiobuttons instead one...
This is my code below, please help...
<asp:Repeater ID="rptList" runat="server">
<ItemTemplate>
<ul><li>
<asp:RadioButton ID="RadioButton8"
runat="server"
CssClass="w1"
GroupName="Options"
Text='<%# DataBinder.Eval(Container.DataItem, "EvName")%>'
ValidationGroup="Options" />
</li></ul>
</ItemTemplate>
</asp:Repeater>
I had the same problem.
I couldn't find a way that doesn't use jquery.
I was able to use this tutorial to solve my problem.
http://blog.marketnet.com/index.php/2010/03/01/overcoming-the-radio-button-repeater-bug/
Copied from the tutorial:
In the markup file, add this bit of Javascript and jQuery:
<script type="text/javascript" language="javascript">
function SetUniqueRadioButton(strGroupName, current)
{
$("input[name$='" + strGroupName + "']").attr('checked', false);
current.checked = true;
}
</script>
Set up the Repeater control using a RadioButton control:
<asp:Repeater ID="rptMyRepeater" runat="server">
<ItemTemplate>
<asp:RadioButton ID="rdoButton" GroupName="GroupName" runat="server"/>
</ItemTemplate>
</asp:Repeater>
Finally, in the code behind file:
rdoButton.Attributes.Add("onclick", "SetUniqueRadioButton('MyGroupName',this)");
Related
I have seen many resources on SO that say that I can use following syntax to pass value to CommandArguement of `LinkButton'
<%forearch(var comment in Comments){%>
<asp:LinkButton ID="del" CommandArguement='<%= comment.CommentId%>' onCommand="delete_click" Text="Delete"/>
<%}%>
But when I write this in my ascx file and click on the link the value passed to command argument is "<%=comment.CommentId%>" instead of commentId itself. Please guide what am I doing wrong?
Edit 1
based on answers and comments, I have moved to use repeater instead of foreach and plain code. Here is the code I have come up with
<asp:Repeater ID="commRepeater" SelectMethod="GetPageComments" runat="server">
<ItemTemplate>
<p>
<%#Eval("Comment") %>
<%if(Page.User.Identity.IsAuthenticated && Page.User.Identity.GetUserId() == Eval("UserId")){ %>
<span>
<asp:LinkButton Text="Edit" runat="server" ID="EditLink" CommandArgument='<%#Eval("CommentId")%>' OnClick="Update_Comment" />
<asp:LinkButton Text="Delete" runat="server" ID="DeleteLink" CommandArgument='<%#Eval("CommentId")%>' OnClientClick="if (!confirm('Are you sure you want delete?')) return false;" OnCommand="Delete_Comment" />
</span>
<%} %>
</p>
</ItemTemplate> </asp:Repeater>
you can see that I am trying to show the edit and delete links if user is logged in and his Id matches with user who commented but it tells me that I can on use Eval in databound controls. how would I hide/show edit/delete links conditionally within repeater
You could simply use codebehind, for example in Page_Load:
protected void Page_Load(Object sender, EventArgs e)
{
if(!IsPostBack)
{
del.CommandArgument = comment.CommentId;
}
}
Maybe a better approach would be to use the Comments-collection(which seems to be a list or array of a custom class) as DataSource of a Repeater(or other web-databound control). Then you can add the LinkButtons to the Itemtemplate.
You can then either use ItemCreated or ItemDataBound events of the repeater in codebehind or inline ASP.NET tags to bind the CommandArgument.
For example:
CommandArguement='<%# DataBinder.Eval( Container.DataItem, "CommentId" ) %>'
What you are doing currently is not recommended and is highly error prone. You can easily achieve this with ASP.NET Repeater control like this:-
<asp:Repeater ID="MyRepeater" runat="server">
<ItemTemplate>
<asp:LinkButton ID="del" CommandArguement='<%# Eval("CommentId") %>'
OnCommand="del_Command" Text="Delete" runat="server" />
</ItemTemplate>
</asp:Repeater>
In Page_Load simply bind it:-
if (!Page.IsPostBack)
{
MyRepeater.DataSource = CommentsRepository();
MyRepeater.DataBind();
}
Or Else if you are have ASP.NET 4.5 then use strongly type Data Bound controls like this:-
<asp:Repeater ID="MyRepeater" runat="server" ItemType="MyNamespace.Comment"
SelectMethod="MyRepeater_GetData">
<ItemTemplate>
<asp:LinkButton ID="del" CommandArguement='<%# Item.CommentId %>'
OnCommand="del_Command" Text="Delete" runat="server" />
</ItemTemplate>
</asp:Repeater>
And you method in code behind should be something like this(just for Demo):-
public IEnumerable<MyNamespace.Comment> MyRepeater_GetData()
{
return new List<Comment>
{
new Comment { CommentId =1, Name= "foo"},
new Comment { CommentId =2, Name= "bar"},
};
}
<%
foreach (training t in traininglist)
{
%>
<tr>
<td><%=t.TrainingId%></td>
<td><%=t.TrainingName%></td>
<td>
<asp:LinkButton runat="server" ID="EditBtn"
Text="Edit" OnCommand="editbtn_OnCommand"
CommandArgument='<%# t.TrainingId %>' CommandName="edit" />
</td>
</tr>
<% } %>
where,
training is the class and traininglist is List<training> defined in Page_Load() function in codebehind.
I am trying to call the
public void editbtn_OnCommand(object sender, CommandEventArgs e)
{
String myeid = e.CommandArgument.ToString();
....
}
Here, myeid is not getting value but always shows <%# t.TrainingId %>
i have already tried all other options like <%: t.TrainingId %> or <%=t.TrainingId %>
The output of Tag "<%= %>" is more likely similar to use Response.Write in your code. so these tags are used to display the value to the response object.
That's why,as per my understanding, You can't used these tags to set commandargument property of controls unless you are using DataBinding. If you are using DataBinding then these tags "<%= %>" are used to set the property of controls.
Because you are here looping through each item in list on html table, my suggestion is to use GridView or Repeater and then Bind through your List Object. if you are using this way, you can get rid of unwanted formatting issues of html tables also.
Refer http://msdn.microsoft.com/en-us/library/6dwsdcf5(VS.71).aspx
If you want to use repeater then you can use these specific tags, and this should be your code(not actual code, just sample one)
<asp:Repeater id="myRepeater" runat="server" >
<ItemTemplate>
<div>
<asp:LinkButton runat="server" id="EditBtn" CommandName="edit"
CommandArgument="<%#Container.DataItem.TrainingId %>" Text="Edit"
OnCommand="editbtn_OnCommand" />
</div>
</ItemTemplate>
</asp:Repeater>
main page :
<%# Register TagPrefix="A" TagName="AA" Src="~/UserControls/ab.ascx" %>
<A:AA id="a1" runtat="server" />
<asp:Button ID="btn" Visible="true" runat="Server" OnClick="Btn_Click" OnClientClick="javascript:PreLoad();" />
<script type="text/javascript">
function PreLoad() {
var empty = '<%= (a1.FindControl("ddl")).ClientID %>';
// the above line giving error as 'ddl is inaccessible due to its protection level'
}
</script>
in Usercontrol page:
<%# ControlLanguage="C#" AutoEventWireup="true" CodeBehind="ab.ascx.cs" inherits="ab.ascx.designer.cs" %>
<asp:DropDownList ID="ddl" runat="server"> </asp:DropDownList>
in ab.ascx.designer.cs
protected global::System.Web.UI.WebControls.DropDownList ddl;
Someone please explain the clean and simple proper way to access the 'ddl' inside the 'PreLoad()'
javascript function?
Change your tag to:
<asp:DropDownList ID="ddl" runat="server" ClientIDMode="static"> </asp:DropDownList>
This means that the control is rendered using the exact ID that you specified.
Then change your javascript to use the exact id of the control and access it by:
document.getElementById("ddl");
Or with jQuery:
$("#ddl");
Ideally you should move this javascript code to an external file too.
Hi I found code similiar to the following online. It's seems really great for getting a button buried in a repeater control to trigger a full cycle back to the server.
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<%=DateTime.Now.ToString() %>
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="HiddenButton" />
</Triggers>
</asp:UpdatePanel>
<!--Make a hidden button to treat as the postback trigger-->
<asp:Button ID="HiddenButton" runat="server" Style="display: none" Text="HiddenButton" />
<asp:Repeater ID="Repeater1" runat="server" DataSourceID="SqlDataSource1">
<ItemTemplate>
<!--when cick the button1, it will fire the hiddenButton-->
<asp:Button ID="Button1" Text="Trigger" CommandArgument='<%# Eval("Id") %>' OnClientClick="$get('HiddenButton').click();return false;"
runat="server" />
</ItemTemplate>
</asp:Repeater>
It uses a hiddenButton to achieve this by hooking the click event of the original button to this one. However my addition to this was the setting of the CommandArgument for the button. I would also need it to be set for the HiddenButton.
Does anyone know a way of going about this?
First I will like to explain the Disadvantage of using the Update Panel using the very same example posted by you.
Below is the Original Code
Output
To display the 22 character string you can check how much data is being received and sent to server. Just imagine following
If you would consider send each request to Database using Update Panel and your GridView is in Update Panel!!!!!!
Suppose you would use ViewState data for each request and with GridView Inside the Update Panel.
Both the above techniques are worst as per my understanding.
Now I will describe you Page Methods
Page Method over Update panel
Page Methods allow ASP.NET AJAX pages to directly execute a Page’s Static Methods, using JSON (JavaScript Object Notation). Instead of posting back and then receiving HTML markup to completely replace our UpdatePanel’s contents, we can use a Web Method to request only the information that we’re interested.
Sample Code
Output
Hope this clearly explains the difference of usage.
Answer to the original Query
You have to register the ItemDataBound event of the below Repeater and use below code for it.
Code Behind
protected void Repeater1_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
if (e.Item.ItemType == ListItemType.Item ||
e.Item.ItemType == ListItemType.AlternatingItem)
{
Button btn = (Button)e.Item.FindControl("Button1");
btn.OnClientClick = string.Format("SubmitButton('{0}');return false;"
, HiddenButton.ClientID);
}
}
JavaScript
<script type="text/javascript">
function SubmitButton(btn)
{
$("#" + btn).click();
}
</script>
//Alternative
<script type="text/javascript">
function SubmitButton(btn)
{
document.getElementById(btn).click();
}
</script>
Reference & Here
Your HiddenButton control is a server control but you are trying to access it in JQuery using it's ASP.Net ID,
<asp:Button ID="Button1" Text="Trigger" CommandArgument='<%# Eval("Id") %>' OnClientClick="$get('**HiddenButton**').click();return false;"
runat="server" />
A quick way to fix it is to make a separate function,
<script type="text/javascript">
function SubmitButton(btn)
{
$get("#" . btn).click();
}
</script>
and change your button code to ,
<asp:Button ID="Button1" Text="Trigger" CommandArgument='<%# Eval("Id") %>'
runat="server" />
In code behind, in repeater's ItemDataBound event, find the button and HiddenControl and set Button1's OnClientClick property,
Button1.OnClientClick= string.Format("SubmitButton('{0}');return false;",HiddenButton.ClientID);
<asp:DataGrid>
<ItemTemplate>
1)
<asp:TextBox ID="tbComments" onChange="javascript:checkLength(<%# tbComments.ClientId %>);" runat="server"/>
2)
<span id="<%# tbComments.ClientId %>Label"></span>
</ItemTemplate>
</asp:DataGrid>
Any ideas to make the above working (which doesn't :P)?
Change your markup to pass "this" as a reference to the given comments box.
<asp:TextBox ID="tbComments"
onChange="javascript:checkLength(this);" runat="server"/>
Then in your checkLength() function, "e" is a direct reference to the DOM element that raised the onchange event.
function checkLength(e){
alert(e.id); //id of the comments box
//get a reference to the span element immediately after the textbox
theSpan = e.parentNode.getElementsByTagName("span")[0];
theSpan.innerHTML = "comments length: " + e.value.length;
}
Just add a class to the span or the textbox and use jQuery to find the element in the dom and add a change event to the textbox run the checkLength code
$(document).ready(function()
{
$('.myClass').change(function()
{
// do your length check...
});
});
Are you sure the problem isn't just the mispelling of "ClientId" in the following tag? :-)
<span id="<%# tbComments.CliendId %>Label"></span>
Is there something wrong with your JavaScript checkLength() function not appending Label to the Client ID? Then have your Javascript take both?:
<asp:DataGrid>
<ItemTemplate>
1)
<asp:TextBox ID="tbComments"
onChange="javascript:checkLength(<%# tbComments.ClientId %>, <%# tbComments.ClientId %>Label);"
runat="server"/>
2)
<span id="<%# tbComments.ClientId %>Label"></span>
</ItemTemplate>
</asp:DataGrid>