I have a problem. I'm running a postback event onchange in web form control using postback.
<asp:DropDownList OnSelectedIndexChanged="UpdateCollection" AutoPostBack="true" ID="BookCategorySelection"/>
The asp generates something like
<select id="..." onchange="javascript(__DoPostBack(...)); ">
and I would like to add something after the postback
<select id="..." onchange="javascript(__DoPostBack(...)); MyFunction();">
I need to add a call in javascript to refresh some calculations that are done in js after this postback is done. Anyone has any idea? I tried adding it in backend in OnPrerender method of control, but still it's added before the javascript generated callback. I tried also in jQuery but no help.
The solution may be to use pageLoad
function pageLoad(){ }
it will be called on each postback
Related
I using bootstrap and i want to use that; http://getbootstrap.com/javascript/#buttons-stateful
<asp:Button ID="Button1" runat="server" Text="Send It" data-loading-text="Loading..." class="btn btn-primary" autocomplete="off" />
<script>
$('#Button1').on('click', function () {
var $btn = $(this).button('loading')
$btn.button('reset')
})
</script>
But it doesn't work. what can i do to work this?
When an ASP.NET control is rendered, it's assigned a new ID. If you do an inspect element on your button, you'll notice it's ID is actually not Button1. Because of this, your $('#Button1') selector is not finding anything.
If you're using a version of ASP.NET that supports it, you can put clientIDMode="static" on your button to keep the ID from changing.
If not, you can get the client ID by replacing $('#Button1') with $('#<%=Button1.ClientID%>')
Make sure jquery is loaded
Make sure boostrap css is loaded
Make sure bootstrap javascript is loaded
It looks like when your button is loaded it is immediately reset. Trying have the button load in the before step in an ajax request. Then put the rest in the complete step of the ajax step. This way you can see it working.
I was trying to call a function when the checkbox status changes, it calls without a masterpage. I have tried the following code:
<script type="text/javascript">
$(function () {
$('#cbOption1').on('change', PublishToPreferredZerker);
});
function PublishToPreferredZerker() {}
</script>
[...]
<asp:CheckBox ID="cbOption1" runat="server" style="text-align: left"
Text="Publish the job to particular Zerker or a group of the Zerkers." /><br />
The function is not called when using MasterPage.
Note cbOption1 is not the client ID, but the ID for the server side.
You need to do something like (Use Control.ClientID Property to get the id for HTML element):
$('#<%=cbOption1.ClientID%>').on('change', PublishToPreferredZerker);
The code
$('#cbOption1').on('change', PublishToPreferredZerker);
finds the control with id cbOption1 and then acts on that control
But when using this code on a master page, the control id does not remain cbOption1.
It is prefixed by master page content Id.
something like ct$001cbOption1
To make it work when using master pages use code like this to find the clientId for the control :
$(#"<%= cbOption1.ClientID %>").on( .... )
I got success while I added below code on Page load function.
cbOption1.Attributes.Add("onChange", "javascript:PublishToPreferredZerker()");
Javascript function
function PublishToPreferredZerker() {}
Also I have tried above answers but not get required output.
Thanks,
I am having a lot of trouble with a seemingly simple thing.
In an ASP.NET webform I have two ListBoxes, with Add and Remove buttons in between.
The user can select items in one ListBox and using the buttons, swap them around.
I do this on the clientside using javascript.
I then also have a SAVE button, which I want to process on the server side when the user is happy with their list.
Problems : First I was getting the following problem when I clicked SAVE :
*
Invalid postback or callback argument. Event validation is enabled using in configuration or <%# Page EnableEventValidation="true" %> in a page. For security purposes, this feature verifies that arguments to postback or callback events originate from the server control that originally rendered them. If the data is valid and expected, use the ClientScriptManager.RegisterForEventValidation method in order to register the postback or callback data for validation.
*
I read that one of the methods to get around this was to put my ListBoxes into an UpdatePanel, which I did, and I am getting further.
However, now the event handler for the button's Click event is not being run if the user has used the clientside javascript to alter the contents of the Listboxes. If the user has not altered the contents of the listboxes, the handler does execute.
What is happening?
Is my approach basically flawed and there might be a much better approach to this problem?
thanks for any help!
Here's the ASPX code :
<table>
<tr>
<td>
<asp:ListBox ID="fromListBox" runat="server" SelectionMode="Multiple" Rows="8" AutoPostBack="false"
DataSourceID="SqlDataSource1" DataTextField="FullName" DataValueField="UserId" CssClass="teamListBox">
</asp:ListBox>
</td>
<td>
<input id="btnAdd" type="button" value="Add >" /><br/>
<br/>
<input id="btnRemove" type="button" value="< Remove" /><br/>
<br/>
</td>
<td>
<asp:ListBox ID="toListBox" runat="server" SelectionMode="Multiple" Rows="8" AutoPostBack="false"
CssClass="teamListBox" DataSourceID="SqlDataSource2" DataTextField="FullName"
DataValueField="UserId" >
</asp:ListBox>
</td>
</tr>
</table>
Heres the javascript, using jquery....this works fine so is not really the problem :
$(document).ready(function () {
$("#btnAdd").click(function () {
$("#fromListBox option:selected").appendTo("#toListBox");
});
$("#btnRemove").click(function () {
$("#toListBox option:selected").appendTo("#fromListBox");
});
});
Just Go to your web config file in your application and Add enableEventValidation="false" in pages section.
The clean way would to be to use ClientScriptManager.RegisterForEventValidation Method.
Have also a look here.
You have to register the server control ID with all the possible values that can be posted by JavaScript by that control in Render Event of the page, for exampe:
protected override void Render(System.Web.UI.HtmlTextWriter writer)
{
ClientScript.RegisterForEventValidation("fromListBox", "English");
ClientScript.RegisterForEventValidation("fromListBox", "Tamil");
ClientScript.RegisterForEventValidation("fromListBox", "Hindi");
ClientScript.RegisterForEventValidation("toListBox", "English");
ClientScript.RegisterForEventValidation("toListBox", "Tamil");
ClientScript.RegisterForEventValidation("toListBox", "Hindi");
base.Render(writer);
}
I think I had the same problem a while ago. I solved it by assigning the values of my listbox to a hidden text field and submitting the page all using javascript.
On the server side, I read the value of that hiddent textfield and parsed it.
It was an ugly client/server code, but it worked for me.
I have Telerik RadGrid with a custom edit form. In my edit form there is a RadDatePicker to which I have added a custom footer template containing a 'Today' button.
In the OnClick event of the button I call a Javascript function which takes the control ID to set the selected date.
However, because the control is inside the edit form there is no variable created for it and the compiler throws an error when I try getting the client ID.
The RadDatePicker is declared with:
<telerik:RadDatePicker ID="ControlName" runat="server" SelectedDate='<%# Bind("Field") %>'>
<Calendar ID="Calendar1" runat="server">
<FooterTemplate>
<div style="width: 100%; text-align: center; background-color: Gray;">
<input id="Button1" type="button" value="Today" class="button"
onclick="GoToToday('<%= ControlName.ClientID %>')" />
</div>
</FooterTemplate>
</Calendar>
</telerik:RadDatePicker>
The error I get is CS0103: The name 'ControlName' does not exist in the current context on the line referencing the ClientID.
Is there another way in which to get the ID to pass to the Javascript function?
I resorted to wrapping the Telerik RadGrid with a RadAjaxPanel and then in the server side code for the bind event I used the Ajax panel to set some Javascript variables:
RadAjaxPanel1.ResponseScripts.Add(string.Format("window['ControlNameId'] = '{0}';", ControlName.ClientID));
I then added a client side event handler to the DatePicker: ClientEvents-OnPopupOpening="AddButtonClickEvent"
The page then includes the following Javascript to bind the click event handler using jQuery:
function AddButtonClickEvent(sender, eventArgs) {
var cal = window['ControlNameId'];
$('#Button1').bind('click', function() {
GoToToday(cal);
});
}
And it all works as expected.
Try:
OnClick=<%# "GoToToday('" + ControlName.ClientID + "')" %>
You could also set the event handler in the page_load event.
Maybe ClientEvents-OnLoad event of controls on form will help? It's not very beautiful, but seems to work.
First make script on page
<script type="text/javascript">
var textBoxFromFormClientObject;
function onTextBoxLoad(sender) {
textBoxFromFormClientObject = sender;
}
</script>
Then in aspx, for control on edit form that you need to get on client,
add event like this
<rad:RadTextBox ID="txSomeTextBoxe" runat="server"
ClientEvents-OnLoad="onTextBoxLoad"/>
So, when you press edit or insert button on grid, and form will be shown - global variable in javascript will be set. And you can use it to manipulate textbox. Only problem is that you need event like this for each control on form, if you want to manipulate all controls =(
I am reading an xml file using javascript and then I need to submit my form so that it calls a particular method in my JSF handler. Usually this can be done on a jsp when user clicks a button by having an actionlistener like so:
<h:commandLink styleClass="button" action="#{myHandler.outcome}" actionListener="#{myHandler.doNext}">
<span><h:outputText value="#{text.button_submit}" /></span> </h:commandLink>
I am not sure how to call a method like 'doNext' above in the handler from javascript. I cannot do a simple:
document.form.submit();
as it then repeats the processing i have already done. I want to read values from an xml file and then call a particular method in handler. Any ideas much appreciated.
I found a solution to this. I added a hidden button to my jsp like:
<p id="hiddenButton" style="display:none;" >
<h:commandLink id="hiddenRegButton" styleClass="button" action="#{myHandler.doNext}" />
</p>
and in my javascript I used jQuery to execute the click which leads t the "doNext" method in my Handler to get executed.
jQuery('#hiddenRegButton').click();
this was easier than I thought.