Questions on UI for ASP.NET AJAX Forum

2 answers

83 views

Root Item with No Child Item Border Issue

I have a RadMenu (with a custom skin - css code below) that has a root list with some of the root items having one level of child items. The issue that I have is that I have a border set to enclose the child items via a custom skin and it partially displays when you hover a root item that has no child items assigned to it (See attached images - NoChildItems.jpg and ChildItems.jpg). I changed the border color to red so that it would stand out during testing. Is there any way to rectify this or does the border have to be the same color as the root item background?

/* SVPD Menu / Simple> */

/* for root items */

div.RadMenu_SVPD ul.rmRootGroup

{

}

div.RadMenu_SVPD .rmLink

{

color: #ffffff;

padding-left: 15px;

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

font-weight: normal;

text-decoration: none;

height: 20px;

}

/* for hover, focused, expanded items */

div.RadMenu_SVPD .rmItem .rmLink:hover

{

color: #91c8ff;

cursor: pointer;

}

div.RadMenu_SVPD .rmItem .rmFocused,

div.RadMenu_SVPD .rmItem .rmSelected,

div.RadMenu_SVPD .rmItem .rmExpanded

{

}

/*for subitems */

div.RadMenu_SVPD .rmGroup

{

padding-top: 4px !important;

border: 1px solid #ff0000;

background: #003c77 url('Menu/rmVSprite.png') repeat-y;

}

div.RadMenu_SVPD .rmGroup .rmLink

{

color: #ffffff;

padding-right: 0px !important;

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

font-weight: normal;

text-decoration: none;

float: left;

}

div.RadMenu_SVPD .rmGroup .rmText

{

Padding-left: 10px !important;

}

/* for hover, focused, expanded items */

div.RadMenu_SVPD .rmGroup .rmItem .rmLink:hover

{

color: #91c8ff;

cursor: pointer;

}

div.RadMenu_SVPD .rmGroup .rmItem .rmFocused,

div.RadMenu_SVPD .rmGroup .rmItem .rmSelected,

div.RadMenu_SVPD .rmGroup .rmItem .rmExpanded

{

}

Menu

answered on 26 Jan 2011

4 answers

360 views

Select Only One Child Node

Hello Sir,

I am Using RadTree.

My requirement is like I want only select one child node in tree in backend side.

Please Give me proper solution.

Thanks.

Kishor Dalwadi

TreeView

answered on 26 Jan 2011

1 answer

151 views

Radcaptcha on ajax page

I have some ajax stuff on the page- fill one dropdown based on another dropdown's selection.
I also used Radcaptcha, when submit the page, the page alway not valid, unless putting the radcaptcha inside the UpdatePanel .

<asp:UpdatePanel ID="UpdatePanel7" runat="server">
<ContentTemplate>
<telerik:RadCaptcha ID="RadCaptcha1" Runat="server" ValidationGroup="Group"
ErrorMessage="Page not valid. The code you entered is not valid.Page not valid. The code you entered is not valid"
ImageStorageLocation="Session">
</telerik:RadCaptcha>
</ContentTemplate>
</asp:UpdatePanel>

This will solve page not valid problem, but everytime when the ajax fired (first dropdown is selected), the Radcaptcha's text got changed. Is there anyway that can prevent the Radcaptcha text changing everytime when the ajax fired?

Thanks

Captcha

answered on 26 Jan 2011

3 answers

97 views

Javascript Not Registering in Ajaxified Grid

Hi,

I have a RadGrid with a template column that uses a user control in the Edit Template. The user control tries to Register a script to run that has a function in it that will be called when the user clicks on the user control. However the function is not properly registered and cannot be called by the user control.

If I remove the RadGrid from the RadAjaxManager everything works fine.

Here is a link to a sample project (zipped) that demonstrates my problem: sample project.

I have looked around on the forums and tried some of the other suggestions to no avail.

Can you please suggest a workaround for this?

Thanks,
Oran

Ajax

answered on 26 Jan 2011

1 answer

84 views

self-referencing hierarchy: binding data on client object

Hi,
I have created a RadGrid with self-referencing hierarchy without a problem. But as we are having some performance issues I don't have the luxure to send/receive big page sizes each time. So I send the grid empty without binding the data on needDataSource event. Then I get the data with ajax in json format which is quite small. The problem is I cannot find a client side event, which formats the data with the given hierarchical structure. Is there a way for that or do I need to write a custom javascript function to create that structure?

