Вызовите функцию ASP.NET из JavaScript?

Я пишу веб-страницу в ASP.NET. У меня есть код JavaScript, и у меня есть кнопка отправки с событием click.

Можно ли вызвать метод, который я создал в ASP, с событием кликов JavaScript?

ОТВЕТЫ

Ответ 1

Хорошо, если вы не хотите делать это с помощью Ajax или каким-либо другим способом и просто хотите, чтобы произошла нормальная обратная передача ASP.NET, вот как вы это делаете (без использования каких-либо других библиотек):

Немного сложно, но...:)

я. В вашем файле кода (при условии, что вы используете С# и .NET 2.0 или новее) добавьте следующий интерфейс в свой класс страницы, чтобы он выглядел как

public partial class Default : System.Web.UI.Page, IPostBackEventHandler{}

II. Это должно добавить (используя Tab - Tab) эту функцию в ваш файл кода:

public void RaisePostBackEvent(string eventArgument) { }

III. В своем событии onclick в JavaScript напишите следующий код:

var pageId = '<%=  Page.ClientID %>';
__doPostBack(pageId, argumentString);

Это вызовет метод "RaisePostBackEvent" в вашем файле кода с "eventArgument" как "аргументString", который вы передали из JavaScript. Теперь вы можете вызвать любое другое событие, которое вам нравится.

P.S: Это "underscore-underscore-doPostBack"... И в этой последовательности не должно быть места... Как-то WMD не позволяет мне писать символы подчеркивания, за которыми следует символ!

Ответ 2

Метод __doPostBack() работает хорошо.

Еще одно решение (очень хакерское) - просто добавить невидимую кнопку ASP в свою разметку и щелкнуть по ней с помощью метода JavaScript.

<div style="display: none;">
   <asp:Button runat="server" ... OnClick="ButtonClickHandlerMethod" />
</div>

Из вашего JavaScript загрузите ссылку на кнопку с помощью ClientID, а затем вызовите метод .click().

var button = document.getElementById(/* button client id */);

button.click();

Ответ 3

Microsoft AJAX library выполнит это. Вы также можете создать собственное решение, которое предполагает использование AJAX для вызова собственных aspx (как в основном) script файлов для выполнения функций .NET.

Я предлагаю библиотеку Microsoft AJAX. После установки и ссылки вы просто добавляете строку на странице загрузки или init:

Ajax.Utility.RegisterTypeForAjax(GetType(YOURPAGECLASSNAME))

Затем вы можете делать такие вещи, как:

<Ajax.AjaxMethod()> _
Public Function Get5() AS Integer
    Return 5
End Function

Затем вы можете называть его на своей странице следующим образом:

PageClassName.Get5(javascriptCallbackFunction);

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

Ответ 4

Вы можете сделать это асинхронно с помощью .NET Ajax PageMethods. См. здесь или здесь.

Ответ 5

Библиотека Microsoft AJAX выполнит это. Вы также можете создать собственное решение, которое предполагает использование AJAX для вызова собственных aspx (как в основном) script файлов для выполнения функций .NET.

Это библиотека под названием AjaxPro, на которой был написан MVP с именем Michael Schwarz. Это была библиотека, не написанная Microsoft.

Я широко использовал AjaxPro, и это очень хорошая библиотека, которую я бы рекомендовал для простых обратных вызовов на сервере. Он отлично работает с версией Ajax Microsoft без проблем. Тем не менее, я бы отметил, с легкостью Microsoft сделала Ajax, я бы использовал его, если это действительно необходимо. Для выполнения некоторых очень сложных функций, которые вы получаете от Microsoft, требуется много JavaScript, просто отбросив их на панель обновления.

Ответ 6

Статическое, строго типизированное программирование всегда казалось мне очень естественным, поэтому сначала я сопротивлялся изучению JavaScript (не говоря уже о HTML и CSS), когда мне приходилось создавать веб-интерфейсы для моих приложений. Я бы сделал все, чтобы обойти это, как перенаправление на страницу только для выполнения и действий в событии OnLoad, если бы я мог кодировать чисто С#.

Однако вы обнаружите, что если вы собираетесь работать с веб-сайтами, вы должны иметь открытый ум и начать думать о веб-ориентировании (то есть не пытайтесь делать клиентские вещи на сервере и наоборот -versa). Я люблю веб-формы ASP.NET и все еще использую его (а также MVC), но я скажу, что, пытаясь сделать вещи проще и скрывая разделение клиента и сервера, это может запутать новичков и на самом деле в конечном итоге затрудняет работу.

Мой совет - изучить базовый JavaScript (как регистрировать события, извлекать объекты DOM, манипулировать CSS и т.д.), и вы найдете веб-программирование намного более приятным (не говоря уже проще). Многие люди упомянули разные библиотеки Ajax, но я не видел реальных примеров Ajax, так что вот оно. (Если вы не знакомы с Ajax, все, что он делает, делает асинхронный HTTP-запрос для обновления контента (или, возможно, выполняет действия на стороне сервера в вашем сценарии) без перезагрузки всей страницы или полной обратной передачи.

Client-Side:

<script type="text/javascript">
var xmlhttp = new XMLHttpRequest(); // Create object that will make the request
xmlhttp.open("GET", "http://example.org/api/service", "true"); // configure object (method, URL, async)
xmlhttp.send(); // Send request

xmlhttp.onstatereadychange = function() { // Register a function to run when the state changes, if the request has finished and the stats code is 200 (OK). Write result to <p>
    if (xmlhttp.readyState == 4 && xmlhttp.statsCode == 200) {
          document.getElementById("resultText").innerHTML = xmlhttp.responseText;
     }
 };
 </script>

Что это. Хотя имя может вводить в заблуждение, результат может быть как в обычном тексте, так и в JSON, но вы не ограничены XML. jQuery обеспечивает еще более простой интерфейс для создания Ajax-вызовов (среди упрощения других задач JavaScript).

Запрос может быть HTTP-POST или HTTP-GET и не должен быть на веб-странице, но вы можете отправлять сообщения любой службе, которая слушает HTTP-запросы, такие как RESTful API. ASP.NET MVC 4 Web API позволяет настроить веб-службу на стороне сервера, чтобы обработать запрос как легкий ветерок. Но многие люди не знают, что вы также можете добавить API-контроллеры в проект веб-форм и использовать их для обработки таких вызовов Ajax, как это.

на стороне сервера:

public class DataController : ApiController
{
    public HttpResponseMessage<string[]> Get()
    {
        HttpResponseMessage<string[]> response = new HttpResponseMessage<string[]>(
            Repository.Get(true),
            new MediaTypeHeaderValue("application/json")
        );

        return response;
    }
}

Global.asax

Затем просто зарегистрируйте HTTP-маршрут в файле Global.asax, поэтому ASP.NET будет знать, как направить запрос.

void Application_Start(object sender, EventArgs e)
{
    RouteTable.Routes.MapHttpRoute("Service", "api/{controller}/{id}");
}

С помощью AJAX и контроллеров вы можете в любое время отправить сервер на сервер асинхронно для выполнения любой операции на стороне сервера. Этот один-два удара обеспечивает как гибкость JavaScript, так и мощь С#/ASP.NET, предоставляя людям, посещающим ваш сайт, лучший общий опыт. Не жертвуя ничем, вы получаете лучшее из обоих миров.

Ссылки

Ответ 7

Я думаю, что сообщение в блоге Как получить и показать данные базы данных SQL Server на странице ASP.NET с использованием Ajax (jQuery).

Код JavaScript

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script language="javascript" type="text/javascript">

    function GetCompanies() {
        $("#UpdatePanel").html("<div style='text-align:center; background-color:yellow; border:1px solid red; padding:3px; width:200px'>Please Wait...</div>");
        $.ajax({
            type: "POST",
            url: "Default.aspx/GetCompanies",
            data: "{}",
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: OnSuccess,
            error: OnError
        });
    }

    function OnSuccess(data) {
        var TableContent = "<table border='0'>" +
                                "<tr>" +
                                    "<td>Rank</td>" +
                                    "<td>Company Name</td>" +
                                    "<td>Revenue</td>" +
                                    "<td>Industry</td>" +
                                "</tr>";
        for (var i = 0; i < data.d.length; i++) {
            TableContent += "<tr>" +
                                    "<td>"+ data.d[i].Rank +"</td>" +
                                    "<td>"+data.d[i].CompanyName+"</td>" +
                                    "<td>"+data.d[i].Revenue+"</td>" +
                                    "<td>"+data.d[i].Industry+"</td>" +
                                "</tr>";
        }
        TableContent += "</table>";

        $("#UpdatePanel").html(TableContent);
    }

    function OnError(data) {

    }
</script>

Операционная функция сервера ASP.NET

[WebMethod]
[ScriptMethod(ResponseFormat= ResponseFormat.Json)]
public static List<TopCompany> GetCompanies()
{
    System.Threading.Thread.Sleep(5000);
    List<TopCompany> allCompany = new List<TopCompany>();
    using (MyDatabaseEntities dc = new MyDatabaseEntities())
    {
        allCompany = dc.TopCompanies.ToList();
    }
    return allCompany;
}

Ответ 8

Это так легко для обоих сценариев (то есть синхронно/асинхронно), если вы хотите запускать обработчик событий на стороне сервера, например, событие нажатия кнопки.

Для запуска обработчика события элемента управления: Если вы добавили ScriptManager на свою страницу уже, пропустите шаг 1.

  • Добавьте в страницу клиента script следующую страницу

    //<![CDATA[
var theForm = document.forms['form1'];
if (!theForm) {
    theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>

    1. Напишите вам обработчик событий на стороне сервера для вашего управления

      protected void btnSayHello_Click (отправитель объекта, EventArgs e) {    Label1.Text = "Hello World..."; }

    2. Добавить клиентскую функцию для вызова обработчика событий на стороне сервера

      функция SayHello() {       __doPostBack ( "btnSayHello", ""); }

Замените "btnSayHello" в коде выше с вашим идентификатором клиента управления.

Таким образом, если ваш элемент управления находится внутри панели обновления, страница не будет обновляться. Это так легко.

Еще одна вещь, которая стоит сказать: Будьте осторожны с идентификатором клиента, потому что это зависит от вашей политики создания идентификатора, определенной с помощью свойства ClientIDMode.

Ответ 9

Возможно, вы захотите создать веб-службу для своих общих методов.
Просто добавьте функцию WebMethodAttribute над функциями, которые вы хотите вызвать, и об этом.
Наличие веб-сервиса со всеми вашими обычными вещами также упрощает обслуживание системы.

Ответ 10

Если функция __doPostBack не создается на странице, вам необходимо вставить элемент управления, чтобы заставить его следующим образом:

<asp:Button ID="btnJavascript" runat="server" UseSubmitBehavior="false" />

Ответ 11

Я пытаюсь реализовать это, но он не работает правильно. Страница отправка назад, но мой код не выполняется. Когда я отлаживаю страницы, RaisePostBackEvent никогда не запускается. Одна вещь, которую я сделал иначе я делаю это в пользовательском элементе управления вместо aspx стр.

Если кто-то еще похож на Мерка, и у меня возникли проблемы с этим, у меня есть решение:

Когда у вас есть пользовательский элемент управления, похоже, вы также должны создать PostBackEventHandler на родительской странице. И затем вы можете вызвать пользовательский элемент управления PostBackEventHandler, вызвав его напрямую. См. Ниже:

public void RaisePostBackEvent(string _arg)
{
      UserControlID.RaisePostBackEvent(_arg);
}

Если UserControlID - это идентификатор, который вы указали на пользовательский элемент управления на родительской странице, когда вы вложили его в разметку.

Примечание. Вы также можете просто просто вызвать методы, принадлежащие этому пользовательскому элементу управления напрямую (в этом случае вам понадобится только обработчик RaisePostBackEvent на родительской странице):

public void RaisePostBackEvent(string _arg)
{
    UserControlID.method1();
    UserControlID.method2();
}

Ответ 12

Относительно:

var button = document.getElementById(/* Button client id */);

button.click();

Он должен выглядеть следующим образом:

var button = document.getElementById('<%=formID.ClientID%>');

Где formID - это идентификатор элемента управления ASP.NET в файле .aspx.

Ответ 13

Этот ответ работает как бриз для меня благодаря кросс-браузеру:

Метод __doPostBack() работает хорошо.

Еще одно решение (очень хакерское) - просто добавить невидимую кнопку ASP в свою разметку и щелкнуть по ней с помощью метода JavaScript.

<div style="display: none;"> 
   <asp:Button runat="server" ... OnClick="ButtonClickHandlerMethod" /> 
</div>

Из вашего JavaScript верните ссылку на кнопку с помощью ClientID, а затем вызовите на ней метод .Click():

var button = document.getElementByID(/* button client id */); 

button.Click();

Blockquote

Ответ 14

Добавьте эту строку в загрузку страницы, если вы получаете ожидаемую ошибку объекта.

ClientScript.GetPostBackEventReference(this, "");

Ответ 15

Вы можете использовать PageMethods.Your C# method Name для доступа к методам С# или методам VB.NET в JavaScript.

Ответ 16

Попробуйте следующее:

if(!ClientScript.IsStartupScriptRegistered("window"))
{
    Page.ClientScript.RegisterStartupScript(this.GetType(), "window", "pop();", true);
}

Или это

Response.Write("<script>alert('Hello World');</script>");

Используйте свойство OnClientClick кнопки для вызова функций JavaScript...

Ответ 17

Вы также можете получить его, просто добавив эту строку в свой код JavaScript:

document.getElementById('<%=btnName.ClientID%>').click()

Я думаю, что это очень легко!

Ответ 18

Пожалуйста, попробуйте следующее:

<%= Page.ClientScript.GetPostBackEventReference(ddlVoucherType, String.Empty) %>;

ddlVoucherType - это элемент управления, который будет вызывать выбранное изменение индекса... И вы можете поместить любую функцию в выбранное изменение индекса этого элемента управления.

Ответ 19

Самый простой и лучший способ добиться этого - использовать событие onmouseup() JavaScript, а не onclick()

Таким образом вы будете запускать JavaScript после нажатия и не будут мешать событию ASP onclick().

Ответ 20

Я пытаюсь это сделать, поэтому я могу запустить метод Asp.Net при использовании jQuery.

  • Переадресация страницы в коде jQuery

    window.location = "Page.aspx?key=1";

  • Затем используйте строку запроса в Page Load

    protected void Page_Load(object sender, EventArgs e)
{
    if (Request.QueryString["key"] != null)
    {
        string key= Request.QueryString["key"];
        if (key=="1")
        {
            // Some code
        }
    }
}

Поэтому нет необходимости запускать дополнительный код