commandfield put title attribute on images button - asp.net

Is possible to set the title attibute on the image buttons of a commandfield?
<asp:CommandField ShowDeleteButton="True" ButtonType="Image" ShowEditButton="True"
DeleteImageUrl="images/BPAnn.gif" EditImageUrl="images/edit.gif" DeleteText="Elimina" EditText="Modifica"
UpdateImageUrl="images/apply.gif" CancelImageUrl="images/undo.gif" />

When you say Title do you mean HeaderText???
<asp:CommandField ShowEditButton="True" HeaderText="Testing" />

If You want Tooltip my suggestion is to convert CommandField to TemplateField.
In Template field you have more options available.

In case someone needs this you can do this for any command. Here it is done for the delete:
<asp:CommandField DeleteText="<i aria-hidden='true' title='Delete Role' class='glyphicon glyphicon-trash'>" ShowDeleteButton="True"/>

Related

populate label with control id

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="audition_ID" DataSourceID="ObjectDataSource10" AllowPaging="True" AllowSorting="True">
<Columns>
<asp:BoundField DataField="audition_ID" HeaderText="audition_ID" InsertVisible="False" ReadOnly="True" SortExpression="audition_ID" />
<asp:BoundField DataField="audition_date" HeaderText="audition_date" SortExpression="audition_date" />
<asp:BoundField DataField="ins_ID" HeaderText="ins_ID" SortExpression="ins_ID" />
<asp:BoundField DataField="insturment_name" HeaderText="insturment_name" SortExpression="insturment_name" />
<asp:BoundField DataField="audition_status" HeaderText="audition_status" SortExpression="audition_status" />
<asp:BoundField DataField="audition_location" HeaderText="audition_location" SortExpression="audition_location" />
<asp:BoundField DataField="audition_time" HeaderText="audition_time" SortExpression="audition_time" />
<asp:HyperLinkField DataNavigateUrlFields="audition_ID" DataNavigateUrlFormatString="judgescores.aspx?auditionID={0}" HeaderText="Details" Text="Details" />
</Columns>
</asp:GridView>
I am using a grid view to display information for a database based on the selection in a drop down list. I have that working and when selecting the DDL- the grid view updates and shows the associated records.
I then added a "Details" hyperlink column that directs to the details.aspx page and picks up the ID so it shows the correct details associated with that record.
DataNavigateURLFormat = details.aspx?ID={0}
I can see the ID in the URL od this details page. What I am trying to do now is take that ID and populate it in a label on the details page.
I am exploring the "Expression" property in the Data section of the label properties- but have not found any luck using "AccessControlID" or "ClientIDMode" giving it a "RouteValue".
I was also exploring going in the code of the details page (details.aspx.vb)
and doing something like
lbldetail.Text = #ID
But not sure if that would work.
Any help would be greatly appreciated.
Contents of judgescores.aspx.vb page...
Partial Class Judges_judgescores
Inherits System.Web.UI.Page
Sub Page_Load()
lblCurrentAudition.Text = Request.QueryString[audition_ID]
End Sub

ASP.NET Gridview tablesorter with fixed header

