Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Разработка под ASP.NET > Цикл статей про AJAX

Автор: Exception 11.4.2006, 12:59

Приветствую всех!

Собственно говоря, не знаю, что меня сподвигло на написание этого цикла, наверное желание поделиться опытом... Хотелось бы, чтобы люди не повторяли тех ошибок, которые допускал я и очень хотелось бы ознакомить людей с новой технологией, которая зовётся Web 2.0 или AJAX.

Вступление

Что же такое AJAX? AJAX буквально расшифровывается как Asynchronous JavaScript And XML - асинхронный JavaScript и XML. Что это за чудо? Думаю, лучше всего об этом написано в http://ru.wikipedia.org/wiki/Ajax. Я лишь приведу цитату:

Цитата(Википедия)

AJAX (Asynchronous JavaScript and XML) — подход к построению пользовательских интерфейсов веб-приложений, при котором web-страница, не перезагружаясь, сама догружает нужные пользователю данные. AJAX — один из компонентов концепции DHTML.

Об Ajax заговорили после появления в феврале 2005-го года статьи Джесси Джеймса Гарретта (Jesse James Garrett) «Новый подход к веб-приложениям». Ajax — не самостоятельная технология. Это идея.

Ajax подход к разработке пользовательских интерфейсов базируется на двух основных принципах.

Использование DHTML для динамичного изменения содержания страницы.
Использование XMLHttpRequest для обращения к серверу «на лету», не перезагружая всю страницу полностью (также существует альтернативный вариант — динамическая подгрузка JavaScript с использованием DOM).

Использование этих двух подходов позволяет создавать намного более удобные веб-интерфейсы пользователя на тех страницах сайтов, где необходимо активное взаимодействие с пользователем. Использование Ajax стало наиболее популярно после того как компания Google начала активно использовать его при создании своих сайтов, таких как http://gmail.com/, http://maps.google.com/ и http://www.google.com/webhp?complete=1&hl=en. Создание этих сайтов подтвердило эффективность использования данного подхода.

Приложение AJAX состоит из двух частей:

Клиент - это код HTML и JavaScript.
Сервер - это часть, которая взаимодействует со страничками и имеет доступ к данным.

Обычная схема вхаимодействия такова:

Браузер загружает клиентскую страницу.
При взаимодействии с интерфейсом страницы JavaScript асинхронно передаёт и принимает данные от сервера в формате XML.
Браузер, а точнее, движок AJAX-приложения на JavaScript, обрабатывает данные, полученные от сервера и динамически меняет UI страницы.

Таким образом, появляется возможность писать Rich UI для Web!
Благодаря AJAX мы можем сделать страницу, поддерживающую Drag&Drop, всплывающие меню и даже автозаполнение TextBox'ов. Что самое приятное - страница совсем не перезагружается во время работы с пользователем!

Что же такое Atlas?

http://atlas.asp.net - это свободная реализация AJAX от Microsoft для ASP .NET. В чём её преимущества?

Во-первых, она позволяет оформить серверную часть как Web-сервис.
Во-вторых, благодаря специальным скриптам, в JavaScript появляется некий аналог ООП: возможно наследование, реализация интерфейсов и т.д.
В-третьих, разработчику практически ничего не нужно знать про внутреннюю работу Atlas.
В-четвёртых, не нужно писать код для поддержки различных браузеров - он встроен в Atlas.

Это было вступление. Следом за ним идёт вторая часть, которая покажет простейший пример использования Atlas. Оставайтесь с нами smile

Автор: Exception 11.4.2006, 13:53

К сожалению, вторая часть статьи, только что мною написанная, умерла ввиду того, что уроды-электрики отрубили свет во всём доме. Теперь буду сохраняться каждую минуту :angry
Так что ждите сегодня вечером или завтра.

Автор: Exception 11.4.2006, 15:17

Сдерживая злость на электриков, пишу вторую часть...

Приготовления

На данный момент Atlas находится в состоянии разработки. Но это вовсе не значит, что им ещё рано пользоваться. Напротив - чем раньше Вы начнёте использовать его, тем лучше. На данный момент Atlas распространяется свободно (и будет распространяться), скачать самый новый дистрибутив всегда можно http://atlas.asp.net/default.aspx?tabid=47&subtabid=471.

Hello, World!

После того, как Вы установили Atlas, в шаблонах сайтов в Visual Studio появится новая иконка - ASP .NET 'Atlas' Web Site. Нажмите "ОК".

У Вас появится страница Default.aspx, папка ScriptLibrary и библиотека Microsoft.Web.Atlas.dll в папке Bin. Также Atlas модифицирует файл web.config. Собственно говоря, в папке ScriptLibrary хранятся все скрипты, необходимые для работы Atlas. В библиотеке Microsoft.Web.Atlas.dll хранятся серверные компоненты, о них мы поговорим позднее.

