Отправка ASP.NET с помощью JavaScript

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

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

Ответ 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>

Все содержимое класса кода за классом

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 включена, чтобы гарантировать, что функция javascript __doPostBack будет передана клиенту. Простое управление 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();
    }
}
  • Как вы можете видеть, он присваивает значения скрытым входам.

Когда появляется форма отправки/обратной передачи:

  • Если вы предоставили уникальный идентификатор кнопки Server-Control, чей щелчок-клик-обработчик вы хотите запустить (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, если вы хотите его

Ответ 2

Per Phairoh: используйте это в Page/Component на всякий случай, если имя панели изменилось

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

Ответ 3

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

__doPostBack('myUpdatePanelId','')

* note: второй параметр предназначен для добавления событий args

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

EDIT: так кажется, что этот же совет был приведен выше, когда я печатал:)

Ответ 4

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

Ответ 5

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

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

Ответ 6

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

Ответ 7

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

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

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