How to call javascript function from c# - asp.net

I like to call a JavaScript function from c#. Can any one can give me code snippet.
More detail...
I have a asp.net page which has a asp button. when i click that button, i like to call javascript function.
like wise....
in my asp.net page,
<button id="save" onclick="i like to call a method resides in asp.net page'>Save</button>
More and more details...
when click the asp.net button, i like to perform some server side action and then like to call a javascript function from there itself...

For an asp:button you use OnClientClick
<asp:Button id="myid" runat="server" OnClientClick="alert('test')" />

On the assumption that you're coding in ASP.NET (including MVC), calling a JavaScript function would mean embedding the call in JavaScript into your ASPX code, like so:
<script type="text/javascript">
doSomething();
</script>
You do have the opportunity to pass information from your C# to the JS call, just as you would have any other code alter the results of your ASPX:
<script type="text/javascript">
doSomething("<%= GetSomeTextFromCSharp(); %>");
</script>
This is really stretching the definition of "calling JavaScript from C#" though. What you're doing is having your C#/ASPX code generate HTML/JavaScript, which the browser then interprets as it would any other HTML/JS (regardless of how it was generated).
Perhaps you could explain what you're trying to do a bit more.

i tried with this code it works for me check whether it helps
1)
Page.ClientScript.RegisterStartupScript(this.GetType(), "click", "alert('Informations');", true);
The other way is call the javascript method which is written in source page
Page.ClientScript.RegisterStartupScript(this.GetType(), "click", "xyz();", true);

You can't "call" a Javascript function from ASP.NET C# code-behind. You can write additional Javascript to the webpage. By the time the page is sent back to the user and the Javascript exists, your code-behind is gone. You can write out to a Literal or do a Response.Write()
Response.Write("<script language='javascript'>alert('Hellow World');</script>");

Sarathi, based on your recent update, it's not clear that you need any C# interaction at all. Your <button> appears to be strictly client-side (ie: HTML) with no ASP.NET interaction within it. To call your JavaScript function you'd attach the function call to the onclick attribute of the button tag:
<button id="save" onclick="mySaveFunction();'>Save</button>
Note that mySaveFunction() just needs to be defined in the browser's load stack for the current page. That means it could be defined in any of:
The ASPX page that holds the <button>
The Master page for the current ASPX page
One of the User controls (or MVC partials) loaded by the current ASPX page
An external JavaScript file that's loaded by one of the above.
Lastly, I'd just like to reiterate that there's nothing particularly C#/ASP.NET-specific about this. You could do the same with any language/framework, including static HTML files. Your question appears to be entirely JavaScript-dependent.

For the window object:
http://msdn.microsoft.com/en-us/library/ms536420%28VS.85%29.aspx
window.execScript
For the page pbject:
http://msdn.microsoft.com/en-us/library/dfbt9et1%28v=VS.71%29.aspx
RegisterClientScriptBlock
RegisterOnSubmitStatement
RegisterStartupScript
etc ...

you can call javascript function from code behind page ..for example you have closewindow function definition part in javasript..if you want to execute that function,you can write following codings in any click event in code behind page..
ClientScript.RegisterClientScriptBlock(GetType(), "close", "<script language=javascript>Closewindow();</script>", false);

Related

Register JavaScript alert at extreme end using RegisterStartupScript

(Note: Just to clarify the problem is not specifically related to C1WebDateEdit. It could be with any custom control which require JavaScript to render actual control)
I have many C1WebDateEdit controls in my page. On a button click based on some condition I am displaying JavaScript alert message ScriptManager.RegisterStartupScript. These controls are inside UpdatePanel. The issue I am facing with it is, when these C1WebDateEdit has not value and page displays alert message, it displays "01/01/0001" behind the alert box and on closing alert it shows empty textboxes.
The reason is, C1WebDateEdit creates actual control using JavaScript. and page renders alert message JavaScript before C1WebDateEdit controls' JavaScript.
For example:
HTML markup
alert JavaScript
C1WebDateEdit JavaScript
Logical solution is get alert JavaScript after C1WebDateEdit JavaScript because it will allow C1WebDateEdit to load fully before alert box.
I found no inbuilt way in asp.net to change sequence, so I tries solution given here but It didn't work for me.
One possible solution I am thinking that I create Custom or WebUserControl and place at it last at the page in the UpdatePanel and PreRender event I call ScriptManager.RegisterStartupScript to register alert message. Logically I think it will work but trying to find that any one implemented any other solution for it?.
Other possible solution is use "pageLoaded" event of PageRequestManager. I created below function for temporary fix:
function delayedAlertBox(strMsg)
{
var fnc = function (a, b)
{
//remove reference so on next call it do not show previous alerts.
Sys.WebForms.PageRequestManager.getInstance().remove_pageLoaded(fnc);
alert(strMsg);
}
//add function reference to call on Ajax pageloaded event
Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(fnc);
}
and calling in asp.net like simple function as given below:
ScriptManager.RegisterStartupScript(Page, Page.GetType(), "dd", "delayedAlertBox('Hi, how are you?')", True)
But still looking for any other good alternative. If I found other, I will post it.

