2010-01-26 3 views
0

Telerik DockZone, ListView 및 DataPager로 정확한 Ajax 호출 작업을 수행하는 방법을 정확히 파악하기가 힘듭니다. 나는 누군가가 조금 도와 줄 수 있기를 바라고 있습니다.Telerik DockZone, ListView 및 DataPager와 함께 작동하도록 Ajax를 얻는 방법

코드에 RadDock을 동적으로 추가하고 있습니다. 여기

(나는 곧 구조 조정 IE와 파이어 폭스,하지만,와 많은 및 레이아웃 문제의 많은 c를 그 내가 여기 부탁 해요 어떤 맥락에서이다/B!이) 메인 페이지에 대한 코드

입니다 여기에서

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ClientView.aspx.cs" Inherits="News.UI.Form_ClientView" %> 
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %> 
<html> 
<head> 
    <title></title> 
    <link href="Styles/ClientView.css" rel="stylesheet" type="text/css" />  
    <script src="Scripts/ClientView.js" type="text/javascript" ></script> 
</head> 
<body> 
<form id="Form1" runat="server"> 
    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager> 
    <div id="clientviewcontent"> 
    <telerik:RadDockLayout runat="server" ID="RadDockLayout1" EnableEmbeddedSkins="true" Skin="Office2007" Visible="true"> 
    <div id="clientviewlayout"> 
     <table class="tbldoclayout"> 
     <tr> 
      <td class="totop" colspan="3"><telerik:RadDockZone Width="100%" MinHeight="0" BorderStyle="None" runat="server" ID="RadDockZoneTop" Orientation="Vertical" Visible="true"></telerik:RadDockZone></td> 
     </tr> 
     <tr> 
      <td class="tdleft"><telerik:RadDockZone Width="100%" Height="100%" MinHeight="0" BorderStyle="None" BorderWidth="0" runat="server" ID="RadDockZoneV1" Orientation="Vertical"></telerik:RadDockZone></td> 
      <td class="tdmid"><telerik:RadDockZone Width="100%" Height="100%" MinHeight="0" BorderStyle="None" BorderWidth="0" runat="server" ID="RadDockZoneV2" Orientation="Vertical"></telerik:RadDockZone></td> 
      <td class="tdright"><telerik:RadDockZone Width="100%" Height="100%" MinHeight="0" BorderStyle="None" BorderWidth="0" runat="server" ID="RadDockZoneV3" Orientation="Vertical"></telerik:RadDockZone></td> 
     </tr>   
     </table> 
    </div> 
    </telerik:RadDockLayout> 
    </div> 
</form> 
</body> 
</html> 
는 코드에서 나는 RadDock,이 같은 예를 추가 할 것입니다 뒤에 :

RadDock dockNews = new RadDock(); 
dockNews.DockMode = DockMode.Docked; 
dockNews.ID = "dockNews"; 
dockNews.Tag = "dockNews"; 
dockNews.Title = "News"; 
dockNews.Skin = "Office2007"; 
dockNews.Width = Unit.Pixel(200); 
dockNews.Style.Add("margin-bottom", "5px"); 
dockNews.DockHandle = DockHandle.TitleBar; 
dockNews.DefaultCommands = Telerik.Web.UI.Dock.DefaultCommands.All; 
Control ctrlNewsRoom = LoadControl("~/ClientView/ctlNewsRoom.ascx"); 
RadDockLayout1.Controls.Add(dockNews); 
RadDockZoneV1.Controls.Add(dockNews); 
dockNews.ContentContainer.Controls.Add(ctrlNewsRoom); 

마지막에서 "ctlNewsRoom는"나는있는 DataPager를 사용하여 ListView에 있습니다. 내가 뭘하고 싶은지, 페이지의 변경에 하나의 도크가 업데이트된다는 것입니다. 현재 일어나고있는 일은 메인 페이지의 모든 Docks가 업데이트되고 있다는 것입니다. 나는 모든 것을 하나로 묶어 두지 않는다고 생각하고있다.

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="ctlNewsRoom.ascx.cs" Inherits="News.UI.ctlNewsRoom_Control" %> 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 

<telerik:RadAjaxManagerProxy ID="Proxy" runat="server"> 
    <AjaxSettings> 
     <telerik:AjaxSetting AjaxControlID="dsNews" EventName="dsNews_Selecting"> 
      <UpdatedControls> 
       <telerik:AjaxUpdatedControl ControlID="dsNews" /> 
      </UpdatedControls> 
     </telerik:AjaxSetting> 
    </AjaxSettings> 
</telerik:RadAjaxManagerProxy> 

