ASP.NET AJAX простое приложение с использованием XMLHttpRequest

Я новичок в ASP.NET и Ajax. Я пытаюсь реализовать пример приложения, которое обновляет веб-форму без обратной передачи. При щелчке мое приложение отправляет запрос на свой сервер с помощью XMLHttpRequestModule и отображает данные, полученные через окно предупреждения.ASP.NET AJAX простое приложение с использованием XMLHttpRequest

Я думаю, проблема может заключаться в том, что страница default.aspx.cs не передает httpRequest.responseText к ее веб-форме.

cf. Метод sendRequest находится в XMLHttpRequestModule для проверки совместимости с браузерами и отправки запроса с использованием указанных параметров и методов.

Любая помощь очень ценится.

default.aspx

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title></title> 
<script type="text/javascript" src="XMLHttpRuquestModule.htm"></script> 
<script type="text/javascript"> 

    function helloToServer() { 
     var params = "name=" + encodeURIComponent(document.form.name.value); 
     sendRequest("Default.aspx", params, helloFromServer, "POST"); 
    } 

    function helloFromServer() { 
     if (httpRequest.readyState == 4) { 
      if (httpRequest.status == 200) { 
       alert("Response: " + httpRequest.responseText); 
      } 
     } 
    } 

</script> 
</head> 
<body> 
<form name ="form" runat="server"> 
<input type="text" name="name" /> 
<input type="button" value="enter" onclick="helloToServer()" /> 
</form> 
</body> 
</html>

Default.aspx.cs

public partial class _Default : System.Web.UI.Page 
{ 
protected void Page_Load(object sender, EventArgs e) 
{ 
    String name = Request["name"]; 
    Response.Write(name); 
    return; 
} 
}

XMLHttpRequestModule

<head> 
<title></title> 
<script type="text/javascript"> 
    var httpRequest = null; 

    function getXMLHttpRequest() { 
     if (window.ActiveXObject) { 
      try { 
       return new ActiveXObject("Msxml2.XMLHTTP"); 
      } catch (e) { 
       try { 
        return new ActiveXObject("Microsoft.XMLHTTP"); 
       } catch (e1) { 
        return null; 
       } 
      } 
     } else if (window.XMLHttpRequest) { 
      return new XMLHttpRequest(); 
     } else { 
      return null; 
     } 
    } 

    function sendRequest(url, params, callback, method) { 
     httpRequest = getXMLHttpRequest(); 
     var httpMethod = method ? method : 'GET'; 
     if (httpMethod != 'GET' && httpMethod != 'POST') { 
      httpMethod = 'GET'; 
     } 
     var httpParams = (params == null || params == '') ? null : params; 
     var httpUrl = url; 
     if (httpMethod == 'GET' && httpParams != null) { 
      httpUrl = httpUrl + "?" + httpParams; 
     } 
     httpRequest.open(httpMethod, httpUrl, true); 
     httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); 
     httpRequest.onreadystatechange = callback; 
     httpRequest.send(httpMethod == 'POST' ? httpParams : null); 
    } 

</script> 
</head>

источник

2012-01-05 Si Young Kim

Что такое «ср sendRequest 'и где это в вашем коде? – Abbas

Метод sendRequest находится в XMLHttpRequestModule.htm, который я упоминал в этом коде. Метод sendRequest имеет четыре параметра (url, params, callback и метод) –

Вы хотите, чтобы я загрузил XMLHttpRequestModule.htm? –

На ваш вопрос вы упомянули XMLHttpRequestModule, который вы указали в теге скрипта: <script type="text/javascript" src="XMLHttpRuquestModule.htm"></script>. XMLHttpRuquestModule.htm имеет орфографическую ошибку («Ruquest» вместо «Request»), возможно, это вызывает вашу ошибку.

Также обратите внимание, что включение htm-файла в скрипт будет работать только в том случае, если в этом файле есть JavaScript и нет фактического html.

EDIT:

Об этом со ссылкой на наш обмен в разделе комментариев.

Мне удалось овладеть сервером ASP.NET, запустив код Ajax на странице ASPX точно так же, как и ваш, и все по-прежнему в порядке. В поле предупреждения по-прежнему появляется правильный ответ.

