Обновление UpdatePanel вручную с помощью JavaScript или jQuery
можно ли обновить UpdatePanel вручную с помощью JavaScript или jQuery?
У меня есть текстовое поле в верхней части моей странице. Когда пользователь покидает это текстовое поле, я хочу запустить некоторый код сервера (он добавит запись в мою базу данных), то в нижней части страницы у меня есть UpdatePanel, который будет обновляться. UpdatePanel имеет GridView, в котором будет добавлена запись для записи)
8 ответов
просто вызовите эту функцию javascript. Здесь UpdatePanel1-это идентификатор updatepanel
<script type="text/javascript">
var UpdatePanel1 = '<%=UpdatePanel1.ClientID%>';
function ShowItems()
{
if (UpdatePanel1 != null)
{
__doPostBack(UpdatePanel1, '');
}
}
</script>
Кажется, я получил ответ... нужно создать скрытую кнопку в UpdatePanel, а затем вызвать
__doPostBack('<%= Button.ClientID %>','');
хотя это старый вопрос, я думаю, что он заслуживает упоминания еще об одном решении.
Если вы не хотите полагаться на скрытые кнопки или иллюзорный _ _ doPostBack, есть опция " ClientScript.GetPostBackEventReference", как описано на этой (Также довольно старой, но все еще большой) странице:
http://www.4guysfromrolla.com/articles/033110-1.aspx
короче говоря, если ваш UpdatePanel объявлен как это:
<asp:UpdatePanel ID="MyUpdatePanel" runat="server">...</UpdatePanel>
тогда в JavaScript вы можете вызвать скрипт, который генерируется этим сервер код:
ClientScript.GetPostBackEventReference(MyUpdatePanel, "")
поэтому на Вашей странице aspx вы можете иметь что-то вроде этого:
function MyJavaScriptFunction(){
doSomeStuff();
<%=ClientScript.GetPostBackEventReference(MyUpdatePanel, "")%>
}
код между будет заменен фактическим вызовом javascript при анализе страницы, поэтому вы можете посмотреть на него, просмотрев исходный код страницы в своем браузере.
это может быть не проще, чем другие ответы, но я предпочитаю его, так как он не вводит никаких дополнительных элементов и __doPostBack чувствует себя как хак. :-)
Ну, в моем случае ответом было использование UniqueID. Клиентид не работал.
__doPostBack("<%=btnTest.UniqueID %>", "");
это отлично работает. Не спрашивай почему.
создать функции для асинхронной обратной передачи:
function __doPostBackAsync(eventName, eventArgs) {
var prm = Sys.WebForms.PageRequestManager.getInstance();
if (!Array.contains(prm._asyncPostBackControlIDs, eventName)) {
prm._asyncPostBackControlIDs.push(eventName);
}
if (!Array.contains(prm._asyncPostBackControlClientIDs, eventName)) {
prm._asyncPostBackControlClientIDs.push(eventName);
}
__doPostBack(eventName, eventArgs);
}
вызовите эту функцию, где вам нужно (в click event, load event,...):
__doPostBackAsync("UpdatePanel1", "");
в codebehind Page_Load проверьте асинхронную обратную передачу и обновите нужную UpdatePanel:
if (scriptManager.IsInAsyncPostBack)
{
if (Request["__EVENTTARGET"] == UpdatePanel1.ID)
{
...
//Do update
UpdatePanel1.Update();
}
}
вам просто нужно вызвать change () На control witch, который вы запустили в своей updatePanel.
например:
<asp:UpdatePanel runat="server" UpdateMode="Conditional" ID="updatePanel1" ChildrenAsTriggers="True">
<ContentTemplate>
<asp:DropDownList ID="ddl" runat="server" Visible="true" AutoPostBack="true" CssClass='someClass' />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="ddl" EventName="SelectedIndexChanged" />
</Triggers>
</asp:UpdatePanel
<script>
$(".someClass").change();
</script>
это работает для меня:
<asp:UpdatePanel id="pnl" UpdateMode="Conditional" runat="server">
<contentemplate>
<div>...your content...</div>
<div style="display: none; line-height: 0pt;">
<asp:Button id="btnUpdate" runat="server" UseSubmitBehavior="false" />
</div>
</contentemplate>
</asp:UpdatePanel>
JavaScript:
function doUpdate()
{
var btn = document.getElementById("<%#= btnUpdate.ClientID %>");
if(btn != null) { btn.click(); }
}
ASPX:
<asp:UpdatePanel ID="UpdatePanel1" runat="server" OnLoad="UpdatePanel1_OnLoad" > ...
CodeBehind:
protected void UpdatePanel1_OnLoad(object sender, EventArgs e)
{
var rawArguments = Page.Request["__EVENTARGUMENT"];
if(rawArguments != null)
{
var arguments = HttpUtility.ParseQueryString(rawArguments);
switch (arguments["EventName"])
{
case "Event1":
var parameter1Value = arguments["parameter1"];
var parameter2Value = arguments["parameter2"];
break;
}
}
}
Javascript:
function updatePanelPartialPostback(updatepanelId, eventName, parameters) {
var parametersParsed = "EventName=" + eventName + "&";
for (var propertyName in parameters) {
parametersParsed += propertyName + '=' + parameters[propertyName] + '&';
}
__doPostBack(updatepanelId, parametersParsed);
}
updatePanelPartialPostback('<%= UpdatePanel1.ClientID %>', 'Event1', { parameter1: 'value1', parameter2: 'value2' });