I have an asp.net 4.5 web app, where I generate a gridview with about 40-50 columns and rows vary between 1 and a few thousands.
Since it's so big, I put the gridview in a div, set a height and the overflow-y:scroll.
What I want is to be able to see the header when I scroll.
I tried to find answers online. First solution was to give the header a CSS class and set the position:absolute, thus popping out the header. The problem with this approach was that when the header pops out, it covers the first row and unless I set the height of row huge, I can't see the first row.
I tried making only the first row's height bigger and setting the vertical-align to bottom. This worked very nice. The problem is that I have implemented jQuery tablesort on the header. When I sorted the table, the first row that has a huge height, gets buried and the rest of the rows scramble because they are being offset by that huge row.
I searched on Stack Overflow and I found another thread about the same problem: How Can We Have A SCROLLABLE GridView With Fixed Header?
Here it suggested creating another table for the header. This is very nice, but the problem here is that I don't have a fixed size table. The columns nr vary and the rows value vary. So I made another gridview above the main one. I set the ShowHeaderWhenEmpty=true. I added the columns in the code behind. The problem now is that the columns are not the same width as the original gridview.
I tried to set the width in OnRowDataBound. I tried with jQuery. Nothing works. The only thing that works is if I add the data of the original gridview and hide the rows. But can I hide them ? If I use display:none, the header width goes back like it doesn't even see the data. I managed to hide the rows with opacity:0.0
The problem here is that the page takes a long time to load, it's very slow and it doesn't even render properly.
So instead of adding all the data, I tried adding a single row. In this row, for each cell, I added the longest string on that column. This method worked the best, but the problem now is that some of the columns in the second gridview are not aligned with the original gridview.
Why? My best guess is that some cells have wrap enabled and when that longest string wraps, it doesn't wrap the same as other rows which might affect the column's width.
What can I try next?
Update
So I was thinking, since I'm already using the jQuery tablesorter plugin, I could try to use the widget-scroller to have the header fixed.
I found this page: https://mottie.github.io/tablesorter/docs/example-widget-scroller.html, but I haven't managed to enable the scroller.
Current tablesorter version: TableSorter (FORK) v2.28.15
My code is this:
HTML
<div id="wrapper">
<asp:GridView ID="OnlineSearchGridView" runat="server" CssClass="tablesorter hover-highlight tablesorter-scroller tablesorter-scroller-table" Visible="false" EnableSortingAndPagingCallbacks="false" AutoGenerateColumns="true" OnRowDataBound="OnlineSearchGridView_RowDataBound" Height="50px" CellPadding="5" Font-Names="Arial" Font-Size="9pt">
<EditRowStyle Font-Names="Arial" Font-Size="9pt" />
<HeaderStyle BackColor="#666666" BorderColor="Black" Font-Names="Arial" Font-Size="9pt" ForeColor="White"/>
<RowStyle BorderStyle="Solid" Font-Names="Arial" Font-Size="9pt" BorderColor="Black" BorderWidth="1px" HorizontalAlign="Center"/>
</asp:GridView>
</div>
JS
jQuery.fn.insertTHead = function (selection)
{
return this.each(function ()
{
if (jQuery('thead', this).length == 0)
jQuery("<thead></thead>").prependTo(this).append(jQuery(selection, this))
})
}
$(document).ready(function ()
{
$("table")
.insertTHead("tr:first")//Calling the jquery function that will insert the thead after postback.
.tablesorter({
widgets: ['scroller'],
widgetOptions:
{
scroller_height: 300,
scroller_upAfterSort: true,
scroller_jumpToHeader: true,
scroller_barWidth: null
}
})
});
External files
<link rel="stylesheet" type="text/css" href="css/tablesort_style.css"/>
<script type="text/javascript" src="Scripts/jquery-latest.js"></script>
<script type="text/javascript" src="Scripts/jquery.tablesorter.js"></script>
<script type="text/javascript" src="Scripts/jquery.tablesorter.widgets.js"></script>
What is wrong with this picture? Why isn't the scroller active?
I'm thinking because griview doesn't have colgroups? Do I need to append them just like I'm doing with the thead?
My solution was using ScrollableTablePlugin addon:
<script src="js/ScrollableTablePlugin_1.0_min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$('#<%=GridView1_resize.ClientID%>').Scrollable({
ScrollHeight: 600
});
});
GridView1_resize is quite a normal GridView:
<asp:GridView ID="GridView1_resize" runat="server" AutoGenerateColumns="False"
CellPadding="0" DataSourceID="ObjectDataSource1" EnableTheming="false"
EmptyDataText="Nessun rapportino" CssClass="presenzeCol">
<Columns>
<asp:BoundField DataField="Nome"
HeaderText="Cognome e Nome" SortExpression="Nome">
</asp:BoundField>
<asp:BoundField DataField="Matricola" HeaderText="Matr."
SortExpression="Matricola">
</asp:BoundField>
<asp:BoundField DataField="Email">
</asp:BoundField>
<asp:BoundField DataField="G1" HeaderText="1" DataFormatString="{0:f}">
</asp:BoundField>
<asp:BoundField DataField="G2" HeaderText="2" DataFormatString="{0:f}">
</asp:BoundField>
<asp:BoundField DataField="G3" HeaderText="3" DataFormatString="{0:f}">
</asp:BoundField>
<asp:BoundField DataField="G4" HeaderText=" 4" DataFormatString="{0:f}">
</asp:BoundField>
<asp:BoundField DataField="G5" HeaderText="5" DataFormatString="{0:f}">
</asp:BoundField>
<asp:BoundField DataField="G6" HeaderText="6" DataFormatString="{0:f}">
</asp:BoundField>
<asp:BoundField DataField="G7" HeaderText="7" DataFormatString="{0:f}">
</asp:BoundField>
<asp:BoundField DataField="G8" HeaderText="8" DataFormatString="{0:f}">
</asp:BoundField>
<asp:BoundField DataField="G9" HeaderText="9" DataFormatString="{0:f}">
</asp:BoundField>
<asp:BoundField DataField="G10" HeaderText="10" DataFormatString="{0:f}">
</asp:BoundField>
<asp:BoundField DataField="G11" HeaderText="11" DataFormatString="{0:f}">
</asp:BoundField>
<asp:BoundField DataField="G12" HeaderText="12" DataFormatString="{0:f}">
</asp:BoundField>
</Columns>
</asp:GridView>