Why javascript function not working from content page onload?

I am using ASP.NET 3.5.
I have a content page and I want to call a javascript function on this page's load event.
I tried adding:
onload="GetLocalDate();"
within the content page placeholder tag, but it is not working. But when I call this function from any button's OnClientClick event, it works.
How to make it work on Content Page's load event?
The content page "Placeholder" tag is a server side only control. It doesn't produce any code on the client other than arranging its contents etc. As such, the JavaScript onload handle is never rendered.
Examine your browser / client-side source to verify this.
Have you tried calling from document.ready?
$(document).ready(function () {
GetLocalDate();
}
Put that inside script tag on your page
<script type="text/javascript">
function pageLoad(){
GetLocalDate();
}
</script>
$(document).ready(function () {
GetLocalDate();
}
Should work. Since it was not working for you, I would assume that you do not have a reference to the jQuery library in your page.
If you don't want to include the jQuery library in your project for some reason, you could inject it from server-side code within your content page:
ClientScriptManager cs = Page.ClientScript;
cs.RegisterStartupScript(...) <-- add necessary details here (the Type, scriptname, the text, and a Boolean to whether you need it to include its own tags)
You should also check to make sure it hasn't already been registered before using it though (IsStartupScriptRegistered).

__doPostBack outside of href causes full page postback

I have a custom control (ascx) which implements the IPostBackEventHandler interface for intercepting custom events triggered by custom rendered HTML links.
In this control I use an update panel and inside the update panel I use a literal control in which I render custom HTML links.
When I render the HTML links inside the literal control I use a StringBuilder with the following code:
sb.AppendFormat ("Text",
this.Page.ClientScript.GetPostBackClientHyperlink(this, custom_string_param));
Hyperlinks are rendered fine, and when clicking on them an asynchronous postback is triggered and a partial update is fired (since all links are rendered inside the Update panel).
The problem is that I need to do some custom Javascript before firing the __doPostBack which is rendered with the above code. So here is a simplified version of the changed code:
sb.AppendFormat ("Text",
custom_string_param);
Also in the ascx markup I use the following code (inside or outside the Update panel):
<script language="javascript" type="text/javascript">
function JSFunc(param) {
// custom js code here ....
__doPostBack('<%=this.ClientID%>', param);
}
</script>
The problem here is that when a link is clicked it performs a full postback and not a partial one. I also tested more simple versions of the above code and it seems that if you remove the __doPostBack from the href or the onclick events from the link ( tag) and move it to a custom js function which in turns you supply to the link, a full postback is triggered.
Note that there is no error on the page and in both cases the code work correctly. The page is rendering correctly depending on the parameters returned from the __doPostBack, but in the second case a full instead of partial postback is firing.
Any ideas?
Thanks in advance,
George
I think you can't call __doPostBack with the ClientID. It actually uses UniqueIDWithDollars, but generally with ASP.NET Web Forms I say: you don't want to know.
Since calling this method is all about abstracting away the details of how post back works, you would be better off asking the framework for the code. Luckily, there's a special method just for that, which will take care of the details. In your code it would look like something like this:
<script language="javascript" type="text/javascript">
function JSFunc(param) {
// custom js code here ....
<%= Page.ClientScript.GetPostBackEventReference(this, custom_string_param) %>
}
</script>
This let's the client script manager create the piece of JavaScript code, using a reference to your user control (this) and any custom event argument (custom_string_param).
There's one caveat though. When calling it this way, it will add javascript: to the beginning of the string.
To override this behaviour, you need to use an overload of GetPostBackEventReference that accepts an instance of PostBackOptions as its first argument, the instance having its RequiresJavaScriptProtocol property set to false.
PostBackOptions options = new PostBackOptions(this, custom_string_param)
options.RequiresJavaScriptProtocol = false;
Page.ClientScript.GetPostBackEventReference(options)

fadeIn/fadeOut div tag after executing some server side code

Here is my code
<div id="AuthenticateUser" runat="server" style="display:block" >
//login control
<asp:button id="ValidateUser" ... />
</div>
<div id="ForceToChangePassword" runat="server" style="display:none" >
//reset password control
</div>
On click of "ValidateUser" button, I do check whether user is valid or not. Based on some condition I do need hide "AuthenticateUser" div tag and show "ForceToChangePassword" div tag.
I really like the jQuery fadeIn/fadeOut effect. I can easily do that on client side. But how can I give that effect after executing server side code?
I tried to call javascript method from code behind that method has a fadeIn/fadeOut logic but it seems like that javaScript method is never been called.
If you have the AJAX extensions, put this in the button event handler. (C# example, easily converted to vb.net)
ScriptManager.RegisterClientScriptBlock(this, GetType(this), "fader", "$('#AuthenticateUser').fadeOut(); $('#ForceToChangePassword').fadeIn();");
This will send a client script after the postback has completed. Here is the documentation. This also requires a ScriptManager on the page. If you don't have the AJAX extensions you can probably use it from the Page's method itself.
The best way is to replace your asp:button (which I'm assuming is doing a postback) with an html button and some javascript to make an AJAX call (or JSON & REST call).
jQuery supports REST services really well with their .ajax method.
http://api.jquery.com/category/ajax/
WCF also supports JSON & REST services very nicely.
http://www.west-wind.com/weblog/posts/324917.aspx
It's a match made in heaven.
When the web service call completes, a javascript method (specified in the jquery .ajax call) will get called, and you can do the fade at that point.
If you make any ajax request then you must have to call the function which handling fadeIn/fadeOut logic, within the response callback function. you have to do something like
$.ajax({
url: "url-to-backend",
success: function(msg){
changeDiv();
}
});
function changeDiv()
{
//your code to handle fadeIn/fadeOut logic;
}
Thanks
You need to use an AJAX call for something like this. http://api.jquery.com/category/ajax/
Basically, the javascript will send your login request to your serverside code. The serverside will send the response back (you can decide what kind of response).
Then use that response to determine if you should be fading in or not.
$.post('login.aspx', {credentials (hopefully encrypted)}, callbackFunction(dataFromServer){
if(dataFromServer == loggedin)
fadein
else
don't
});

How to run a javascript function before postback of asp.net button?

I'm using Javascript to create a DIV element and open up a new page by using onclientclick. This works great. Now, I need to write to it from the server side and this element must be created before it is posted back.
How do I get the javascript to execute before the postback?
Currently, I have to press the button twice because the element doesn't exist to write too on the first click.
To be clear, I need this to execute before the "OnClick" of the button.
Update: It looks like the Javascript function is called before the postback but the element is not updated until I run the second postback. Hmm
Update: Unfortunately it is a bit more complicated then this.
I'm creating a div tag in javascript to open a new window. Inside the div tag, I'm using a databinding syntax <%=Preview%> so that I can get access to this element on the server side. From the server side, I'm injecting the code.
I'm thinking this may be a chicken-egg problem but not sure.
UPDATE!
It is not the Javascript not running first. It is the databinding mechanism which is reading the blank variable before I'm able to set it.
Hmm
you don't have to rely on server controls to perform postbacks in asp.net. you can gain finer control of your app by posting from javascript whenever you are ready..
the framework auto generates a function called __doPostback(.....) and eventually calls it every time it needs to do a postback.
so. instead of using server control button, you can have a regular <button onclick="foo()" />
than once you're done performing all that you need, just call the __doPostback function.
asp.net gives you a nifty way to access that function with
Page.GetPostbackClientEvent (i believe, but there are couple methods that support this methodology)
http://msdn.microsoft.com/en-us/library/system.web.ui.page.getpostbackclientevent.aspx
enter code hereWould this work for you?
Javascript
function stuffYouWantToDo(){
//do your stuff
//then submit the .NET form
document.forms[0].submit();
}
.NET code
<asp:button ID="Button1" onClientClick="return false;stuffYouWantToDo();"/>
This should ensure that the stuff you want to do is done, then the form will be submitted. The return false prevents the form from being submitted when you first click the button and relies on the call in the stuffYouWantToDo function to submit the form.
If you want to use jquery you could do the following:
$(document).ready(function() {
var execScript = $(".myButton").attr("href").replace("javascript:", "");
$(".myButton").attr("href", "#").click(function() {
// Add before click logic here
eval(execScript);
});
});
Couldn't you simply add a custom validator somewhere in your form?

Resources