Slider in a gridview?

[niallhannon]

When I put the slider into an asp.net 2.0 gridview it doesnt seem to render correctly.

Is this a known issue?

[Petio Petkov]

Hi niallhannon,

We tried to reproduce this problem on our side but to no avail. We used the following code:

  <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="ID"
            DataSourceID="SqlDataSource1" EmptyDataText="There are no data records to display.">
            <Columns>
                <asp:CommandField ShowEditButton="True" />
                <asp:BoundField DataField="ID" HeaderText="ID" ReadOnly="True" SortExpression="ID" />
                 <asp:TemplateField>
                    <EditItemTemplate>
   <telerik:RadSlider ID="RadSlider1" runat="server" />
                    </EditItemTemplate>
                </asp:TemplateField>
            </Columns>
                    </asp:GridView>

Could you please open a new support ticket and send us a simple running project where we can reproduce this problem. Once we recieve it we will do our best to help you.



Greetings,
Petio Petkov
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[niallhannon]

Try this code...note there are calls to BIND functions so you should create a dummy recordset for the databinding....

<form id="form1" runat="server">

<asp:ScriptManager ID="scriptmanager" runat="server" EnablePartialRendering="true" />

<

asp:GridView id="dgQuestions1" runat="server" ForeColor="Black" Font-Size="9pt" Font-Names="Verdana" Width="99%" BorderWidth="1px" BorderStyle="Solid" BorderColor="Silver" BackColor="White" PageSize="12" AllowPaging="false" AutoGenerateColumns="False" EmptyDataText="No Questions Found." AllowSorting="false" CellPadding="2">

<

FooterStyle BackColor="Gainsboro" ForeColor="#000066" Font-Size="7pt" Font-Names="verdana"></FooterStyle>

<

EmptyDataRowStyle BackColor="WhiteSmoke" Font-Size="7pt" Font-Names="Verdana" Font-Overline="False"></EmptyDataRowStyle>

<

Columns>

<

asp:TemplateField Visible="False">

<

ItemStyle HorizontalAlign="Left"></ItemStyle>

<

ItemTemplate>

<asp:Label ID="lblQuestionID" runat="server" Text='<%# Bind("QuestionID") %>'></asp:Label>

</

ItemTemplate>

</

asp:TemplateField>

<

asp:TemplateField>

<

ItemStyle HorizontalAlign="Left" VerticalAlign="Top"></ItemStyle>

<

HeaderStyle BackColor="SteelBlue" HorizontalAlign="Center"></HeaderStyle>

<

ItemTemplate>

<

asp:Label id="lblQuestionDisplayNumber" runat="server" Text='<%# Bind("DisplayNumber") %>' ></asp:Label>

</

ItemTemplate>

</

asp:TemplateField>

<

asp:TemplateField HeaderText="">

<

ItemStyle HorizontalAlign="left" VerticalAlign="Top"></ItemStyle>

<

HeaderStyle BackColor="SteelBlue" HorizontalAlign="Left"></HeaderStyle>

<

ItemTemplate>

<asp:Label ID="lblQuestionTitle" ForeColor="Maroon" runat="server" Text='<%# Bind("QuestionTitle") %>'></asp:Label>

</

ItemTemplate>

</

asp:TemplateField>

<

asp:TemplateField HeaderText="What was Achieved">

<

ItemStyle HorizontalAlign="Left" VerticalAlign="Top"></ItemStyle>

<

HeaderStyle BackColor="SteelBlue" HorizontalAlign="Left"></HeaderStyle>

<

ItemTemplate>

<asp:Label ID="lblQuestion" runat="server" Text='<%# Bind("Question") %>'></asp:Label>

</

ItemTemplate>

</

asp:TemplateField>

<

asp:TemplateField HeaderText="Employee Rating">

<

ItemStyle Width="165px" HorizontalAlign="Right" VerticalAlign="Top"></ItemStyle>

<

HeaderStyle BackColor="SteelBlue" HorizontalAlign="Center"></HeaderStyle>

<

ItemTemplate>

<telerik:RadSlider id="rad1" runat="server"

Value='<%# Bind("reviewerans") %>'

Length="165"

MaximumValue="100"

MinimumValue="1"

AnimationDuration="400"

/>

</

ItemTemplate>

<

FooterStyle HorizontalAlign="Right"></FooterStyle>

</

asp:TemplateField>

<

asp:TemplateField>

<

ItemStyle Width="5px" HorizontalAlign="Left"></ItemStyle>

<

HeaderStyle BackColor="SteelBlue" HorizontalAlign="Center"></HeaderStyle>

<

ItemTemplate>

</

ItemTemplate>

</

asp:TemplateField>

<

asp:TemplateField HeaderText="Reviewer Rating">

<

ItemStyle Width="165px" HorizontalAlign="Right" VerticalAlign="Top"></ItemStyle>

<

HeaderStyle BackColor="SteelBlue" HorizontalAlign="Center"></HeaderStyle>

<

ItemTemplate>

</

ItemTemplate>

<

FooterStyle HorizontalAlign="Right"></FooterStyle>

</

asp:TemplateField>

</

Columns>

<

RowStyle ForeColor="Black" Font-Size="7pt" Font-Names="Verdana"></RowStyle>

<

SelectedRowStyle BackColor="#669999" ForeColor="White" Font-Bold="True"></SelectedRowStyle>

<

PagerStyle BackColor="Gainsboro" Height="0px" ForeColor="#000066" HorizontalAlign="Left" Font-Size="7pt" Font-Names="Verdana"></PagerStyle>

<

HeaderStyle BackColor="Gray" ForeColor="White" HorizontalAlign="Left" Font-Size="7pt" Font-Names="Verdana" Font-Overline="False" Font-Bold="True"></HeaderStyle>

</

asp:GridView>

</form>

[Dave Wolf]

I am having this same issue.  I am using a multipage control with two different page views.  On page load I just want the first page to load but if a button is clicked I do a ajax callback to render the second pageview which has a gridview with a slider control in each row.  If I do it this way then all the sliders don't render correctly.  However if i load both page views on page load then it looks fine.

[Ubong]

Hello Everyone,

Niall, you need to set the following style for the slider control to fix this in IE6 and your'e set:

 <style type="text/css">
    .horizontal .selectedregion{left:0}  //for horizontal slider
    .vertical .selectedregion{top:0}   //for vertical slider if used
 </style>

Dave,

Could you please open a new support ticket and send us your sample running application for us to take a good a look at this? It would go a long way towards solving any other potential issues.

Best Wishes,
Ubong
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center