Разница в том, что, как первоначально было предложено, я переименовал ваш XMLHttpRuquestModule.htm в XMLHttpRuquestModule.js и удалил из него всю разметку.

я копирую весь код здесь, попробуйте вставить его в точности, а затем запустить его:

HTML файла (testXhr.HTM):

<html> 
    <head> 
    <title></title> 
    <script type="text/javascript" src="XMLHttpRequestModule.js"></script> 
    <script type="text/javascript"> 

     function helloToServer() { 
      var params = "name=" + encodeURIComponent(document.form.name.value); 
      sendRequest("Default.aspx", params, helloFromServer, "POST"); 
     } 

     function helloFromServer() { 
      if (httpRequest.readyState == 4) { 
       if (httpRequest.status == 200) { 
        alert("Response: " + httpRequest.responseText); 
       } 
      } 
     } 

    </script> 
    </head> 
    <body> 
     <form name ="form" runat="server"> 
      <input type="text" name="name" /> 
      <input type="button" value="enter" onclick="helloToServer()" /> 
     </form> 
    </body> 
</html>

JavaScript файла (XMLHttpRequestModule.js):

var httpRequest = null; 

function getXMLHttpRequest() { 
    if (window.ActiveXObject) { 
     try { 
      return new ActiveXObject("Msxml2.XMLHTTP"); 
     } catch (e) { 
      try { 
       return new ActiveXObject("Microsoft.XMLHTTP"); 
      } catch (e1) { 
       return null; 
      } 
     } 
    } else if (window.XMLHttpRequest) { 
     return new XMLHttpRequest(); 
    } else { 
     return null; 
    } 
} 

function sendRequest(url, params, callback, method) { 
    httpRequest = getXMLHttpRequest(); 
    var httpMethod = method ? method : 'GET'; 
    if (httpMethod != 'GET' && httpMethod != 'POST') { 
     httpMethod = 'GET'; 
    } 
    var httpParams = (params == null || params == '') ? null : params; 
    var httpUrl = url; 
    if (httpMethod == 'GET' && httpParams != null) { 
     httpUrl = httpUrl + "?" + httpParams; 
    } 
    httpRequest.open(httpMethod, httpUrl, true); 
    httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); 
    httpRequest.onreadystatechange = callback; 
    httpRequest.send(httpMethod == 'POST' ? httpParams : null); 
}

источник

2012-01-05 07:31:35 Abbas

Спасибо, что указали ошибку! Код по-прежнему не работает, хотя :(В файле htm есть только код JavaScript в его голове. –

Добро пожаловать. Что вы подразумеваете под «в голове»? Атрибут src ожидает текстовый файл без разметки в нем вообще Кроме того, почему вы используете файл .htm вместо .js. – Abbas

Вы правы. Я должен был использовать .js без какого-либо тега! Треска не работает, хотя :( –

Есть много проблем с использованием XMLHttpRequest напрямую. одна из них - кросс-браузерная совместимость. Вы должны попробовать использовать jQuery для создания вызовов ajax. и вы можете создавать WebMethods - это страница ASP.Net, которая вызывается из javascript. взглянуть на них

Using jQuery for AJAX with ASP.NET Webforms

http://encosia.com/using-jquery-to-directly-call-aspnet-ajax-page-methods/

EDIT:

В вы хотите использовать чистый Javascript попробовать

http://lamahashim.blogspot.com/2010/03/accessing-aspnet-webmethod-from.html

http://msdn.microsoft.com/en-us/library/ms535874%28v=vs.85%29.aspx

источник

2012-01-05 07:17:01

Спасибо за ваш комментарий, но я хотел бы попробовать использовать XMLHttpRequest, чтобы узнать, как он работает. Кроме того, я думаю, что я уже решил некоторые проблемы совместимости, используя инструкцию if-catch в моем модуле XMLHttpRequest. –

Вы правы, вы можете создать свою собственную логику для обработки проблем с перекрестным браузером. –

Я отредактировал свой ответ для чистого javascript –

ASP.NET AJAX простое приложение с использованием XMLHttpRequest

ответ

Смежные вопросы