2013-07-29 1 views
0

두개의 중첩 된 뷰에 두 개의 radtabs 안에 두 개의 중첩 된 gridview가 있는데 확장 및 축소를위한 간단한 JavaScript가 있습니다. 두 번째 탭/RadTab에 JavaScript가 작동하지 않습니다.

자바 스크립트

<script type="text/javascript"> 
    function collapseExpand(obj) { 
     var gvObject = document.getElementById(obj); 
     var imageID = document.getElementById('image' + obj); 

     if (gvObject.style.display == "none") { 
      gvObject.style.display = "inline"; 
      imageID.src = "~/ims/Images/bullet_toggle_minus.jpg"; 
     } 
     else { 
      gvObject.style.display = "none"; 
      imageID.src = "~/ims/Images/bullet_toggle_plus.jpg"; 
     } 
    } 

는 첫 번째 탭의 첫 번째 RadGrid에 대한 잘 작동한다. 그러나 두 번째 탭에서 작동하지 않습니다. 컨트롤이 두 번째 그리드로 전송할 수 없다고 생각합니다. 나는 내 문제는 내가 거기에 나열된 모든 방법을 적용하지만 여전히 작동하지 않는 그

http://weblogs.asp.net/hajan/archive/2010/10/07/make-them-to-love-each-other-asp-net-ajax-updatepanels-amp-javascript-jquery-functions.aspx

유사하다 생각합니다.

<script type="text/javascript"> 
    function load() { 
     Sys.WebForms.PageRequestManager.getInstance().add_endRequest(collapseExpand); 
    } 
    function collapseExpand(obj) { 
     var gvObject = document.getElementById(obj); 
     var imageID = document.getElementById('image' + obj); 

     if (gvObject.style.display == "none") { 
      gvObject.style.display = "inline"; 
      imageID.src = "~/ims/Images/bullet_toggle_minus.jpg"; 
     } 
     else { 
      gvObject.style.display = "none"; 
      imageID.src = "~/ims/Images/bullet_toggle_plus.jpg"; 
     } 
    } 

누군가는 전송하거나 두 번째 탭에 자바 스크립트의 제어를 전달하는 데 쓰는 어떤 코드를 말씀해 주시겠습니까?

또한 Radtabs 및 RadPageView를 사용하여 두 개의 격자에 두 개의 격자를 표시합니다.

나는 붕괴 radtab 내부 확장

<telerik:RadTabStrip ID="RadTabStrip1" runat="server" SelectedIndex="0" MultiPageID="RadMultipage1"> 
<Tabs> 
<telerik:RadTab Text="Tab1" PageViewID="RadPageView1" OnLoad="Load1"> 
    </telerik:RadTab> 
    <telerik:RadTab Text="Tab2" PageViewID="RadPageView2" > 
</telerik:RadTab> 
</Tabs> 
</telerik:RadTabStrip> 
<telerik:RadMultiPage ID="RadMultipage1" runat="server"> 
<telerik:RadPageView ID="RadPageView1" runat="server" Width="100%" TabIndex="0"> 
<telerik:RadGrid ID="View1" runat="server" AutoGenerateColumns="False" Width="100" 
    BackColor="White" BorderColor="#E7E7FF" BorderStyle="None" BorderWidth="1px" 
     OnItemDataBound="RadGrid2_ItemDataBound" > 
    <MasterTableView DataKeyNames="id"> 
    <Columns> 
    <telerik:GridTemplateColumn> 
    <ItemTemplate> 
    <a href="javascript:collapseExpand('id_<%# Eval("id") %>');"> 
    <img id="imageSubId_<%# Eval("id") %>" alt="Click to show/hide orders" border="0" src="Images/bullet_toggle_plus.jpg" /> 
    </a> 
    </ItemTemplate> 
    </telerik:GridTemplateColumn> 
    <telerik:GridBoundColumn DataField="id" HeaderText="ID"/> 
    <telerik:GridBoundColumn DataField="fname" HeaderText="First Name"/> 
    <telerik:GridBoundColumn DataField="lname" HeaderText="Last Name"/> 
    <telerik:GridBoundColumn DataField="DOB" HeaderText="Date of Birth"/> 
    <telerik:GridTemplateColumn> 
    <ItemTemplate> 
      <tr> 
      <td colspan="100%"> 
      <div id="id_<%# Eval("id") %>" style="display: none; position: relative; left: 10px;"> 
      <telerik:RadGrid ID="View2" runat="server" AutoGenerateColumns="false" Width="400" 
        GridLines="None" > 
      <MasterTableView > 
        <Columns> 
        <telerik:GridBoundColumn DataField="fname" HeaderText="First Name" /> 
        <telerik:GridBoundColumn DataField="mname" HeaderText="Middle Name" /> 
        <telerik:GridBoundColumn DataField="lname" HeaderText="Last Name" /> 
        <telerik:GridTemplateColumn> 
        <ItemTemplate> 
        <asp:CheckBox ID="checkselect" runat="server" /> 
        </ItemTemplate> 
        <HeaderTemplate> 
        <asp:Button ID="Button4" runat="server" Text="Remove" CommandName="Split" OnClick="Button4_Click" /> 
        </HeaderTemplate> 
        </telerik:GridTemplateColumn> 
        </Columns> 
        </MasterTableView > 
      </telerik:RadGrid> 
      </div> 
      </td> 
      </tr> 