Для начала, мы создадим простенький Web-сервис a la Hello, World.

Добавьте в проект новый Web-сервис и назовите его WebService.asmx. В codebehind этого сервиса добавьте следующие строчки:

Код


Imports System.Web
Imports System.Web.Services
Imports System.Web.Services.Protocols

Namespace AtlasTest

    <WebService(Namespace:="http://tempuri.org/")> _
    <WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)> _
    Public Class WebService
        Inherits System.Web.Services.WebService

        <WebMethod()> _
        Public Function HelloWorld() As String
            Return "Hello, World!"
        End Function

    End Class

End Namespace

Код


using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;

namespace AtlasTest
{

    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    public class WebService : System.Web.Services.WebService
    {
        [WebMethod]
        public string HelloWorld()
        {
            return "Hello, World!";
        }
    }
}

Как видно, наш Web-сервис содержит один лишь метод HelloWorld(), который возвращает строку "Hello, World!".

Далее, напишите в самом asmx-файле сервиса следующую строку:

Код

<%@ WebService Language="VB" CodeBehind="~/App_Code/WebService.vb" Class="AtlasTest.WebService" %>

Всё, наш Web-сервис готов!

Теперь зайдите в Source странички Default.aspx. И немного наберитесь терпения.

Для начала нам необходимо познакомиться с самым важным компонентом Atlas - ScriptManager. Его работа - управлять скриптами Atlas и подключать необходимые к странице. Тег <atlas:ScriptManager> имеет три внутренних тега. Сейчас мы их рассмотрим чуть поближе.

ErrorTemplate - темплэйт, куда записывается сообщение, выскакивающее при ошибке. Он нам сейчас не понадобится.
Scripts - секция, через которую мы можем подключить пользовательские скрипты.
Services - секция, через которую мы можем подключить Web-сервисы к странице.

На данный момент нас интересует только секция Service. Чтобы добавить наш Web-сервис, необходимо написать следующий код:

Код


<atlas:ScriptManager ID="MainScriptManager" runat="server">
    <Services>
        <atlas:ServiceReference Path="WebService.asmx" />
    </Services>
</atlas:ScriptManager>

Прекрасно, мы подключили Web-сервис к нашей странице. Теперь добавьте на страницу следующий код:

Код


<input type="button" value="Послать запрос" onclick="SendQuery();" />
<div id="Result" />

У нас появится два новых элемента на странице - кнопка "Послать запрос" и div. Как Вы, наверное, уже догадались по его неоднозначному имени, в нём будет отображаться результат запроса.

При нажатии на кнопку вызывается функция JavaScript, которую мы сейчас напишем.

Добавьте в секцию head пустой тег script:

Код


<script type="text/javascript">
</script>

Теперь можно писать функции. Код JavaScript выглядит так:

Код


function SendQuery()
{
    // Мы вызываем наш Web-сервис, передавая ему
    // функцию, которая вызывается по получении ответа
    AtlasTest.WebService.HelloWorld(onRequestComplete);
}

function onRequestComplete(result)
{
    // Мы находим тот div
    var ourDiv = document.getElementById("Result");
    // Заполняем его информацией от Web-сервиса
    ourDiv.innerHTML = result;
}

Как видно, код прост до невозможности. Как и ожидалось, после нажатия кнопки под ней повилась надпись "Hello, World!".

Проверить асинхронность можно очень легко: модифицируйте Web-сервис, добавив в код Web-сервиса команду

Код


System.Threading.Thread.Sleep(5000)

Код


System.Threading.Thread.Sleep(5000);

Вы можете спокойно просматривать страницу, а в это время код JavaScript ожидает ответа от сервера.

В следующей статье мы поговорим об автозаполнении TextBox'ов, как в Gmail.

Полный код страницы:

Код


<%@ Page Language="VB" AutoEventWireup="true" CodeFile="Default.aspx.vb" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Untitled Page</title>

    <script type="text/javascript">
        function SendQuery()
        {
            AtlasTest.WebService.HelloWorld(onRequestComplete);
        }

        function onRequestComplete(result)
        {
            var ourDiv = document.getElementById("Result");
            ourDiv.innerHTML = result;
        }
    </script>
</head>
<body>
    <form id="mainForm" runat="server">
        <atlas:ScriptManager ID="MainScriptManager" runat="server">
            <Services>
                <atlas:ServiceReference Path="WebService.asmx" />
            </Services>
        </atlas:ScriptManager>
        <div>
            <input type="button" value="Послать запрос" onclick="SendQuery();" />
            <div id="Result" />
        </div>
    </form>
</body>
</html>

Успехов!

Автор: Exception 13.4.2006, 18:07

Пока я разбираюсь с автозаполнением (не такая простая вещь smile

), представлю несколько новых контролов Atlas "на закуску" smile

CascadingDropDown - асинхронный дропдаун smile

CollapsiblePanel - понелька, умеющая сворачиваться smile

