Come faccio a ottenere l'Ajax di lavorare con Telerik DockZone, ListView e DataPager
https://stackoverflow.com/questions/2139927
-
22-09-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
RussianDomanda
Sto avendo un po 'di un momento difficile cercando di capire esattamente come fare una corretta opera chiamata Ajax con il Telerik DockZone, ListView e DataPager. Sto sperando che qualcuno possa aiutare un po '.
Io sono dinamicamente aggiungendo RadDock in codice dietro alle zone.
Ecco il codice per la pagina principale (che devo ristrutturare presto b / c di un sacco di problemi di layout con IE e Firefox, ma, questo è fuori dal contesto di quello che sto chiedendo qui!)
<%@ 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>
Da qui, nel codice dietro aggiungerò RadDock, esempio come questo:
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);
Infine, nella "ctlNewsRoom" Ho un ListView utilizzando un DataPager. Quello che vorrei fare è, sul cambiamento delle pagine è che solo quello Dock essere aggiornato. In questo momento ciò che sta accadendo è che tutti i Docks sulla pagina principale sono in fase di aggiornamento. Sto pensando (o sperare) che io non ho tutto collegato insieme.
<%@ 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>
Di seguito è semplice codice che carica i dati.
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();
}
}
}
Soluzione
Il tuo attuale implementazione è troppo complesso e non credo che avete bisogno di utilizzare il controllo RadAjaxManager. Quello che si sta descrivendo - essere in grado di aggiornare un singolo dock senza influire sul resto della pagina - può accadere semplicemente avvolgendo il contenuto dock (il controllo utente) in una RadAjaxPanel. Ad esempio:
<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server">
<asp:LinqDataSource ID="dsNews" runat="server" OnSelecting="dsNews_Selecting" />
<asp:ListView ID="lvNews" runat="server" DataKeyNames="RecordID" DataSourceID="dsNews">
...
</asp:ListView>
</telerik:RadAjaxPanel>
In questo modo si può essere sicuri che interagire con il contenuto di una banchina non influenzerà gli altri.
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