</ItemTemplate> 
</telerik:GridTemplateColumn> 
</Columns> 
</MasterTableView> 
</telerik:RadGrid> 
    </telerik:RadPageView> 
<telerik:RadPageView ID="RadPageView2" runat="server" Width="100%"> 
Same Code 
</telerik:RadPageView> 
    </telerik:RadMultiPage> 
+0

어디 collapseExpand을 요구하고있다? – MaxPRafferty

+0

@MaxPRafferty Radtab에서 호출하고 있습니다. 질문이 거대해질 것이므로 코드를 추가하지 않았습니다. 내가 채팅을 할 수있게 해주면 개인적으로 코드를 보낼 수 있습니까? – Huzaifa

+0

저는 주로 중계기 내부에서 obj를 전달하는 것에 관심이 있습니다. 두 번째가 아닌 첫 번째 인스턴스에서 작동하므로 여러 개의 동일한 ID 값을 설정하는 것처럼 들립니다. – MaxPRafferty

답변

0

아래 코드로 시도하십시오 부르고있다.

JS

<script type="text/javascript"> 
     function collapseExpand(obj, Id) { 
      var gvObject = document.getElementById('div_' + Id + '_' + obj); 
      var imageID = document.getElementById('imageSubId_' + Id + '_' + obj); 

      if (gvObject.style.display == "none") { 
       gvObject.style.display = "inline"; 
       imageID.src = "http://www.fimfiction-static.net/images/icons/collapse.png"; 
      } 
      else { 
       gvObject.style.display = "none"; 
       imageID.src = "http://jlpa.trinitylaban.ac.uk/WebCat_Images/English/Other/MiscD/admin-icon-expand.png"; 
      } 
     } 
    </script> 

ASPX

<telerik:RadTabStrip ID="RadTabStrip1" runat="server" MultiPageID="RadMultipage1"> 
    <Tabs> 
     <telerik:RadTab Text="Tab1" PageViewID="RadPageView1"> 
     </telerik:RadTab> 
     <telerik:RadTab Text="Tab2" PageViewID="RadPageView2"> 
     </telerik:RadTab> 
    </Tabs> 