ConfirmButton - позволяет добавить диалог типа "Вы уверены?" к кнопочкам

DragPanel - панель, которую можно таскать по странице

HoverMenu - типа менюшки, выскакивающей при наведении мыши

PopupControl - extender, позволяющий добавить к элементам popup-поведение

ReorderList - назначение понятно, лист позволяет перемещать элементы внутри себя

TextBoxWaterMark - текстбокс с фоном

ToggleButton - чекбокс с картинкой

Качать всё это счастье можно http://atlas.asp.net/default.aspx?tabid=47&subtabid=477.

Радуйтесь, а я пока пойду разбираться с автозаполнением smile

Автор: Exception 15.4.2006, 00:10

Автозаполнение

Разобрался наконец-то smile

.

Итак, для начала нам нужно создать Web-сервис, предоставляющий список строк для автозаполнения. Это сделать нетрудно.

Вот код этого сервиса:

Код


Namespace AtlasTest

    <WebService(Namespace:="http://tempuri.org/")> _
    <WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)> _
    Public Class WebService
        Inherits System.Web.Services.WebService

        Private members As String() = _
        {"arilou", "mr.DUDA", "chipset", "alir", "Exception", "Wowa", "Vit", _
        "Poseidon", "2man", "Akina", "cardinal", "DezmASter", "bagira", _
        "SoWa", "Kagor", "Pegas", "sergej.z", "Gannibal", "ivashkanet", _
        "VisualProgrammerNET", "asdf", "oleg1973", "Guedda"}

        Private _prefixText As String

        <WebMethod()> _
        Public Function GetWordList(ByVal prefixText As String, ByVal count As Integer) As String()
            _prefixText = prefixText
            Dim resultArray(count) As String
            resultArray = Array.FindAll(members, AddressOf ArrayFilter)
            Return resultArray
        End Function

        Private Function ArrayFilter(ByVal item As String) As Boolean
            Return item.StartsWith(_prefix, StringComparison.InvariantCultureIgnoreCase)
        End Function

    End Class

End Namespace

Код


namespace AtlasTest

    [WebService(Namespace="http://tempuri.org/")] _
    [WebServiceBinding(ConformsTo=WsiProfiles.BasicProfile1_1)]
    public class WebService : System.Web.Services.WebService
    {
        private string members =
        {"arilou", "mr.DUDA", "chipset", "alir", "Exception", "Wowa", "Vit",
        "Poseidon", "2man", "Akina", "cardinal", "DezmASter", "bagira",
        "SoWa", "Kagor", "Pegas", "sergej.z", "Gannibal", "ivashkanet",
        "VisualProgrammerNET", "asdf", "oleg1973", "Guedda"}

        private string _prefix;

        [WebMethod]
        public string[] GetWordList(string prefixText, int  count)
        {
            _prefix = prefixText;
            string[] resultArray = new string[count];
            resultArray = Array.FindAll(members, new System.Predicate<string>(ArrayFilter));
            return resultArray;
        }

        private bool ArrayFilter(string item)
        {
            return item.StartsWith(_prefix, StringComparison.InvariantCultureIgnoreCase);
        }

    }

}

Работа этого сервиса проста. Если смотреть на него, как на "чёрный ящик", то можно составить такое описание метода GetWordList:

GetWordList

Параметры:

prefixText - текст, набранный пользователем
count - количество результатов

Результирующее значение: массив, состоящий из не более count строк, начинающихся с префикса prefixText.

Например, если пользователь наберёт "c" на клавиатуре, то в ответ ему придут "chipset" и "cardinal", если, конечно, count больше или равен двум.

Хорошо, мы написали сервис. Что дальше? Как обычно, добавьте на страницу контрол ScriptManager:

Код

<atlas:ScriptManager ID="MyScriptManager" runat="server" />

Далее, добавьте на форму самый что ни на есть обыкновенный TextBox:

Код


<asp:TextBox ID="MyTextBox" runat="server" />

Теперь приступим к самому главному.

Для добавления к полю AutoComplete-поведения нобходимо объявить соответствующий элемент:

Код


<atlas:AutoCompleteExtender runat="server" ID="MyAutoCompleteExtender">
</atlas:AutoCompleteExtender>

Этот контрол позволяет расширять любой TextBox на странице путём добавления соответствующего тега:

Код


<atlas:AutoCompleteProperties TargetControlID="MyTextBox" Enabled="True" ServicePath="WebService.asmx"
    ServiceMethod="GetWordList" MinimumPrefixLength="1" />

Всё просто, не так ли?

Всё, автозаполнение работает!

Полный код страницы:

