How to Rendering TreeView inside DropDownList within a Dialog Template

[Mohammad Helal]

Hi Syncfusion Support Team,

I have a problem with rendering a TreeView inside DropDownList within a Dialoge Template for ejGrid control, the problem is that there is nothing happened?

this is my dialog template:
<script type="text/template" id="specialDayTemplate">
        <table cellspacing="10" dir="rtl">
          
            <tr>
             
                <td style="text-align: right">
                    <ej:DropDownList ID="ddlDepts2" ClientIDMode="Static" runat="server" DataValueField="DEPTID" Width="150px"
                        WatermarkText="-- إختر القسم --" EnableRTL="true"
                        OnPreRender="ddlDepts2_PreRender">
                        <Items>
                            <ej:DropDownListItem>
                                <ContentTemplate>
                                    <ej:TreeView ID="tvDepts2" ClientIDMode="Static" runat="server" DataTextField="DEPTNAME"
                                        DataIdField="DEPTID" DataParentIdField="SUPDEPTID"
                                        EnableRTL="true"
                                        ClientSideOnNodeExpanded="checkScroll"
                                        ClientSideOnNodeCollapsed="checkScroll">
                                    </ej:TreeView>
                                </ContentTemplate>
                            </ej:DropDownListItem>
                        </Items>
                    </ej:DropDownList>


                </td>
            </tr>
          </table>
</script>


Please help me on that!!

Regards,
M Helal

[Ezhil S]

Hi Helal,

 

Thank you for contacting Syncfusion support.

 

In order to use Syncfusion control inside script template, we suggest you to render the control from script so that the control will be rendered in Dialog Template. We have prepared sample as per your requirement to add DropDownList with TreeView in Grid Dialog template.

For your reference check the following demo link: http://asp.syncfusion.com/demos/web/grid/dialogonlocaldata.aspx

Sample download link: http://www.syncfusion.com/downloads/support/forum/120817/ze/DialogTempGrid_f120817-1401503078

 

Please let us know if you have any other queries.

 

Regards,

Ezhil S

[Mohammad Helal]

Thank you so much, this helped me a lot.

[Ezhil S]

Hi Helal,

Thanks for your update.

We are glad that our solution helped you to resolve the issue at your end.

Let us know if you need further assistance.

Regards,
Ezhil S

[mohammed shdaifat]

Hi Syncfusion Support Team,

i have a proplem in DropDownList  when i used it with treeview template  i used same demo code  , in part of demo code i should override following methods:

   ej.DropDownList.prototype._OnMouseClick = function (e) { }

            ej.DropDownList.prototype._OnMouseEnter = function (e) { }

            ej.DropDownList.prototype._OnMouseLeave = function (e) { }

            ej.DropDownList.prototype._OnKeyUp = function (e) { }

            ej.DropDownList.prototype._OnKeyDown = function (e) { }

after  that all DropDownList  in my application cannot be selected.

please is there any other way to resolve this issue.

regards,

mohammed al shdaifat

[Prince Oliver]

Hi Mohammed,   

  

Thanks for your update.   

  

When you override the dropdown source methods it will affect the every dropdownlist in the page, so you need to copy the source methods to be overridden in variables and override the methods and when creating dropdownlist without treeview again override the methods to its default by the variables. We have attached a sample for your convenience   

  

Refer to the following link for sample:   

http://www.syncfusion.com/downloads/support/forum/120817/ze/TestGrid-601108317 

  

Regards,   

Prince