Вопрос

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

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

Это было полезно?

Решение

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

Хотя это немного сложно...:)

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

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

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

public void RaisePostBackEvent(string eventArgument) { }

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

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

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

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

Другие советы

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

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

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

Из вашего JavaScript получите ссылку на кнопку, используя ее ID клиента а затем позвоните в .клик() метод на нем.

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

button.click();

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

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

Ajax.Utility.RegisterTypeForAjax(GetType(YOURPAGECLASSNAME))

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

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

Затем вы можете вызвать его на своей странице как:

PageClassName.Get5(javascriptCallbackFunction);

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

Вы можете сделать это асинхронно, используя .NET Ajax PageMethods.Видеть здесь или здесь.

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

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

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

Сторона клиента:

<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.Веб-API ASP.NET MVC 4 также упрощает настройку серверной веб-службы для обработки запроса.Но многие люди не знают, что вы также можете добавить контроллеры 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, так и мощь C#/ASP.NET, предоставляя людям, посещающим ваш сайт, лучшее общее впечатление.Не жертвуя ничем, вы получаете лучшее из обоих миров.

Рекомендации

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

JavaScript-код

<script src="http://code.jquery.com/jquery-3.3.1.js" />
<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;
}

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

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

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

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

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

  1. Добавьте следующее в раздел клиентского сценария вашей страницы.

    //<![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. Напишите обработчик событий на стороне сервера для вашего контроля.

      Защищенная void btnsayhello_click (отправитель объекта, Eventargs e) {label1.text = "hello world ...";}

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

      function sayhello () {__dopostback ("btnsayhello", "");}

Замените «btnSayHello» в приведенном выше коде идентификатором клиента вашего элемента управления.

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

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

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

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

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

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

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

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

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

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

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

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

Касательно:

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

button.click();

Это должно быть так:

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

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

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

ClientScript.GetPostBackEventReference(this, "");

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

Попробуй это:

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

Или это

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

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

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

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

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

Пожалуйста, попробуйте это:

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

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

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

Таким образом, вы запустите JavaScript после щелчка, и это не будет мешать работе ASP. OnClick() событие.

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

  1. Выполните перенаправление страницы в вашем коде jQuery.

    window.location = "Page.aspx?key=1";
    
  2. Затем используйте строку запроса при загрузке страницы.

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

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

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

Метод __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(); 

Цитата

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top