Код


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0  Transitional//EN" 
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Yo</title>
</head>
<body>
    <form id="mainForm" runat="server">
        <atlas:ScriptManager ID="MyScriptManager" runat="server" />
        <div id="content">
            <asp:TextBox ID="MyTextBox" runat="server" />
            <atlas:AutoCompleteExtender runat="server" ID="MyAutoCompleteExtender">
                <atlas:AutoCompleteProperties
                     TargetControlID="MyTextBox" Enabled="True"
                    ServicePath="WebService.asmx" ServiceMethod="GetWordList"
                    MinimumPrefixLength="1" />
            </atlas:AutoCompleteExtender>
        </div>
    </form>
</body>
</html>

В следующем обзоре мы рассмотрим, как сделать Drag&Drop на странице smile

Успехов!

Автор: Exception 15.4.2006, 15:19

Drag & Drop

Значит, так. На этот раз мы рассмотрим сразу два
способа реализации Drag&Drop на странице.

Способ №1

Сначала мы рассмотрим стандартный способ. Создайте новую страничку. Далее необходимо заполнить её контентом - дело в том, что панели "ездят", то есть двигаются только внутри самой страницы (что понятно), а посему не могут двигаться там, где страницы уже нет smile

. Как вариант - сделать большой div и запихнуть всё в него. Я лично для просмотра границ всяких div'ов пользую Web Developer Toolbar - хороший плагин для Firefox.

Допустим, у нас есть заполненная страничка. Теперь нужно проделать довольно-таки стандартную процедуру - поместить на страницу ScriptManager. Думаю, это Вы умеете smile

. Теперь давайте сделаем две панельки.

Красивыми они у нас не будут - я сейчас не в настроении пускаться
в дизайнерские изыски:

Код


<asp:Panel ID="FirstPanel" runat="server" CssClass="floatPanel">

    <asp:Label ID="FirstLabel" runat="server" Text="Это область, которую можно таскать мышкой :)" />

</asp:Panel>

<asp:Panel ID="SecondPanel" runat="server" CssClass="floatPanel">

    <asp:Label ID="SecondLabel" runat="server" Text="Это область, которую можно таскать мышкой :)" />

</asp:Panel>

Теперь объявим класс CSS floatPanel:

Код


.floatPanel
{
    cursor:move;
    background-color:#a50;
    border-style:solid;
    border-width:1px;
    height:160px;
    width:160px;
}

Кстати, если не поставить background-color, то панель будет прозрачной.

У нас есть страница и две панели. Что с ними делать? Нам нужно добавить к ним поведение Drag&Drop, то есть, чтобы их можно было двигать по всеёй странице.

Для этого мы добавим на страницу ещё один контрол Atlas: DragOverlayExtender.