Where should I assign the filter expression on client side, which I do on server side like t.MasterTableView.FilterExpression = @"it[""PARENT""] = Convert.DBNull";

Given code creates the grid and binds the data but without a structure.

Thanks in advance,

Cem

<telerik:RadGrid ID="t" runat="server" AutoGenerateColumns="false" AllowPaging="True"

HierarchyDefaultExpanded="false" HierarchyLoadMode="Client" AllowSorting="True"

PageSize="10">

<mastertableview datakeynames="CHILD,PARENT">

<SelfHierarchySettings ParentKeyName="PARENT" KeyName="CHILD" />

<Columns>

<telerik:GridBoundColumn DataField="CHILD" HeaderText="CHILD" >

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="PARENT" HeaderText="PARENT" >

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="AMOUNT" HeaderText="AMOUNT" >

</telerik:GridBoundColumn>

</Columns>

</mastertableview>

<clientsettings allowexpandcollapse="true" selecting-allowrowselect="true" enablerowhoverstyle="false">

<Scrolling AllowScroll="True" ScrollHeight="400px" UseStaticHeaders="True" />

</clientsettings>

</telerik:RadGrid>

Sys.Application.add_init(function() {

var grid = $find("<%=t.ClientID%>");

var tableView = grid.get_masterTableView();

var id = grid.get_element().id;

var objData = {

id: id,

startIndex: tableView.get_currentPageIndex(),

pageSize: tableView.get_pageSize(),

};

$.ajax({

type: "POST",

url: url,

data: Sys.Serialization.JavaScriptSerializer.serialize({ data: objData }),

contentType: "application/json; charset=utf-8",

success: function(arg) {

//create an array with coming data and assign it

tableView.set_dataSource(arr);

tableView.dataBind();

},

before: function() {

},

error: function() {

}

});

Grid

answered on 26 Jan 2011

1 answer

82 views

Inconsistent Filter

I have a grid with a column for country and type along with many others.

By default the grid is ordered by country. When I click the letters in the pager at the bottom of the grid, it filters the country correctly.

Then I add a filter to the grid for type. Then I hide the filter and click the letters in the pager at the bottom of the grid. At sporadic times, it will still be filtered by type. Other times it will be filtered by country. What is happening here?

Grid

answered on 26 Jan 2011

1 answer

228 views

Access control inside RadDock from javascript

Hello! I has faced such problem. I try to get access to control being inside RadDock using JavaScript. I do it as follows...

<script type="text/javascript">

var test = $find("<%=RadDock1.ContentContainer.FindControl("val1").ClientID %>");

</script>

<telerik:RadDock ID="RadDock1" runat="server" Width="300px">
        <ContentTemplate>

        <telerik:RadTextBox ID="val1" runat="server">
        </telerik:RadTextBox>

</ContentTemplate>
</telerik:RadDock>

When page generated, i cannot get access to control, and its "null" because if look html code i see the following...

<span id="RadDock1_C_val1_wrapper" class="RadInput RadInput_Default" style="white-space:nowrap;">
<input type="text" size="20" id="RadDock1_C_val1_text" name="RadDock1_C_val1_text" class="riTextBox riEnabled" style="width:125px;" />
<input id="RadDock1_C_val1" name="RadDock1$C$val1" class="rdfd_" style="visibility:hidden;margin:-18px 0 0 -1px;width:1px;height:1px;overflow:hidden;border:0;padding:0;" type="text" value="" />
<input id="RadDock1_C_val1_ClientState" name="RadDock1_C_val1_ClientState" type="hidden" /></span>

And my javascript code - var test = $find("<%=RadDock1.ContentContainer.FindControl("val1").ClientID %>");
find this control - RadDock1_C_val1 but it is null. How can i get access to this control - RadDock1_C_val1_text ??? what i do not so??

Thanks!

Dock

answered on 26 Jan 2011

3 answers

55 views

Hierarchy Grid Master Table with Image Column

Hi,

I have a Web Service that will provide an image. How can I call the web service using ajax to get the image for this one column. Are there any examples for this.

Thanks

Grid

answered on 26 Jan 2011

1 answer

146 views

RadGrid GroupBy Columns and Sorting

I am having the hardest time accomplishing what should be a simple task.

I have a series of contracts with start and end dates, a contract number and a customer's name. I would like to Group By the contract number and display the contract number, end date and customer's name. I would like each field to be displayed in the same column as the sub table. How do I do this?

I would also like sorting to be applied to the Group By items. Any ideas?

Grid

answered on 26 Jan 2011

3 answers

183 views

combobox in radgrid

Hi,
I found a problem on the radcombobox on my radgrid. If I selected couple of values from the combobox by using autocomplete separator & click update, it didn't work at all. If I selected only one value from the combobox, it could be updated properly on the table on my sql database.
Can any of you tell me what is wrong ?

<%@ Page Language="VB" %>
<%@ Register assembly="Telerik.Web.UI" namespace="Telerik.Web.UI" tagprefix="telerik" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

</script>

         </telerik:RadAjaxLoadingPanel>


        <br />
        <br />
        <telerik:RadComboBox ID="RadComboBox1" Runat="server"
            DataSourceID="SqlDataSource3" DataTextField="F5" DataValueField="F5"
            Height="20px" MaxHeight="500px" Width="412px" AutoPostBack="True"
            Skin="WebBlue" AppendDataBoundItems="True">
            <Items>
            <telerik:RadComboBoxItem value="0", Text="Please select your name..." />
            </Items>
        </telerik:RadComboBox>
        <asp:SqlDataSource ID="SqlDataSource3" runat="server"
            ConnectionString="<%$ ConnectionStrings:usagelogConnectionString %>"
            SelectCommand="SELECT DISTINCT F5 FROM OriginalReport"></asp:SqlDataSource>
        <br />
        <br />




    <telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource1"
                    GridLines="None" Skin="WebBlue" AllowAutomaticDeletes="True" AllowAutomaticInserts="True" AllowAutomaticUpdates="True" >
<HeaderContextMenu CssClass="GridContextMenu GridContextMenu_WebBlue"></HeaderContextMenu>

<ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column"></ExpandCollapseColumn>
                        <Columns>
                         <telerik:GridEditCommandColumn ButtonType="ImageButton" HeaderText="Edit" >
                              <HeaderStyle Width="10px" />
                            </telerik:GridEditCommandColumn>
                            <telerik:GridBoundColumn DataField="F1" DataType="System.Int32" HeaderText="ID#"
                                ReadOnly="True" SortExpression="F1" UniqueName="F1"
                                FilterControlAltText="Filter F1 column">
                            </telerik:GridBoundColumn>
                            <telerik:GridDateTimeColumn DataField="F2"
                                FilterControlAltText="Filter F2 column" HeaderText="Publication Date"
                                UniqueName="F2">
                            </telerik:GridDateTimeColumn>
                            <telerik:GridBoundColumn DataField="F3" HeaderText="DocID" SortExpression="F3"
                                UniqueName="F3" FilterControlAltText="Filter F3 column">
                            </telerik:GridBoundColumn>
                            <telerik:GridHTMLEditorColumn DataField="F4"
                                FilterControlAltText="Filter F4 column" HeaderText="Report Title"
                                UniqueName="F4">
                            </telerik:GridHTMLEditorColumn>
                            <telerik:GridBoundColumn DataField="F5" FilterControlAltText="Filter F5 column"
                                HeaderText="Written by..." SortExpression="F5" UniqueName="F5">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn DataField="F6" FilterControlAltText="Filter F6 column"
                                HeaderText="Written by..." SortExpression="F6" UniqueName="F6">
                            </telerik:GridBoundColumn>
                            <telerik:GridDropDownColumn DataField="F7" DataSourceID="SqlDataSource5"
                                FilterControlAltText="Filter F7 column" HeaderText="Content Type"
                                ListTextField="F1" ListValueField="F1" UniqueName="F7">
                            </telerik:GridDropDownColumn>
                            <telerik:GridDropDownColumn DataField="F8" DataSourceID="SqlDataSource4"
                                FilterControlAltText="Filter F8 column" HeaderText="Industry"
                                ListTextField="F1" ListValueField="F1" UniqueName="F8">
                            </telerik:GridDropDownColumn>
                            <telerik:GridTemplateColumn DataField="F9"
                                FilterControlAltText="Filter F9 column" HeaderText="Global Vendor"
                                UniqueName="F9">
                                <EditItemTemplate>
                                    <telerik:RadComboBox ID="F9RadComboBox" runat="server" AllowCustomText="True"
                                        AutoCompleteSeparator=";" DataSourceID="SqlDataSource2" DataTextField="F1"
                                        DataValueField="F1" Height="19px" MarkFirstMatch="True"
                                        SelectedValue='<%# Bind("F9") %>' Width="504px" MaxHeight="500px" >
                                    </telerik:RadComboBox>
                                </EditItemTemplate>
                                <ItemTemplate>
                                    <asp:Label ID="F9Label" runat="server" Text='<%# Eval("F9") %>'></asp:Label>
                                </ItemTemplate>
                            </telerik:GridTemplateColumn>
                            <telerik:GridBoundColumn DataField="F10" FilterControlAltText="Filter F10 column"
                                HeaderText="Vendor manual input" SortExpression="F10" UniqueName="F10">
                            </telerik:GridBoundColumn>
                        </Columns>
                        <EditFormSettings>
                            <EditColumn UniqueName="EditCommandColumn1" >
                            </EditColumn>
                        </EditFormSettings>
                        <CommandItemSettings ShowExportToCsvButton="True" ShowExportToExcelButton="True"
                            ShowExportToPdfButton="True" ShowExportToWordButton="True" />
                    </MasterTableView>

                <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:usagelogConnectionString %>"
                    DeleteCommand="DELETE FROM [OriginalReport] WHERE [F1] = @F1"
                    InsertCommand="INSERT INTO [OriginalReport] ([F2], [F3], [F4], [F5], [F6], [F7], [F8], [F9], [F10]) VALUES (@F2, @F3, @F4, @F5, @F6, @F7, @F8, @F9, @F10)"
                    SelectCommand="SELECT [F1], [F2], [F3], [F4], [F5], [F6], [F7], [F8], [F9], [F10] FROM [OriginalReport] WHERE ([F5] = @F5)"


            UpdateCommand="UPDATE [OriginalReport] SET [F2] = @F2, [F3] = @F3, [F4] = @F4, [F5] = @F5, [F6] = @F6, [F7] = @F7, [F8] = @F8, [F9] = @F9, [F10] = @F10 WHERE [F1] = @F1">
                    <SelectParameters>
                        <asp:ControlParameter ControlID="RadComboBox1" Name="F5"
                            PropertyName="SelectedValue" Type="String" />
                    </SelectParameters>
                    <DeleteParameters>
                        <asp:Parameter Name="F1" Type="Int32" />
                    </DeleteParameters>
                    <UpdateParameters>
                        <asp:Parameter Name="F2" Type="DateTime" />
                        <asp:Parameter Name="F3" Type="String" />
                        <asp:Parameter Name="F4" Type="String" />
                        <asp:Parameter Name="F5" Type="String" />
                        <asp:Parameter Name="F6" Type="String" />
                        <asp:Parameter Name="F7" Type="String" />
                        <asp:Parameter Name="F8" Type="String" />
                        <asp:Parameter Name="F9" Type="String" />
                        <asp:Parameter Name="F10" Type="String" />
                        <asp:Parameter Name="F1" Type="Int32" />
                    </UpdateParameters>
                    <InsertParameters>
                        <asp:Parameter Name="F2" Type="DateTime" />
                        <asp:Parameter Name="F3" Type="String" />
                        <asp:Parameter Name="F4" Type="String" />
                        <asp:Parameter Name="F5" Type="String" />
                        <asp:Parameter Name="F6" Type="String" />
                        <asp:Parameter Name="F7" Type="String" />
                        <asp:Parameter Name="F8" Type="String" />
                        <asp:Parameter Name="F9" Type="String" />
                        <asp:Parameter Name="F10" Type="String" />
                    </InsertParameters>
                </asp:SqlDataSource>

    </div>
    <asp:SqlDataSource ID="SqlDataSource2" runat="server"
        ConnectionString="<%$ ConnectionStrings:usagelogConnectionString %>"
        SelectCommand="SELECT * FROM [Vendors] ORDER BY [F1]"></asp:SqlDataSource>
    <asp:SqlDataSource ID="SqlDataSource4" runat="server"
        ConnectionString="<%$ ConnectionStrings:usagelogConnectionString %>"
        SelectCommand="SELECT * FROM [Industry] ORDER BY [F1]"></asp:SqlDataSource>
    <asp:SqlDataSource ID="SqlDataSource5" runat="server"
        ConnectionString="<%$ ConnectionStrings:usagelogConnectionString %>"
        SelectCommand="SELECT * FROM [contenttype] ORDER BY [F1]">
    </asp:SqlDataSource>
    </form>
</body>
</html>

Grid

answered on 26 Jan 2011