</telerik:RadTabStrip> 
<telerik:RadMultiPage ID="RadMultipage1" runat="server"> 
    <telerik:RadPageView ID="RadPageView1" runat="server" Width="100%" TabIndex="0"> 
     <telerik:RadGrid ID="GridView1" runat="server" AutoGenerateColumns="False" BackColor="White" 
      BorderColor="#E7E7FF" BorderStyle="None" BorderWidth="1px" CellPadding="3" GridLines="Horizontal" 
      OnNeedDataSource="GridView1_NeedDataSource"> 
      <MasterTableView DataKeyNames="ID"> 
       <Columns> 
        <telerik:GridTemplateColumn> 
         <ItemTemplate> 
          <a onclick="javascript:collapseExpand('<%# Eval("ID") %>','1');"> 
           <img id="imageSubId_1_<%# Eval("ID") %>" alt="Click to show/hide orders" src="http://jlpa.trinitylaban.ac.uk/WebCat_Images/English/Other/MiscD/admin-icon-expand.png" /> 
          </a> 
         </ItemTemplate> 
        </telerik:GridTemplateColumn> 
        <telerik:GridBoundColumn DataField="ID" HeaderText="ID" /> 
        <telerik:GridTemplateColumn> 
         <ItemTemplate> 
          <tr> 
           <td colspan="100%"> 
            <div id="div_1_<%# Eval("ID") %>" style="display: none; position: relative; left: 25px;"> 
             <telerik:RadGrid ID="GridView2" runat="server" AutoGenerateColumns="false" CellPadding="4" 
              ForeColor="#333333" GridLines="None" OnNeedDataSource="GridView1_NeedDataSource"> 
              <MasterTableView> 
               <Columns> 
                <telerik:GridBoundColumn DataField="Name" HeaderText="First Name" /> 
                <telerik:GridTemplateColumn> 
                 <ItemTemplate> 
                  <asp:CheckBox ID="checkselect" runat="server" /> 
                 </ItemTemplate> 
                 <HeaderTemplate> 
                  <asp:Button ID="Button4" runat="server" Text="Remove" CommandName="Split" /> 
                 </HeaderTemplate> 
                </telerik:GridTemplateColumn> 
               </Columns> 
              </MasterTableView> 
             </telerik:RadGrid> 
            </div> 
           </td> 
          </tr> 
         </ItemTemplate> 
        </telerik:GridTemplateColumn> 
       </Columns> 
      </MasterTableView> 
     </telerik:RadGrid> 
    </telerik:RadPageView> 
    <telerik:RadPageView ID="RadPageView2" runat="server" Width="100%" TabIndex="0"> 
     <telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="False" BackColor="White" 
      BorderColor="#E7E7FF" BorderStyle="None" BorderWidth="1px" CellPadding="3" GridLines="Horizontal" 
      OnNeedDataSource="GridView1_NeedDataSource"> 
      <MasterTableView DataKeyNames="ID"> 
       <Columns> 
        <telerik:GridTemplateColumn> 
         <ItemTemplate> 
          <a onclick="javascript:collapseExpand('<%# Eval("ID") %>','2');"> 
           <img id="imageSubId_2_<%# Eval("ID") %>" alt="Click to show/hide orders" src="http://jlpa.trinitylaban.ac.uk/WebCat_Images/English/Other/MiscD/admin-icon-expand.png" /> 
          </a> 
         </ItemTemplate> 
        </telerik:GridTemplateColumn> 
        <telerik:GridBoundColumn DataField="ID" HeaderText="ID" /> 
        <telerik:GridTemplateColumn> 
         <ItemTemplate> 
          <tr> 
           <td colspan="100%"> 
            <div id="div_2_<%# Eval("ID") %>" style="display: none; position: relative; left: 25px;"> 
             <telerik:RadGrid ID="GridView2" runat="server" AutoGenerateColumns="false" CellPadding="4" 
              ForeColor="#333333" GridLines="None" OnNeedDataSource="GridView1_NeedDataSource"> 
              <MasterTableView> 
               <Columns> 
                <telerik:GridBoundColumn DataField="Name" HeaderText="First Name" /> 
                <telerik:GridTemplateColumn> 
                 <ItemTemplate> 
                  <asp:CheckBox ID="checkselect" runat="server" /> 
                 </ItemTemplate> 
                 <HeaderTemplate> 
                  <asp:Button ID="Button4" runat="server" Text="Remove" CommandName="Split" /> 
                 </HeaderTemplate> 
                </telerik:GridTemplateColumn> 
               </Columns> 
              </MasterTableView> 
             </telerik:RadGrid> 
            </div> 
           </td> 
          </tr> 
         </ItemTemplate> 
        </telerik:GridTemplateColumn> 
       </Columns> 
      </MasterTableView> 
     </telerik:RadGrid> 
    </telerik:RadPageView> 
</telerik:RadMultiPage> 

ASPX.CS

protected void GridView1_NeedDataSource(object sender, GridNeedDataSourceEventArgs e) 
{ 
    dynamic data = new[] { 
    new { ID = 1, Name ="Name1"}, 
    new { ID = 2, Name = "Name2"}, 
    new { ID = 3, Name = "Name3"}, 
    new { ID = 4, Name = "Name4"}, 
    new { ID = 5, Name = "Name5"} 
}; 

    (sender as RadGrid).DataSource = data; 
}