Этот контрол является чем-то сродни AutoCompleteExtender (как мы потом узнаем, они на самом деле родня ближе чем по Control'у).

Внутри него может быть помещён (и не один) тег DragOverlayProperties (да-да, это аналог AutoCompleteProperties). В нашем случае это будет выглядеть так:

Код


<atlas:DragOverlayExtender ID="MyDragOverlayExtender" runat="server">
    <atlas:DragOverlayProperties TargetControlID="FirstPanel" Enabled="True" />
    <atlas:DragOverlayProperties TargetControlID="SecondPanel" Enabled="True" />
</atlas:DragOverlayExtender>

Кстати, самое интересное, что при добавлении extender'а на страницу у панели появляется свойство DragOverlay с теми же параметрами - оно связывается с DragOverlayProperties.

Вот и готова наша страница! Теперь две панели могут перемещаться по всей области страницы.

Способ №2

Этот способ подразумевает наличие у Вас Atlas Controls Toolkit, о котором я говорил несколькими постами выше.

Он является более удобным и совершенным.

Давайте чуточку видоизменим панели. Для начала, уберите из стиля строку

Код


    cursor:move;

Мы сделаем так, чтобы двигать панель можно было только за определённый участок.

Добавим по "заголовку" в панели:

Код


<asp:Panel ID="FirstPanel" runat="server" CssClass="floatPanel">

    <asp:Label ID="FirstHeader" runat="server" Text="Тащи за меня" CssClass="panelHeader" />

    <br />

    <asp:Label ID="FirstLabel" runat="server" Text="Здесь находится содержание панели" />

</asp:Panel>

<asp:Panel ID="SecondPanel" runat="server" CssClass="floatPanel">

    <asp:Label ID="SecondHeader" runat="server" Text="Тащи за меня" CssClass="panelHeader" />

    <br />

    <asp:Label ID="SecondLabel" runat="server" Text="Здесь находится содержание панели" />

</asp:Panel>

Собственно, объявим класс CSS panelHeader так:

Код


.panelHeader
{
    font-weight:bold;
    cursor:move;
}

Это будет та область, за которую можно "таскать" мышкой панель.

Ну и самое главное - необходимо объявить DragPanelExtender из Atlas Control Toolkit. В нашем случае это объявление выглядит так:

Код


<atlasToolkit:DragPanelExtender ID="MyDragPanelExtender" runat="server">
    <atlasToolkit:DragPanelProperties TargetControlID="FirstPanel" DragHandleID="FirstHeader" />
    <atlasToolkit:DragPanelProperties TargetControlID="SecondPanel" DragHandleID="SecondHeader" />
</atlasToolkit:DragPanelExtender>

Всё очень просто smile

. Вот мы и познакомились с техникой создания Drag&Drop на странице.

Полный код страницы (я пишу только для варианта № 2, для первого надо чуть изменить):

Код


 <%@ Register Assembly="AtlasControlToolkit" Namespace="AtlasControlToolkit" TagPrefix="atlasToolkit" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0  Transitional//EN" 
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Drag&Drop</title>
    <style type="text/css">
    .floatPanel
    {
        background-color:#a50;
        border-style:solid;
        border-width:1px;
        height:160px;
        width:160px;
    }
    .panelHeader
    {
        font-weight:bold;
        cursor:move;
    }
    </style>
</head>
<body>
    <form id="mainForm" runat="server">
        <div id="content" style="text-align: center;">
            <atlas:ScriptManager ID="MyScriptManager" runat="server" />

            <asp:Panel ID="FirstPanel" runat="server" CssClass="floatPanel">

                <asp:Label ID="FirstHeader" runat="server" Text="Тащи за меня" CssClass="panelHeader" />

                <br />

                <asp:Label ID="FirstLabel" runat="server" Text="Здесь находится содержание панели" />

            </asp:Panel>

            <asp:Panel ID="SecondPanel" runat="server" CssClass="floatPanel">

                <asp:Label ID="SecondHeader" runat="server" Text="Тащи за меня" CssClass="panelHeader" />

                <br />

                <asp:Label ID="SecondLabel" runat="server" Text="Здесь находится содержание панели" />

            </asp:Panel>

            <atlasToolkit:DragPanelExtender ID="MyDragPanelExtender" runat="server">

                <atlasToolkit:DragPanelProperties TargetControlID="FirstPanel" DragHandleID="FirstHeader" />

                <atlasToolkit:DragPanelProperties TargetControlID="SecondPanel" DragHandleID="SecondHeader" />

            </atlasToolkit:DragPanelExtender>

            Здесь должен находиться контент страницы

        </div>
    </form>
</body>
</html>

До скорых встреч!

P.S. В следующий раз мы рассмотрим ещё парочку контролов из Atlas Control Toolkit, в частности, CollapsiblePanelExtender.

Автор: TheAviator 23.4.2006, 12:44

I'm sorry
А разве в ASP.NET 2.0 поддержка динамического обновления не встроена стандарным компонентам типа выпадающего списка и т.д?
А зачем тогда Atlas ?

Автор: Exception 23.4.2006, 14:10

Не встроена.

Автор: celarent 14.7.2006, 12:21

здорово! на русском информации, связанной с Atlas мало. Так, в порядке интереса: не хотите этот текст таки отдельной статьей на http://www.ajaxplanet.ru повесить? icq 59375609

Автор: Pankon 17.7.2006, 14:17

Куда девается результат запроса (Atlas), если страница приемник была закрыта пользователем?

И как отследить, что страница приемник была закрыта пользователем?

Ну и до кучи - как организовать timeout для запросов при использовании atlas?

Автор: Exception 17.7.2006, 17:47

Цитата(celarent @ 14.7.2006, 13:21

)

не хотите этот текст таки отдельной статьей на AJAX Planet повесить? icq 59375609

Пожалуйста, с такими вопросами -- в личку. Посмотрим.

Цитата(Pankon @ 17.7.2006, 15:17

)

Куда девается результат запроса (Atlas), если страница приемник была закрыта пользователем?

Никуда он не девается. Это же не материальный объект, чтобы ему куда-то деваться smile

Цитата(Pankon @ 17.7.2006, 15:17

)

как отследить, что страница приемник была закрыта пользователем?

Никак. Потому что сервер ничего не знает о приёмнике. И не должен -- тут своеобразная разделённая архитектура -- ведь клиентом web-сервера может быть и Atlas-страница и десктопное приложение и т.п.

Цитата(Pankon @ 17.7.2006, 15:17

)

как организовать timeout для запросов при использовании atlas?

Это точно можно сделать, но не помню, как smile

Автор: Pankon 19.7.2006, 14:06

Цитата(Exception @ 17.7.2006, 17:47

)

Цитата(Pankon @ 17.7.2006, 15:17)
Куда девается результат запроса (Atlas), если страница приемник была закрыта пользователем?
Никуда он не девается. Это же не материальный объект, чтобы ему куда-то деваться

Впринципе, информацию можно назвать "материальной" (остальное в форуме по философии smile

)

Цитата(Exception @ 17.7.2006, 17:47

)

Цитата(Pankon @ 17.7.2006, 15:17)
как отследить, что страница приемник была закрыта пользователем?
Никак. Потому что сервер ничего не знает о приёмнике. И не должен -- тут своеобразная разделённая архитектура -- ведь клиентом web-сервера может быть и Atlas-страница и десктопное приложение и т.п.

Это-то понятно.

Все-таки хотелось бы найти решение следующей проблемы.

Цитата(Pankon @ 17.7.2006, 14:17

)

И как отследить, что страница приемник была закрыта пользователем?

или пользователь першел на другую, не дождавшись появления AJAX запроса, тем самым прекратить на сервере подготовку информации...

Автор: Exception 19.7.2006, 14:24

По сути, никак. Это вообще нереализуемо в web.

Автор: Pankon 19.7.2006, 18:09

Автор: mr.DUDA 19.7.2006, 21:11

Другое дело если используются Rich Client Applications ;)

