Tab strip control is not properly not working

[Perfect]

Hi,

  As my requirement I'm using Tab strip control. I put 2 tabs and each tab inside I put the "Rad Grid" here I want to perform Insert, update and Delete in grid. Every thing is fine for me. But I get one issue i.e..,  For example Tab1 and Tab2 2 tabs I have. Inside this Tab1 I set "Rad Grid" now when I click on "Add New Record" The rad grid comes in Edit mode, update and cancel link buttons is displaying. now I'm not enter or click anything in control and I want to go "Tab2".   this functionality is not working for me.
Please help me in this issue. I we are using 2010 version.

Advance Thanks

I already check below link but I didn't get any proper solution to solve the problem.

http://demos.telerik.com/aspnet-ajax/tabstrip/examples/applicationscenarios/dynamicpageview/defaultcs.aspx
http://www.telerik.com/community/forums/winforms/tabstrip/tab-key-not-working-in-radtextbox-to-switch-to-the-next-radtextbox.aspx

[Dimitar Terziev]

Hello,

Could you elaborate a bit more on what is the experienced behavior when you click on the second tab? Do you get any JavaScript errors or the tab is just not selected? Also please share the implementation that you are using so we could inspect it.

Regards,
Dimitar Terziev
the Telerik team

[Perfect]

Hello Terziev,

  Thanks for your reply. I tell my exact requirement scenario. I have 2 tabs lets an example.
  Tab1 name is Emp and Tab2 name is Dept.
  Inside Emp Tab I put "Rad grid" and here I want to perform Insert Update and Delete functionality.
  now I have 5 emp records in Emp Tab1 and I want to update  one record (record name is "AAA"), so I click on "Edit" link button when you click on Edit button the  rad grid comes in Edit mode, update and cancel link buttons is displaying in "AAA" record. now I'm not enter /  click on any control just directly I want to click on "Deprt Tab2"  Tab2 is open again I click on Emp Tab1 What I observe is still the the record is displaying edit mode.(previously I click "Edit" link button right, still the record is displaying is edit mode).

  My problem is, first step : when I click on Emp Tab1 and one record is edit mode  now 
                          Second step: when you click on DeptTab2 and come back to click on Emp Tab1 still the 
                          record is displaying in edit mode.  I don't want to displaying record in edit mode in Emp Tab1.
   i.e.., In tab1 you want to think some records are modify and click on "Edit" link button the entire record row is displaying in Edit mode. you didn't enter any thing in textboxs and not click on "Update/Cancel" link button just you click on Tab2 agian if you click on Tab1 still the record is displaying in Edit mode.this is my exactly problem. I don't want to display the record in edit mode.

I hope you can understand. Please give solution asap.

Thanks in  Advance.
Mr. Perfect 

[Dimitar Terziev]

Hi,

In order to achieve the desired functionality the grid edit form should be closed when the user navigate back to the first tab. In order to achieve this functionality subscribe to the client OnClientTabSelected event of the RadTabStrip and use the following implementation of the event handler function:

function OnClientTabSelected(sender, eventArgs) {

              var tab = eventArgs.get_tab();
              var grid = $find("RadGrid1");

              if (tab.get_text() == "Emp ") {

                   if(grid.get_editItems().length>0)
                       grid.get_masterTableView().fireCommand("Cancel","");

              }
           }

Regards,
Dimitar Terziev
the Telerik team

[Perfect]

Hi,
 
   Thank you for ur reply and ur support. Actually I'm new to use this control .

 still I getting javascript error :  when I debug the script below specify lines getting error
           

if (grid.get_editItems().length > 0)

 

grid.get_masterTableView().fireCommand("Cancel", "");

    This is error message:  "Microsoft JScript runtime error: Object doesn't support this property or method"
For you reference below I mention  Script file and also .aspx file.

 

<script type="text/javascript">

   function OnClientTabSelected(sender, eventArgs) {//debugger;

          var tab = eventArgs.get_tab();

          //alert(tab.get_text());

         if (tab.get_text() == "Emp") {

         var checkNull = document.getElementById('ctl00_ContentPlaceHolder1_Emp_userControl_rgEmp');

           if (checkNull != null) {

           var grid = $find('ctl00_ContentPlaceHolder1_Emp_userControl_rgEmp');

              if (grid.get_editItems().length > 0)

                   grid.get_masterTableView().fireCommand("Cancel", "");

                }

             }

       if (tab.get_text() == "Dept") {

         var checkNull = document.getElementById('ctl00_ContentPlaceHolder1_Dept_userControl_rgDept');

          if (checkNull != null) {

            var grid = $find('ctl00_ContentPlaceHolder1_Dept_userControl_rgDept');

               if (grid.get_editItems().length > 0)

                  grid.get_masterTableView().fireCommand("Cancel", "");

            }
        }
</script>

** aspx  page 
        <table style="text-align: center; width: 100%">

            < tr>  

         <td align="center">

                 <asp:Panel runat="server" BorderStyle="Double">

               <telerik:RadTabStrip OnClientTabSelecting="onTabSelecting" ID="RadTabStrip1" SelectedIndex="0"

                  CssClass="tabStrip" runat="server" MultiPageID="RadMultiPage1" Skin="Office2007"

                 OnTabClick="RadTabStrip1_TabClick" Orientation="HorizontalTop" Font-Size="X-Large"

                  CausesValidation="false" Font-Bold="true" Font-Italic="true" 
                OnClientTabSelected="OnClientTabSelected"> 

          </telerik:RadTabStrip>

             <asp:Panel runat="server" BorderStyle="Ridge">

                    <telerik:RadMultiPage ID="RadMultiPage1" runat="server" SelectedIndex="0"
               OnPageViewCreated="RadMultiPage1_PageViewCreated"  CssClass="multiPage">

                     </telerik:RadMultiPage>

               </asp:Panel> 
      </asp:Panel> 
</td>

 </tr>

 </table>

 reference site http://demos.telerik.com/aspnet-ajax/tabstrip/examples/applicationscenarios/loadondemand/defaultcs.aspx
I implemented Tab strip controls.
My Exact requirement:
  here I'm using userControls in the tabs.Emp and Dept are 2 user controls. so, as per my requirement Emp and Dept is 2 tabs,In Emp tab bind Emp details and Dept tab bind Dept details here I'm using "Load on Demand" concept. on the fly grids are binding. now in Dept Tab am I click "Add New" link button in grid  columncontrols are display in edit mode and also with update, cancel link button. i didn't enter anything in control and not click on any link button Immediately I click on  "EMP"tab  inside the grid is display with data. now  when I click on "Dept" tab still controls are displaying in editmode. This is not I want . when I move to next tab automatically  edit mode controls are cancelled.
 

Please help me in this issue. :)

Advance Thanks.
Mr.Perfect.