how to get the link of hyperlinkfield in gridview

so i have a grid view like this :
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="VideoID" DataSourceID="SqlDataSource1">
<Columns>
<asp:BoundField DataField="VideoID" HeaderText="VideoID" ReadOnly="True" InsertVisible="False" SortExpression="VideoID" Visible="false"></asp:BoundField>
<asp:BoundField DataField="VideoEpisodeNumber" HeaderText="Episode" SortExpression="VideoEpisodeNumber"></asp:BoundField>
<asp:HyperLinkField DataTextField="VideoUrl" HeaderText="Video Url" DataTextFormatString="Link"/>
<asp:BoundField DataField="VideoDescription" HeaderText="VideoDescription" SortExpression="VideoDescription"></asp:BoundField>
</Columns>
</asp:GridView>
the hyperlinkfield is supposed to have the video links! how can i retrieve that link when a user click on it?
thank you in advance
You can try this:
<asp:HyperLinkField DataTextField="VideoUrl" HeaderText="Video Url" DataTextFormatString="Link" onclick="javascript:GetURL(this);"/>
function GetURL(sender) {
//Possibly sender should contain the object.
//if not
var parent = $find(sender.id);
var linkURL = parent.innerHTML;
}
When you are propagating DataNavigationUrlFields the href attribute will be set. Then you should be able to intercept the navigation to the corresponding video url (assuming that resolving the url on the client is what you are looking for)
Gridview
<asp:HyperLinkField DataTextField="VideoUrl" HeaderText="Video Url" NavigateUrl="http://wwww.youtube.com" />
Javascript (jquery)
$(function () {
$("#myGridviewId a").on("click", interceptNavigation);
});
function interceptNavigation() {
alert($(this).attr("href"));
}

gridview column boundfield error

Inside GridView, then inside columns I have a bound field
<asp:BoundField DataField="Company Name" HeaderText="Company Name" SortExpression="Name" />
This displays a list of columns of the companys name (which is fine) however the headerText, is a clickable link that throws an error...how can i get the headertext just to display as a normal plan unclickable label
ta
You can use AllowSorting="False" to the gridview.
<asp:GridView AllowSorting="False">
<asp:BoundField DataField="Company Name" HeaderText="Company Name"/>
</asp:GridView>
Probably because you marked the bound field to be sortable and you didn't implement the sort on the server side... probably. Remove the SortExpression and see what's happening. You should post more info starting with the exception you have.
just remove the SortExpression

ASP.NET GridView CommandField Update/Cancel does not wrap

My question is on the ASP.NET GridView control. I am using a CommandField in the Columns tag as seen below.
<asp:CommandField ShowEditButton="True" HeaderStyle-Width="40px" UpdateText="Save" ButtonType="Link" HeaderStyle-Wrap="true" ItemStyle-Wrap="true" ItemStyle-Width="40px"/>
What renders is the shown in the following image (after I click on the Edit button).
As you can see I am trying to have the Cancel link show up a new line and my question is how do you do what? If I change the ButtonType="Link" to ButtonType="Button", I get it rendering correctly as shown below.
alt text http://i38.tinypic.com/2pqopxi.jpg
I've tried Google already and maybe I'm not searching on the right tags but I couldn't see this one addressed before.
If you use a template field it will give you complete control over the look of your page, but it requires that you use the CommandName and possible CommandArgument properties, and also using the GridView's OnRowCommand.
The aspx page:
<asp:GridView id="gvGrid" runat="server" OnRowCommand="gvGrid_Command">
<Columns>
<asp:TemplateField>
<ItemTemplate>
Some Stuff random content
<br />
<asp:LinkButton id="lbDoIt" runat="server" CommandName="Cancel" CommandArgument="SomeIdentifierIfNecessary" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
The code behind:
protected void gvGrid_Command(object sender, GridViewCommandEventArgs e)
{
if(e.CommandName=="Cancel")
{
// Do your cancel stuff here.
}
}
Don't use a command field, use a TemplateField and put your command button in that with a line break (br) before it like you want.

Resources