Автор: ivashkanet 5.10.2006, 13:52

Цитата(Pankon @ 19.7.2006, 14:06

)

Можно "заставить" клиента опрашивать сервер на том же Аяксе.
Хотя я не представляю какой такой запрос может выполняться на сервере больше... ммм... 5-10 сек smile

Добавлено @ 13:52
поправочка --- публичный запрос. Т.е. от любого встречного smile

Автор: Pankon 5.10.2006, 14:35

Цитата(ivashkanet @ 5.10.2006, 13:52

)

Хотя я не представляю какой такой запрос может выполняться на сервере больше... ммм... 5-10 сек

Засекай время:

1. Загрузка файла (несколько МБ) на сервер с клиента. smile

+
2. Чтение каждой строки из файла с последующим UPDATE соответствующих записей в БД... smile

+
3. Сообщить пользователю, что его update успешно произведен и были актуализированы n-сотен тысяч записей... smile

Стоп! Сколько у тебя получилось мммминут?

И это очень простой пример.... smile

Автор: ivashkanet 5.10.2006, 14:40

Цитата(Pankon @ 5.10.2006, 14:35

)

1. Загрузка файла (несколько МБ) на сервер с клиента. +2. Чтение каждой строки из файла с последующим UPDATE соответствующих записей в БД... +3. Сообщить пользователю, что его update успешно произведен и были актуализированы n-сотен тысяч записей...

Интересно.............

1. Если передавать закончили и контрольная сумма не совпадает, то было закрытие
2. Нихрена не понял. Какой такой файл? Его что любой встречный-поперечный на сервер залить может? А его структура, .....
3. Меньше сотой секунды

smile

Добавлено @ 14:43
Короче вся проблемма в 2. Но эта проблемма в архитектуре приложения

Автор: Pankon 5.10.2006, 15:01

Цитата(ivashkanet @ 5.10.2006, 14:40

)

Какой такой файл?

Ну, вообще, текстовый... И естественно не встречный-поперечный, а авторизованный пользователь - представитель фирмы(одной из фирм), которая и создает(как создает-это не важно) такой "специальный" файл для активизации данных портала, для уже "своих" юзверей...

ПС. Вообще.. топик был про Atlas......

Автор: ivashkanet 5.10.2006, 15:06

Pankon, тогда ему, ИМХО, нужно дождаться. А хотя... Главное, что он отправил файл, а вот ответ сервера можно получить и позже (через час, например)

Цитата(Pankon @ 5.10.2006, 15:01

)

ПС. Вообще.. топик был про Atlas......

Т.е. ответ тебе не нужен smile

Как хошь

Автор: Red Wind 5.10.2006, 23:48

Здравствуйте.
Есть такой вопрос. Как выложить сайт который построен с использованием атлас на хостинг?
Выложил. Ошибок никаких не вылазит. Но фишки которые должны юзать атлас не палят. Может в Web.config надо что-нибудь подправить. Там ещё такая штука написана:

Так вот, что сделать, что бы атлас корректно заработал.

Автор: Exception 19.10.2006, 03:26

А симптомы какие smile

? Ну, ошибки какие и т.д.

Автор: davandr 19.10.2006, 12:31

Скажите, пожалуйста, а можно ли применять Atlas технологию уже к существующему проекту, созданному не по шаблону 'Atlas' Web Site, а как обычный Web Site? Если да, то пару слов о том, как.

Автор: ivashkanet 19.10.2006, 13:09

davandr, если в паре слов, то, ИМХО, да:
Подключаешь библиотеку Atlas-а и юзаешь его фичи.
Ведь, по сути, это обычная АСП .нэт страничка, только используящая "нестандартную" библиотеку smile

Автор: davandr 19.10.2006, 13:18

Еще меня интересуют такие вопросы
- можно ли использовать атлас без вэб-сервисов?
- есть такая идея: сделать заполнение грида данными из базы по нажатию кнопки, т.е. я ввожу в каком-то текстбоксе начальные буквы (как в примере с автозаполнением), например, "12"? а мне в грид из базы считываются все соответсвующие строки где значение поля Name начинается с "12"?
как такое возможно реализовать и возможно ли вообще?

