This is a migrated thread and some comments may be shown as answers.

RadListView findcontrol Javascript

1 Answer 87 Views
ListView
This is a migrated thread and some comments may be shown as answers.
Adam
Top achievements
Rank 1
Adam asked on 21 Dec 2011, 12:15 AM
Hello,
I have RadEditor and a Table within a RadListView.
When someone clicks on one of the cells in the Table, I want to paste text from the cell into the RadEditor.
I have the functionality working when the RadEditor is not within a RadListView, but I am not sure how to make it work within the RadListView.

Here is the code for the RadEditor when it is not in the RadListView -

                        <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
                            <script type="text/javascript">
                                $(document).ready(function ()
                                {
                                    $('.clickMe').each(function ()
                                    {
                                        $(this).attr("unselectable", "on");
                                        $(this).click(function ()
                                        {
                                            var editor = $find("<%=reKeyLink.ClientID%>");
                                            editor.pasteHtml($(this).text());
                                        });
                                    });
                                });
                            </script>
                        </telerik:RadScriptBlock>
 
-------------------------------------------------------------------------------
 
                        <div style="clear: left; margin-top: 15px; width:825px">
                            <div style="float:left;">
                                <telerik:RadEditor ID="reKeyLink" runat="server" Skin="Windows7" ViewStateMode="Disabled"
                                    ToolsFile="~/App_Themes/public/ToolsLimited.xml" Height="235px" Width="625px">
                                </telerik:RadEditor>
                            </div>
                             
                            <div class="Tokens" id="overlay" style="float:left; visibility:hidden; border: 1px solid #A5B3C5; width:185px; text-align:center; margin-left:10px;">
                             
                                <table id="tableid">
                                    <tr style="width:184px">
                                        <td class="clickMe" style=" text-align:right; width:92px">{ACCOUNT_ID}</td><td style="width:5px"></td><td class="clickMe" style=" text-align:left">{ADDR_LINE1}</td>
                                    </tr>
                                    <tr>
                                        <td class="clickMe" style=" text-align:right">{ADDR_LINE2}</td><td style="width:5px"></td><td class="clickMe" style=" text-align:left">{CITY}</td>
                                    </tr>
                                    <tr>
                                        <td class="clickMe" style=" text-align:right">{COMPANY}</td><td style="width:5px"></td><td class="clickMe" style=" text-align:left">{EMAIL_ADDR}</td>
                                    </tr>
                                    <tr>
                                        <td class="clickMe" style=" text-align:right">{FIRST_NAME}</td><td style="width:5px"></td><td class="clickMe" style=" text-align:left">{LAST_LOGIN}</td>
                                    </tr>
                                    <tr>
                                        <td class="clickMe" style=" text-align:right">{LAST_NAME}</td><td style="width:5px"></td><td class="clickMe" style=" text-align:left">{LOCATION}</td>
                                    </tr>
                                    <tr>
                                        <td class="clickMe" style=" text-align:right">{MIDDLE_INIT}</td><td style="width:5px"></td><td class="clickMe" style=" text-align:left">{NICKNAME}</td>
                                    </tr>
                                    <tr>
                                        <td class="clickMe" style=" text-align:right">{POS_CUST_ID}</td><td style="width:5px"></td><td class="clickMe" style=" text-align:left">{PREFIX_NAME}</td>
                                    </tr>
                                    <tr>
                                        <td class="clickMe" style=" text-align:right">{REVIEWER_ID}</td><td style="width:5px"></td><td class="clickMe" style=" text-align:left">{STATE}</td>
                                    </tr>
                                    <tr>
                                        <td class="clickMe" style=" text-align:right">{SUFFIX_NAME}</td><td style="width:5px"></td><td class="clickMe" style=" text-align:left">{ZIPCODE}</td>
                                    </tr>
                                </table>
 
                            </div>
 
                            <div style="clear: left;">
                                <asp:RequiredFieldValidator ID="rfvKeyLink" runat="server" ControlToValidate="reKeyLink"
                                    ValidationGroup="AddKeyLink" Display="Dynamic" Text="Key link text is required." />
                            </div>
 
                        </div>

I wish to make the code above to work in a RadListView defined like so -
                <telerik:RadListView runat="server" ID="rlvKeyLinks" Skin="Windows7" EnableEmbeddedSkins="true"
                    RegisterWithScriptManager="true" AllowMultiItemEdit="false" OnNeedDataSource="RlvKeyLinks_NeedDataSource"
                    OnItemCommand="RlvKeyLinks_ItemCommand" OnItemCreated="RlvKeyLinks_ItemCreated"
                    AllowCustomPaging="true" AllowPaging="true" ItemPlaceholderID="phKeyLinksView"
                    DataKeyNames="ID">
 
 
-------------RadEditor and Table here--------------
 
 
                </telerik:RadListView>

Can you help?
Thanks!



1 Answer, 1 is accepted

Sort by
0
Tsvetina
Telerik team
answered on 23 Dec 2011, 09:45 AM
Hello Adam,

Try the following:
Add a runat="server" to the table, so that it can get a full ID genereated. Then, when a click event occurs, use the parentNode attribute to go from the cell to the table itself. Take the table id attribute, replace "tableid" with "reKeyLink" inside this id string and use it with $find to find the editor:
var editorId = table.id.replace('tableId','reKeyLink'); //where table is the <table> dom element
var editor = $find(editorId);


All the best,
Tsvetina
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
Tags
ListView
Asked by
Adam
Top achievements
Rank 1
Answers by
Tsvetina
Telerik team
Share this question
or