<asp:LinqDataSource ID="dsNews" runat="server" OnSelecting="dsNews_Selecting" /> 

     <asp:ListView ID="lvNews" runat="server" DataKeyNames="RecordID" DataSourceID="dsNews"> 
      <LayoutTemplate> 
      <div id="itemPlaceholderContainer" runat="server"> 
       <div id="itemplaceholder" runat="server"></div> 
       </div> 
       <div style="clear: left; text-align:center; vertical-align: middle; float:none;"> 
       <asp:DataPager ID="pageTopics" runat="server" PageSize="3" PagedControlID="lvNews">  
        <Fields> 
         <asp:NextPreviousPagerField ShowFirstPageButton="true" ButtonType="Image" ShowPreviousPageButton="false" ShowNextPageButton="false" FirstPageImageUrl="../Images/PagingFirst.gif" /> 
         <asp:NextPreviousPagerField ShowFirstPageButton="false" ButtonType="Image" ShowPreviousPageButton="true" ShowNextPageButton="false" PreviousPageImageUrl="../Images/PagingPrev.gif" /> 
         <asp:NumericPagerField ButtonCount="9" /> 
         <asp:NextPreviousPagerField ShowFirstPageButton="false" ButtonType="Image" ShowPreviousPageButton="false" ShowNextPageButton="true" ShowLastPageButton="false" NextPageImageUrl="../Images/PagingNext.gif" /> 
         <asp:NextPreviousPagerField ShowFirstPageButton="false" ButtonType="Image" ShowPreviousPageButton="false" ShowNextPageButton="false" ShowLastPageButton="true" LastPageImageUrl="../Images/PagingLast.gif" /> 
        </Fields> 
       </asp:DataPager> 
      </LayoutTemplate> 
      <ItemTemplate> 
       <div> 
        <ul id="newsul"> 
         <li id="newstitle"><%# Eval("Name")%></li> 
         <li id="newspub"> 
         <div style="width:100%;margin:0;padding:0;"> 
          <div style="text-align:left;float:left;">Published: <%# Eval("PublishDate")%></div> 
          <div style="text-align:right;"><asp:HyperLink runat="server" ID="newNav" ImageUrl="../Images/world_go.png" NavigateUrl='<%# Eval("URL")%>' Target="_blank" /></div> 
         </div>       
         </li> 
         <li id="newsdesc"><%# Eval("Description").ToString()%></li> 
        </ul> 
       </div> 
      </ItemTemplate> 
      <EmptyDataTemplate>No news found</EmptyDataTemplate> 
     </asp:ListView> 

다음은 데이터를로드하는 간단한 코드입니다.

using News.UI; 
    using News.DataModel; 
    using System.Linq; 
    using System.Xml.Linq; 
    using System; 
    using System.Data; 
    using System.Configuration; 
    using System.Collections; 
    using System.Collections.Generic; 
    using System.Web; 
    using System.Web.Security; 
    using System.Web.UI; 
    using System.Web.UI.WebControls; 
    using System.Web.UI.WebControls.WebParts; 
    using System.Web.UI.HtmlControls; 
    using System.Xml; 
    using System.Xml.XPath; 

namespace News.UI 
    { 
     public partial class ctlNewsRoom_Control : System.Web.UI.UserControl 
     { 

      private SettingManager m_SettingManager; 
      private GBMDataContext m_Context; 


      protected void dsNews_Selecting(object sender, LinqDataSourceSelectEventArgs args) 
      { 

       args.Result = LoadData(); 
      } 

      private IList LoadData() 
      { 

       m_SettingManager = new SettingManager(); 
       m_Context = m_SettingManager.DataContext; 

       var q = from tmp in m_Context.NewsRooms where 
             (!(tmp.RecordExpiration.HasValue) || tmp.RecordExpiration.Value >= DateTime.UtcNow) 
             orderby tmp.PublishDate descending 
         select new { tmp.RecordID, Name=tmp.Name.Substring(0,75), PublishDate = tmp.PublishDate.ToShortDateString(), Description=tmp.Description.Substring(0,175), URL=tmp.URL }; 


       return q.ToList(); 

      } 

     } 
    } 

답변

1

현재 구현이 너무 복잡하기 때문에 RadAjaxManager 컨트롤을 사용할 필요가 없습니다. 페이지의 나머지 부분에 영향을 미치지 않으면 서 단일 도크를 업데이트 할 수 있다는 설명은 RadAjaxPanel에서 독 콘텐트 (사용자 정의 컨트롤)를 래핑하면됩니다. 예를 들면 다음과 같습니다.

이렇게하면 한 도크의 내용과 상호 작용해도 다른 사람에게 영향을 미치지 않을 것입니다.

+0

항상 그렇듯이 코드를 보는 데 너무 많은 시간을 할애하여 복잡하게 만듭니다. 항상 가장 간단한 솔루션입니다. 그것은 완벽하게 작동했습니다! 빠른 응답을 주셔서 대단히 감사합니다! – sugarcrum

관련 문제