Автор: ivashkanet 19.10.2006, 13:24

Цитата(davandr @ 19.10.2006, 13:18

)

- можно ли использовать атлас без вэб-сервисов?

Думаю да, но с сервисами все намного проще smile

Цитата(davandr @ 19.10.2006, 13:18

)

как такое возможно реализовать и возможно ли вообще?

Возможно. Даже не особо сложно, а вот как --- в отдельную тему smile

Автор: $tatic 23.10.2006, 09:56

Кстати мне показалось, или действительно многие Atlas-странички в IE не работают (или работают некорректно)? smile

Автор: HUJG 19.12.2006, 16:15

Поставил AJAX 1.0 RC.
Не могу из ф-ции JavaScript вызвать веб-сервис. Компилирую первый пример exeption-а, чуть его подредактировав (atlas->asp и

Код


<%@ Register Assembly="Microsoft.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" Namespace="Microsoft.Web.UI" TagPrefix="asp" %>

)
При нажатии на батон, выдается ошибка на странице AtlasTest is undefined.

Автор: Pankon 20.12.2006, 12:57

Медераторам: А не пора ли открыть новый форум - > ASP.NET AJAX аля ATLAS

Автор: Madrid 20.12.2006, 15:15

Скачал файлик ASPAJAXExtSetup.msi по этой ссылке:

http://www.microsoft.com/downloads/details.aspx?FamilyId=8FA6E076-582B-440F-95CB-C40ED23FDF59&displaylang=en

Установил!В шаблонах сайтов в Visual Studio появляется иконка ASP.NET AJAX-Enabled Web Site, хотя выше прочёл что должен был появится пункт ASP .NET 'Atlas' Web Site.
Дайте пожалуйста точную ссылку на Atlas!

Автор: Дрон 20.12.2006, 15:17

Цитата(Madrid @ 20.12.2006, 15:15

)

Установил!В шаблонах сайтов в Visual Studio появляется иконка ASP.NET AJAX-Enabled Web Site, хотя выше прочёл что должен был появится пункт ASP .NET 'Atlas' Web Site.
Дайте пожалуйста точную ссылку на Atlas!

Это нынче сложно. То, что называлось Atlas просто переименовали в ASP.NET AJAX smile

Автор: Pankon 20.12.2006, 15:18

Цитата(Madrid @ 20.12.2006, 15:15

)

Дайте пожалуйста точную ссылку на Atlas!

Зачем тебе ATLAS, он уже, можно сказать, устарел

Автор: Madrid 20.12.2006, 16:04

т.е. тго что у меня есть вполне достаточно?

Автор: Pankon 20.12.2006, 16:06

Цитата(Madrid @ 20.12.2006, 16:04

)

тго что у меня есть вполне достаточно?

для реализации ассинхронных обрашений к серверу - ДА

Автор: HUJG 20.12.2006, 16:29

Madrid
Вот ссылка на Atlas если нужно http://www.microsoft.com/downloads/details.aspx?FamilyId=D746076A-3352-4407-B9D5-832BA4DFFC7B&displaylang=en
В нем хоть у меня примеры работают, в отличии 1.0 RC smile

Автор: Madrid 20.12.2006, 16:47

Цитата

Madrid
Вот ссылка на Atlas если нужно http://www.microsoft.com/downloads/details...;displaylang=en
В нем хоть у меня примеры работают, в отличии 1.0 RC

Благодарю!!!!

Автор: Competitor 17.1.2007, 15:10

Насколько я понял, Ajax по большому счету нужен для того, чтобы дергать серверные методы из клиентского скрипта? Если не прав, поправьте

Автор: Pankon 24.1.2007, 23:54

Ну вот и ASP.NET AJAX 1.0 от 23.01.2007

Читаем http://ajax.asp.net/

Качаем http://go.microsoft.com/fwlink/?LinkID=77296

Автор: Zakonnic 3.2.2007, 15:25

Хех... А у меня Atlas не захотел работать под Opera. Правда, это была старая версия, сейчас может умеет?

В любом случае, реализовал вариант без Атласа, описанный в Wikipedia. Весь atlas заменяют 3 java-функции. Повозиться, правда, приходится. Зато все везде работает и ничего при этом не требует.

Вот этот вариант, собранный из кусков и чуть подправленный:

Default.aspx - обычная страница, где на onmouseover динамически подгружаются данные.

