ASP.NET постбэк с JavaScript

Question

У меня есть несколько маленьких div с использованием jQuery перетаскиваемых. Эти div s помещены в UpdatePanel, а на Dragstop я использую _doPostBack() функцию JavaScript. где я извлекаю необходимую информацию из формы страниц.

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

Answer 1

Вот полное решение

Полный тег формы страницы asp.net

<form id="form1" runat="server">
    <asp:LinkButton ID="LinkButton1" runat="server" /> <%-- included to force __doPostBack javascript function to be rendered --%>

    <input type="button" id="Button45" name="Button45" onclick="javascript:__doPostBack('ButtonA','')" value="clicking this will run ButtonA.Click Event Handler" /><br /><br />
    <input type="button" id="Button46" name="Button46" onclick="javascript:__doPostBack('ButtonB','')" value="clicking this will run ButtonB.Click Event Handler" /><br /><br />

    <asp:Button runat="server" ID="ButtonA" ClientIDMode="Static" Text="ButtonA" /><br /><br />
    <asp:Button runat="server" ID="ButtonB" ClientIDMode="Static" Text="ButtonB" />
</form>

Полное содержание класса Code-Behind страницы

Private Sub ButtonA_Click(sender As Object, e As System.EventArgs) Handles ButtonA.Click
    Response.Write("You ran the ButtonA click event")
End Sub

Private Sub ButtonB_Click(sender As Object, e As System.EventArgs) Handles ButtonB.Click
    Response.Write("You ran the ButtonB click event")
End Sub

• LinkButton включен, чтобы гарантировать, что функция __doPostBack javascript будет представлена ​​клиенту. Простые элементы управления Button не приведут к визуализации этой функции __doPostBack. Эта функция будет отображаться благодаря наличию множества элементов управления на большинстве страниц ASP.NET, поэтому пустая кнопка ссылки обычно не требуется

Что происходит?

Клиенту предоставляются два элемента управления вводом:

<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />

• __EVENTTARGET получает аргумент 1 из __doPostBack
• __EVENTARGUMENT получает аргумент 2 из __doPostBack

Функция __doPostBack отображается следующим образом:

function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}

• Как видите, он присваивает значения скрытым входам.

Когда происходит отправка / отправка формы:

• Если вы указали уникальный идентификатор кнопки управления сервером, чей обработчик нажатия кнопки (javascript:__doPostBack('ButtonB','')), то будет запущен обработчик нажатия кнопки для этой кнопки.

Что, если я не хочу запускать обработчик щелчков, а вместо этого хочу сделать что-то еще?

Вы можете передать все, что захотите в качестве аргументов __doPostBack

Затем вы можете проанализировать скрытые входные значения и запустить соответствующий код:

If Request.Form("__EVENTTARGET") = "DoSomethingElse" Then
    Response.Write("Do Something else") 
End If

Другие заметки

• Что если я не знаю идентификатор элемента управления, чей обработчик кликов я хочу запустить?
  • Если недопустимо установить ClientIDMode="Static", то вы можете сделать что-то вроде этого: __doPostBack('<%= myclientid.UniqueID %>', '').
  • Или: __doPostBack('<%= MYBUTTON.UniqueID %>','')
  • Это вставит уникальный идентификатор элемента управления в javascript, если вы пожелаете

Answer 2

За Phairoh: используйте это на странице / компоненте на случай, если имя панели изменится

<script type="text/javascript">
     <!--
     //must be global to be called by ExternalInterface
         function JSFunction() {
             __doPostBack('<%= myUpdatePanel.ClientID  %>', '');
         }
     -->
     </script>

Answer 3

Хотя решение Phairoh кажется теоретически обоснованным, я также нашел другое решение этой проблемы. Передавая идентификатор UpdatePanels в качестве параметра (цели события) для функции doPostBack, панель обновлений отправит обратно, но не всю страницу.

__doPostBack('myUpdatePanelId','')

* примечание: второй параметр для аргументов события сложения

надеюсь, это кому-нибудь поможет!

РЕДАКТИРОВАТЬ: так что, похоже, тот же самый совет был дан выше, когда я печатал:)

Answer 4

Использование __doPostBack напрямую оооочень 2000-х годов. Любой, кто кодирует WebForms в 2018 году, использует GetPostBackEventReference

(Более серьезно, добавляя это в качестве ответа для полноты. Использование __doPostBack напрямую является плохой практикой (префикс с одним подчеркиванием обычно указывает на закрытый член, а двойной - на более универсальный закрытый член), хотя, вероятно, не изменить или устареть на этом этапе. У нас есть полностью поддерживаемый механизм в ClientScriptManager.GetPostBackEventReference .)

Предполагая, что ваш btnRefresh находится внутри нашей UpdatePanel и вызывает обратную передачу, вы можете использовать GetPostBackEventReference следующим образом ( вдохновение ):

function RefreshGrid() {
    <%= ClientScript.GetPostBackEventReference(btnRefresh, String.Empty) %>;
}

Answer 5

Если у кого-то возникли проблемы с этим (как у меня), вы можете получить код обратной передачи для кнопки, добавив к ней атрибут UseSubmitBehavior = "false". Если вы изучите визуализированный источник кнопки, вы увидите точный JavaScript, который вам нужно выполнить. В моем случае это было название кнопки, а не идентификатор.

Answer 6

Вы пытались передать идентификатор клиента панели обновления в функцию __doPostBack? Моя команда сделала это, чтобы обновить панель обновления, и, насколько я знаю, это сработало.

__doPostBack(UpdatePanelClientID, '**Some String**');

Answer 7

Во-первых, не используйте панели обновления. Это вторая самая злая вещь, которую Microsoft когда-либо создавала для веб-разработчика.

Во-вторых, если вы должны использовать панели обновления, попробуйте установить для свойства UpdateMode значение Conditional. Затем добавьте триггер к элементу управления Asp: Hidden, который вы добавляете на страницу. Назначьте событие изменения как триггер. В событии dragstop измените значение скрытого элемента управления.

Это не проверено, но теория кажется обоснованной ... Если это не сработает, вы можете попробовать сделать то же самое с помощью кнопки asp:, просто установите для него отображение: none style и используйте событие click вместо изменить событие.

Answer 8

Вы не можете позвонить _doPostBack(), потому что это вызывает подчинение формы. Почему бы вам не отключить PostBack на UpdatePanel?