Как вызвать JavaScript-функцию из код-бихайнда
Описание проблемы:
У меня есть страница ASP.NET, на которой я использую JavaScript. Я написал функцию на JavaScript, которая должна изменять значение текстового поля. Вот что у меня есть:
Код страницы ASP.NET:
<HTML> <HEAD>
<script type="text/javascript">
function Myfunction(){
document.getElementById('MyText').value = "hi";
}
</script>
</HEAD> <BODY>
<input type="text" id="MyText" runat="server" /> </BODY>
Код в Code-behind:
Private Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs)
Handles Me.Load
If Session("My") = "Hi" Then
' Здесь я хочу вызвать функцию JavaScript "Myfunction"
End If
End Sub
Вопрос: Как я могу вызвать функцию JavaScript "Myfunction" из кода на VB.NET в блоке Page_Load, когда условие выполняется? Либо, если есть более правильный способ выполнить данное действие, пожалуйста, дайте рекомендацию. Благодарю!
5 ответ(ов)
Один из способов сделать это — использовать ClientScriptManager. Вот пример кода:
Page.ClientScript.RegisterStartupScript(
GetType(),
"MyKey",
"Myfunction();",
true);
В этом коде происходит регистрация скрипта, который будет выполнен при загрузке страницы. Убедитесь, что Myfunction() — это функция, которая определена на вашей странице или в подключенном скрипте.
Это способ вызвать один или несколько методов JavaScript из кода на стороне сервера. С помощью ScriptManager мы можем вызывать методы последовательно. Рассмотрим приведенный ниже код в качестве примера.
ScriptManager.RegisterStartupScript(this, typeof(Page), "UpdateMsg",
"$(document).ready(function(){EnableControls();
alert('Overrides successfully Updated.');
DisableControls();});",
true);
В этом коде сначала вызывается метод EnableControls(). Затем появляется всплывающее окно с сообщением. После этого вызывается метод DisableControls().
Есть очень простой способ сделать это. Он заключается в том, чтобы внедрить JavaScript код в элемент управления Label из кода на серверной части. Вот пример кода:
<head runat="server">
<title>Пример вызова функции JavaScript из кода на сервере</title>
<script type="text/javascript">
function showDialogue() {
alert("это диалоговое окно было вызвано через код на сервере.");
}
</script>
</head>
........
lblJavaScript.Text = "<script type='text/javascript'>showDialogue();</script>";
Полный код можно найти здесь: http://softmate-technologies.com/javascript-from-CodeBehind.htm (ссылка неактивна)
Ссылка из Internet Archive: https://web.archive.org/web/20120608053720/http://softmate-technologies.com/javascript-from-CodeBehind.htm
Если порядок выполнения не имеет значения, и вам нужно, чтобы выполнялись как JavaScript, так и код на сервере для элемента ASP, вот что можно сделать.
Что вы можете вынести из моего примера: у меня есть div, который перекрывает элемент управления ASP, и я хочу, чтобы выполнялись как JavaScript, так и код на сервере. Таким образом, метод onClick для div и событие OnSelectionChanged для календаря будут срабатывать.
В этом примере я использую элемент управления ASP Calendar и управляю им как с помощью JavaScript, так и с помощью кода на сервере:
Код на фронте:
<div onclick="showHideModal();">
<asp:Calendar
OnSelectionChanged="DatepickerDateChange" ID="DatepickerCalendar" runat="server"
BorderWidth="1px" DayNameFormat="Shortest" Font-Names="Verdana"
Font-Size="8pt" ShowGridLines="true" BackColor="#B8C9E1" BorderColor="#003E51" Width="100%">
<OtherMonthDayStyle ForeColor="#6C5D34"> </OtherMonthDayStyle>
<DayHeaderStyle ForeColor="black" BackColor="#D19000"> </DayHeaderStyle>
<TitleStyle BackColor="#B8C9E1" ForeColor="Black"> </TitleStyle>
<DayStyle BackColor="White"> </DayStyle>
<SelectedDayStyle BackColor="#003E51" Font-Bold="True"> </SelectedDayStyle>
</asp:Calendar>
</div>
Код на сервере:
protected void DatepickerDateChange(object sender, EventArgs e)
{
if (toFromPicked.Value == "MainContent_fromDate")
{
fromDate.Text = DatepickerCalendar.SelectedDate.ToShortDateString();
}
else
{
toDate.Text = DatepickerCalendar.SelectedDate.ToShortDateString();
}
}
Таким образом, при клике на div будет выполняться функция JavaScript showHideModal() и также будет срабатывать событие OnSelectionChanged элемента Calendar, позволяя интегрировать оба подхода без проблем.
Чтобы запустить JavaScript метод в ASP.NET, добавьте следующую строку в конец страницы перед тегом </form>, как минимум под тем js методом, который вы написали.
Причина этого заключается в том, чтобы избежать вызова вашего метода до того, как браузер поймет, что это за функция, и в конечном итоге не сделает ничего.
<% Response.Write($"<script>yourfunction('{Config.id}');</script>"); %>
ps: Я пробовал все методы, которые описаны выше, но ничего не сработало. И я сам нашел этот простой и удивительный способ вызова js метода!
Запрос Ajax возвращает 200 OK, но вместо успеха срабатывает событие ошибки
Где найти документацию по форматированию даты в JavaScript?
Как проверить, содержит ли массив строку в TypeScript?
Ссылка и выполнение внешнего JavaScript-файла, размещенного на GitHub
Как остановить Babel от трансформации 'this' в 'undefined' и добавления "use strict"