My problem is that, I want to call a code behind function from a JS. So that I can implement TextBox on Click event. I am NEW in JS so bear with me on this one...What I heard is that from the client side scripting you cannot call anything to the server (code behind). Here is my code:
<script type="text/javascript">
function callCodeBehind() {
<% txtAgentName_TextChanged(); %>
}
</script>
This is my Textbox:
<asp:TextBox ID="txtAgentName" runat="server" Onclick = "callCodeBehind()"></asp:TextBox>
This is my code behind:
protected void txtAgentName_TextChanged()
{
}
This function is getting fired on Page_Load(), which I don't want it to.
All I want is that to call this function txtAgentName_TextChanged() when user clicks on txtAgentName textbox.
Help!
For simplicity, you can use page methods. Check below articles for exact instructions.
Using Page Methods in ASP.NET AJAX
Using jQuery to directly call ASP.NET AJAX page methods
I think what you are looking for is AJAX. Check out the sample in the link.
You CAN call code behind from server using AJAX and jQuery library, just google it. e.g.
http://blogs.sitepoint.com/ajax-jquery/
A second issue is that the btn.click() will not work cross-browser.
you can insert a code behind method like this:
<% method(); &>
Related
Yes, it is possible to simply add a return false to the OnClientClick, but that's not doing a very good job since the function on the OnClick just stops working.
The function that i use on the OnClick property on the button takes data out of the database and does something with it. while i have that return false there, nothing is happening. When it's not there, the page keeps refreshing and nothing is done.
Please, if anyone got a way to block the postback without blocking the method on the OnClick property that'll be great!
HTML
<asp:Button Text="Edit Ceredntials" OnClientClick="ShowWindow('#EditDetails', 2500)" OnClick="GetUserData" runat="server" />
You can't prevent a postback and still run the OnClick method. That's because OnClick runs on the server, and the only way it can execute is via a postback.
If what you're really trying to accomplish is preventing the page from losing state and refreshing, you should be using AJAX instead and a compatible server side framework, like Web API.
<script type="text/javascript">
function loadUserDetails(){
$.ajax({
url: 'api/Users/2500',
type: 'GET'
})
.success(function(userDetails){
$("#FirstName").val(userDetails.FirstName);
ShowWindow('#EditDetails', 2500);
});
}
</script>
<asp:Button runat="server" OnClientClick='loadUserDetails()' Text="Edit Credentials" />
Asp validation controls not firing after ajaxrequest been called.
I'm calling a function with below code to refresh a grid.
window['My Grid Client ID'].AjaxRequest('My Grid Unique ID', 'Rebind');
after Grid refreshed, validation not firing on click of submit button for the first time. for the next click it is working fine.
Hope this is due to ajax problem.!!
please respond if any one came across this scenario...
As you mentioned you are using Telerik. I would suggest you to rebind grid using below code instead of AjaxRequest, this will Rebind grid from ClientSide.
<telerik:RadCodeBlock runat="server">
<script type="text/javascript">
function refreshGrid() {
var grid = $find("<%=RadGrid1.ClientID%>");
var masterTableView = grid.get_masterTableView();
masterTableView.fireCommand("Rebind");
}
</script>
</telerik:RadCodeBlock>
For more help on this you could use below links
RadGrid Client side API
RadGrid Client object
This will not use any AjaxRequest to bind grid and will not affect any of your Validation functionality.
Hope this helps..!!!
What validation are you using? If it is custom validation and your JavaScript code is in the user control you load with the ajax request, this script will not actually exist in the browser. Wrap it in a RadScriptBlock control or use the ScriptManager.RegisterClientScriptBlock method to have it working on the page.
Also, make sure you have proper ValidationGroup settings for all your validators. If some submit buttons appear with AJAX this may break your existing page if you have no groups defined.
I'm working on usercontrol called 'TimePicker',
This usercontrol utilizes the jquery timepicker, and wraps it to make it simple to use in asp.net.
I'm binding the jquery timepicker to a textbox using a simple script:
$('#<%= timepicker_textbox.ClientID %>').timepicker({
onClose: function() {
__doPostBack('<%= timepicker_textbox.ClientID %>', '');
}
});
I also chose to put this textbox inside an update panel, in order to avoid full page refresh after that the user chose a time and caused a postback.
The problem is that after that updatepanel reloaded, any script in the page is not running again, and therefore the jquery timepicker is not applied to the textbox.
I managed to fix this by adding the following code:
Sys.Application.add_load(function () {
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(<%= timepicker_textbox.ClientID %>_onControlLoad());
});
function <%= timepicker_textbox.ClientID %>_onControlLoad()
{
$('#<%= timepicker_textbox.ClientID %>').timepicker({
onClose: function() {
__doPostBack('<%= timepicker_textbox.ClientID %>', '');
}
});
}
This causes the function to be registered and then run again on each partial postback.
The problem is that this fixed the problem only for this specific timepicker,
and not for any other elements in the same page!
This is major issue to me, since I'm having more than one timepicker inside a page,
And when choosing time on one timepicker, the others aren't working...
Any suggestions are welcome.
Thanks,
Eitan.
Using the Updatepanel in the page changes the Id of the controls and jquery document.ready event did not get called proerly,
you can read more from here-
http://www.dotnetfunda.com/articles/article471-jquery-and-aspnet-ajax-updatepanel.aspx
jquery with update panel
A simple solution is to add class="timepicker" to any text box you want the functionality on, and then use this:
$(document).ready(function(){
$('.timepicker').timepicker({
onClose: function() {
__doPostBack($(this).attr('id'), '');
}
});
});
In general, learn to get away from driving client side behavior from the server because that mentality doesn't jive with jQuery's extremely simple select/add behavior paradigm. The whole update panel / postback thing is really old school as well, but if you must use that, you'd have to register the function I showed above with Sys.WebForms.PageRequestManager.getInstance().add_endRequest like you were doing. Or just put the $(document).ready inside the update panel, that might work too.
What is event for pageload on clientside?
function pageLoad() {
cbvalcs.SetSelectedIndex(1);
}
I tried this, but nothing happens.
Thanks.
You may have to include the correct signature.
function pageLoad(sender, args) {
}
To create an ASP.NET page load event, you must first register the handler.
Sys.Application.add_load(applicationLoadHandler);
applicationLoadHandler being your javascript function. This registration can take place in the page load event.
So in your case:
Sys.Application.add_load(pageLoad);
function pageLoad() {
cbvalcs.SetSelectedIndex(1);
}
This can work for partial postbacks as well as full.
For a through dressing of the topic MSDN's ASP.NET AJAX Client Life-Cycle Events has all the information.
You have to use window.onload
There are some good articles about window.onload and Using window.onload
If you are using jquery, then use $(document).ready
I have a menu which contains a delete button to delete items from it. I put all inside an updatepanel to make partial postbacks. The problem is after i made the post back the jquery jdmenu pluggin stops work. I suppose i should include something like this
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(InitializeJdMenuAgain);
function InitializeJdMenuAgain(sender, args) {
//do something here which i am not sure
}
but i am not sure what should i put in InitializeJdMenuAgain because no script is needed when using this pluggin. I was inspecting the code for pluging but i don't have too much abilities which Javascript, what i need to do?
thanks in advance.
You should reattach the menu to the DOM element that was updated by the UpdatePanel:
function InitializeJdMenuAgain(sender, args) {
$('ul.jd_menu').jdMenu();
}