Save button

[Hrvoje Voda]

1. How to use save button of grid?

   can I call a function from code behind instead of scipt?

   If not, how can I hide it and use my own?

2. How to change selected value of dropdown list in dialog where selected from grid row?

[Pavithra Subramaniyam]

Hi  Hrvoje, 

Query 1: 

  We have analyzed your query and we have prevent the normal save behaviour of grid by setting  “cancel” option true in “ActionBegin” event of Grid control. In that event you can use your server side function. 

  Please refer the following code example. 

 

<ej:Grid ID="OrdersGrid" runat="server" AllowPaging="True"> 

  <ClientSideEvents ActionBegin="begin"/> 

       ..... 

 

</ej:Grid> 

<script type="text/javascript"> 

 

        function begin(args) { 

 

            if (args.requestType == "save") { 

 

                args.cancel = true; 

 

                // your own code here 

 

            } 

        } 

</script> 

 

 

Query 2: 

We have analyzed your query and we have achieved your requirement by using “RowSelected” event of Grid control and “selectedIndex” API of DropdownList. Please refer the following  code example and online document link. 

 

<ej:DropDownList ID="dropdown" runat="server" ClientSideOnChange="selectChange" Width="120px"> 

..... 

</ej:DropDownList> 

 

<ej:Grid ID="OrdersGrid" runat="server" AllowPaging="True"> 

<ClientSideEvents  RowSelected="rowSelected"/> 

.... 

</ej:Grid> 

 

<script type="text/javascript">  

 

        function rowSelected(args) { 

 

            var obj = $("#<%=dropdown.ClientID%>").data("ejDropDownList"); 

 

            $("#<%=dropdown.ClientID%>").ejDropDownList("model.selectedIndex", this.selectedRowsIndexes[0]) 

        } 

        </script> 

 

 https://help.syncfusion.com/api/js/ejgrid#events:rowselected 

https://help.syncfusion.com/api/js/ejdropdownlist#members:selectedindex  

 If We misunderstood your query please share following details about your requirement to provide a solution as early as possible. 

            

·       Please share your view code. 

·       Please share the screenshot of your requirement. 

Regards, 

Pavithra S. 

[Hrvoje Voda]

Save button is working ok.

Dropdownlist stays empty. Is it because it's in dialog?

ASPX:

<ej:Dialog ID="dialogZup" ShowOnInit="false" runat="server" Width="600" Target ="#form1" CloseOnEscape="False">

                                <DialogContent>                                                                                         

                                    <div style ="float:initial;width:85%; height:370px;margin-top:30px;"> 

                                         <ej:DropDownList ID="ddlZupanije" runat="server"  Width="120px"

                                            DataTextField="Name" DataValueField="CountyID">                                            

                                        </ej:DropDownList>    

                              </DialogContent>

  </ej:Dialog>

Code:

Sub DDLFill()

        ddlZupanije.DataSource = uma.dohvatiDDLListu(conn, dohvatiVatrogasnoZupDDL) -- this is function that returns datatable - it's working fine in asp dropdownlist

   

   

    End Sub

[Pavithra Subramaniyam]

Hi Hrvoje, 

We have analyzed your requirement and  we were unable to reproduce issue at our end. The DropDownList does not stay empty in  

Diolog in following code example. 

Please refer the following code samples and Screenshot. 

With DataSource: 

<ej:Dialog ID="dialog" runat="server"> 

             <DialogContent> 

               <div class="col-md-3"> 

                 <ej:DropDownList ID="dropdown" Width="200px" DataTextField="Text" DataValueField="ID"  runat="server">  

                 </ej:DropDownList> 

               </div> 

             </DialogContent> 

         </ej:Dialog> 

<ej:Grid ID="OrdersGrid" runat="server" AllowPaging="True"> 

            <ClientSideEvents  RowSelected="rowSelected"/> 

            ….. 

</ej:Grid> 

    <script type="text/javascript"> 

        function rowSelected(args) { 

            var obj = $("#<%=dropdown.ClientID%>").data("ejDropDownList"); 

            $("#<%=dropdown.ClientID%>").ejDropDownList("model.selectedIndex", this.selectedRowsIndexes[0]) 

        } 

     </script> 

 

Without DataSource: 

<ej:Dialog ID="dialog" runat="server"> 

          <DialogContent> 

          <div class="col-md-3"> 

             <ej:DropDownList ID="dropdown" runat="server" Width="120px"> 

                 <Items> 

                     <ej:DropDownListItem Text="1" Value="1" /> 

                     <ej:DropDownListItem Text="2" Value="2" /> 

                      .... 

                  </Items> 

               </ej:DropDownList> 

            </div> 

           </DialogContent> 

</ej:Dialog> 

<ej:Grid ID="OrdersGrid" runat="server" AllowPaging="True"> 

            <ClientSideEvents  RowSelected="rowSelected"/> 

</ej:Grid> 

     <script type="text/javascript">  

        function rowSelected(args) { 

            var obj = $("#<%=dropdown.ClientID%>").data("ejDropDownList"); 

            $("#<%=dropdown.ClientID%>").ejDropDownList("model.selectedIndex", this.selectedRowsIndexes[0]) 

        } 

        </script> 

 

 

Screenshot of the code: 

  

If you still facing  the same issue again  please share the following details to provide a solution as early as possible. 

·       Please share view code of your Grid. 

·       Please share Screenshot of your issue. 

·       If possible share modified sample with issue reproduce. 

·       Please share the sample if possible. 

Regards, 

Pavithra S.