Код


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>My Page</title>

    <script type="text/javascript">
    
    function getHTTPRequestObject() 
    {
        var xmlHttpRequest;
        /*@cc_on
        @if (@_jscript_version >= 5)
            try 
            {
                xmlHttpRequest = new ActiveXObject("Msxml2.XMLHTTP");
            } 
            catch (exception1) 
            {
                try 
                {
                    xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
                } 
                catch (exception2) 
                {
                    xmlHttpRequest = false;
                }
            }
        @else
            xmlhttpRequest = false;
        @end @*/

        if (!xmlHttpRequest && typeof XMLHttpRequest != 'undefined') 
        {
            try 
            {
                xmlHttpRequest = new XMLHttpRequest();
            } 
            catch (exception) 
            {
                xmlHttpRequest = false;
            }
        }
        return xmlHttpRequest;
    }

    var httpRequester = getHTTPRequestObject();
    var couldProcess = false;
    var serverSideURL = "Service.aspx";
    var COMPLETE = 4;

    function displayMessageBody( messageID ) 
    {
        idToDisplay = messageID
        if (!couldProcess && httpRequester) 
        {
            //просто индикатор адреса запроса
            var info = document.getElementById("info");
            info.innerHTML = serverSideURL + "?message_id=" + escape(messageID);
            
            //собственно запрос
            httpRequester.open("POST", serverSideURL + "?message_id=" + escape(messageID),true);
            httpRequester.onreadystatechange = processResponse;
            couldProcess = true;
            httpRequester.send(null);
        }
    }
    
    function processResponse() 
    {    
        if ( httpRequester.readyState == COMPLETE ) 
        {//это константа, объявлена локально,  ее значение равно 4
            var txt = httpRequester.responseText;
            if ( txt.indexOf('invalid') == -1 ) 
            {
                //выводим ответ сервера в div-элемент 'preview'
                document.getElementById('preview').innerHTML = txt;
                document.getElementById('TextArea1').innerHTML = txt;
                couldProcess = false;
            }
        }
    }    
    </script>

</head>
<body>
    <div>
        <table>
            <thead id="tableHeader">
                <tr>
                    <td>
                        From</td>
                    <td>
                        Subject</td>
                </tr>
            </thead>
            <tbody>
                <tr onmouseover="displayMessageBody(1)">
                    <td>
                        John Doe</td>
                    <td>
                        Greetings</td>
                </tr>
                <tr onmouseover="displayMessageBody(2)">
                    <td>
                        Joanna Doe</td>
                    <td>
                        Status of the report</td>
                </tr>
                <tr onmouseover="displayMessageBody(3)">
                    <td>
                        Jim Doe</td>
                    <td>
                        Meeting is today</td>
                </tr>
            </tbody>
        </table>
    </div>
    <br />
    Request:
    <div id="info" >            
    </div>
    <br />
    Result:            
    <br />
    <div id="preview">
    </div>
    <textarea id="TextArea1" style="font-size: 10pt; width: 100%; font-family: 'Courier New';
        height: 323px"></textarea><br />

</body>
</html>

Service.aspx - тоже обычная страница, где удалено все ненужное.

Код


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Service.aspx.cs" Inherits="Service" %>

Да! Все правильно. Там ничего больше нет. Хотя можете дописать и посмотреть, что приходит в ответ.

Service.aspx.cs

Код


using System;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class Service : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (Request.Params["message_id"] != null)
        {
            switch (Request.Params["message_id"])
            {
                case "1":
                    Response.Output.Write("John Doe,Greetings,10-10-2005,Hi.I am doing good");
                    break;
                case "2":
                    Response.Output.Write("Joanna Doe,Hi,10-10-2005,Document is complete.");
                    break;
                case "3":
                    Response.Output.Write("Joanna Doe,Hi,10-10-2005,Meeting is at 3.");
                    break;
            }
        }
        else
        {
            Response.Output.Write(",NA ,NA ,NA ,Nothing to display");
        }
    }
}

За комментариями - в Википедию, статья "AJAX".

Автор: Pankon 9.2.2007, 18:16

http://ajax.asp.net/ajaxtoolkit/Accordion/Accordion.aspx тоже не плохо

Автор: Pankon 19.7.2007, 13:51

Часто встречающиеся исключение

Код


Sys.WebForms.PageRequestManagerParserErrorException

http://weblogs.asp.net/leftslipper/archive/2007/02/26/sys-webforms-pagerequestmanagerparsererrorexception-what-it-is-and-how-to-avoid-it.aspx

ПС. Ссылка предоставлена Idsa в одном из топиков

Автор: EuGenius_Krivbass 30.1.2008, 13:26

Так а что? Цикл статей прекратился? Где обещанный CollapsiblePanelExtender?

Автор: hahol 31.12.2008, 22:40

емаааа народ .....

ваще чёт чашко я тут все понимаю =)

наверно это изза того что я в асп меньше недели ) ) )

посоветуйте литературку - только просьба ))) - НА Русском - читабельную (что бы был учебник а не справочник , где все все все ... а как это использовать хз ((( ... )

а да .... чуть не забыл )))

у мя VS Team Edition 2008 в ней есть какието компоненты для работы с ajax они подойдут или надо качать с той ссцылки которую давал автор статей ? smile