Calling jvascript function from the button under UpdatePanel

Hello,

I am having a a web application developed using asp.net2.0 with vb.net as a language.

In this web application i am having two buttons and one update panel. Now my button1 is outside the updatepanel and another button2 is present inside the updatepanel.

In asp.net if we want to run any javascript function on the click of a button then we normally use the button.attribute.add() function but if we want that when user click on button then first some server side code will be performed and then the javascript function will be called.

For that we uses the below code in asp.net !!!

Page.ClientScript.RegisterClientScriptBlock(Me.GetType,"Script", "<Script>alert('Hello');</Script>")

this code is working fine on the click event of the button that is present outside the update panel. But when i am running the same code on the click event of the button that is present inside the updatepanel then its not working,

Remeber that i d't want to run the javascript code when user just click on the button , i want first some server side code wil perform his work then after this script will run.

But for controls under update panel its not working.??

please paste your code here, because I am doing almost the same thing here without any issues.

Hi,

Add a Literal control to your web form.

In your Click method use this code:

literal1.Text = "<script type=\"text/javascript\"> alert('Hello world!');</script>";

Dont forget to clear Text property in another postbacks.

Use ScriptManager.RegisterStartupScript, instead of the ClientScript class' method.

Can anyone tell me the solution for this?

Me too getting the same issue.

Thanks,

Jasmeeta.

Calling JavaScript Function From C#

Dear Team

i am using VS2005 ASP.NET 2.0 C# JavaScript AJAX
i want on timer tick in side uodate panel to call javascript Function()
so how can i do that.

thank you

I would very much like to know how to do that too.

I have a ModalPopup containing SimpleViewer, and I need to set the path to an xml file when the user clicks an imagebutton, but as there is no postback going on I can't add that path or whatever it might be to the JavaScript block.

So I relaly need for the JavaScript block to be "loaded" and executed when the user clicks one of many buttons and then load the javascript based on that.

This is a great resource on using a TimerControl with an UpdatePanel:

http://ajax.asp.net/docs/tutorials/IntroToTimerControl.aspx

However if you want to execute a JavaScript function before/during/after an UpdatePanel is refreshed you will need to explore the PageRequestManagerClass:

http://ajax.asp.net/docs/ClientReference/Sys.WebForms/PageRequestManagerClass/default.aspx

You can add the following Javascript to a page:

<script type="text/javascript">
Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(pageLoaded);
function pageLoaded(sender, args) {
if (args.get_panelsUpdated().length > 0){
alert('a panel was just updated!');
// doSomeFunction();
}
}
</script>

Cheers,
Al

Calling AJAX function

Hi, I wonder if there's a way to call an AJAX function via code behind page. That is, I have an asp tab control on my page, in which on pressing a tab I open a menu via AJAX code and ask user to enter password then I validate that password and want to select that tab if password is correct. Since my tab is asp control the AJAX code doesn't know that so I have to return the password to the code behind page but since I have to call such function through AJAX:

[Ajax.AjaxMethod(HttpSessionStateRequirement.ReadWrite)]
public void CheckRoomPsw(string psw)
{

...

}

I don't have access to Tab control because this returns null, so there's two options which I don't know how to perform:

1. call an AJAX control from CheckRoomPsw(string psw)

2. get an access to tab control in CheckRoomPsw(string psw)

Any idea is appreciated.

have you tried using the findControl function. it lets you access a conrol by referencing its location and using its ID. so if you had a bunch of controls on your form and wanted to get to one you could do.

form1.findControl("controlIDgoesHere");

if yours is inside of some ajax stuff it might be like

UpdatePanel1.findControl("myControlsID");

then you can just cast that to reference the object type

string value = ((TextBox)form1.findControl("txtUserName")).Text;

Actually, I've done that:

[Ajax.AjaxMethod(HttpSessionStateRequirement.ReadWrite)]
public void CheckRoomPsw(string psw)
{
JQD.TabStrip ts = (JQD.TabStrip)this.FindControl("TabStrip1");
ts.SelectTab(Global.tabPos);
}

but this returns null!!

I think it's because CheckRoomPsw() is an AJAX function

Perform the tab selection on the client-side callback. Return a boolean from the AJAX method after you check the password, if it is true perform the tab selection.

Also, it looks like you're using AJAX.NET, which is a completely separate product from ASP.NET AJAX, so you might want to see if they have a forum.

Have you had luck fixing your issue?

-Damien

Not yet!

I'm still looking for solution!

Have you tried doing the tab selection client-side?

I tried much to get access to the tab control from js code (client side) but since the tab control is an asp user control, it can't be known from js code.

Use theOnClientActiveTabChangedproperty on the tab. Seehttp://asp.net/AJAX/Control-Toolkit/Live/Tabs/Tabs.aspx for more information.

-Damien

Thanks for your concern Domien!

However, I'm not using AJAX.net and don't know much about it and it's a bit risky to change my tab control now that I'm on the final steps of completing my project

IS there any other solution please

calling .jsp functions from asp.net

hi friends I want to call .jsp files functions from asp.net how can I do this I need to create HessianProxyFactory for that does any one knows how to do this Thanking you, Laxmikant

You will not be able to call it unless it resides in the same domain.

Callback to server (by javascript) which updates an UpdatePanel

I already posted this in http://forums.asp.net/thread/1178950.aspx
but it seems to be a very general questions about callback in ASP.NET 2.0

I have a custom (image map like) control which reacts to clicks bya javascript. the javascript part sets postback values like x, y, andraises a postback by form.submit().

Now when I place thiscontrol on an UpdatePanel, the javascript:form.submit() raises apostback, but not a partial postback...

Do I have to register thejavascript somewhere else (expect RegisterClientScript or so)?

Or isthere a way to make a postback in order that the server updates theUpdatePanel with a new image?
I tried the Callback (implementing ICallBackProvider), but this seems only to be for delivering a stringvalue from server to client (at least I couldnt kick off any partialupdate of the page..)

Regards,

RayHi Ray,

Executing form.submit() will never cause a partial postback. A partial postback occurs within an UpdatePanel if the following is true. The control causing the postback is within the UpdatePanel or the control causing the postback is setup as a trigger of the UpdatePanel. These are the two situations that cause a postback.

In your case, there are a couple of options (or lots of options that I can't think of).

One option is that your custom control's click event could cause a postback. Causing a postback boils down to executing a JavaScript command: "__doPostback(params);". I'm not sure how you're registering the client side JavaScript that sets postback values X and Y, but you can generate the necessary JavaScript to cause a postback by executing "Page.ClientScript.GetPostBackClientHyperlink (params)" in code behind. You then associate this code with the onclick clientside event by executing "this.Attributes.add("onclick",postbackCommand)." It seems that this line of JavaScript would go after whatever other clientside code you needed to execute that set X and Y.

If for some reason doing it this way is not an option, you can always place a hidden button (not .NET hidden but CSS hidden) within the UpdatePanel and programmatically through JavaScript, click it. This presents some problems because you have to have the ClientId to find the exact button you need, which can be difficult as .NET generates this Id for you based upon control hierarchy.

So those are two options for causing a postback in your situation.

Hope this helps.

- Joel

Hi Joel

Thank you, the first option (__doPostback) works great for me.

Regards,

Ray

Call server side function on javascript mouseover event?

Hi, I'm very new to ajax so please forgive me if this is a stupid question:

I have a hyperlink hooked to a mouseover event and an asp server side function called Test(). I like to know if there's any way in ASP.NET AJAX to call Test() when that mouseover event fires, and how to go about hooking this up. Code samples on how to do this would be helpful.

Thanks in advance.

Hi Totenkopf,

You can do what you want to do using the new client callback feature in asp.net 2.0 :

check these articles for more info -

http://www.devx.com/webdev/Article/28451/0/page/2

http://dotnetjunkies.com/Article/E80EC96F-1C32-4855-85AE-9E30EECF13D7.dcik

For other options check this post -

http://forums.asp.net/thread/1515994.aspx

Hmm, so can this be done at all using the existing AJAX extension? What I wish to accomplish is when a user mouseover a hyperlink, have a server-side method executes which populates a repeater control (these two are within an updatepanel)

Here's an ASP.NET AJAX solution. In this example, hovering over the link does the same thing as clicking on it. (Either action triggers an async postback.) For your example, put your repeater where I have the label. I hope this helps!

<%@. Page Language="C#" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><script runat="server"> public void click(object sender, EventArgs e) { lbl.Text = "Moused at " + DateTime.Now.ToString(); }</script><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>Untitled Page</title></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server" /> <asp:UpdatePanel ID="up1" runat="server"> <ContentTemplate> <asp:LinkButton ID="hoverButton" runat="server" OnClick="click" onmouseover="__doPostBack(this.id, '');" Text="Mouse Over Me" /> <asp:Label ID="lbl" runat="server" /> </ContentTemplate> </asp:UpdatePanel> </form></body></html>

Using the client callback doesn't give you the triggering you need. Unfortunately this can only be forked by using a private JS method that is included when you add an UpdatePanel.

On the client side, call the following method on the hover event:
Sys.WebForms.PageRequestManager.getInstance()._doPostBack(hyperlinkClientID,"Some String Argument");

Your custom hyperlink control should implementIPostBackEventHandler.

Create anOnHover event on you custom hyperlink control that can be used for triggering an update panel to refresh.

In theRaisePostBackEvent method that you have to implemented on your control, fire the OnHover event.

or yeah you can replace Sys.WebForms.PageRequestManager.getInstance()._doPostBack(hyperlinkClientID,"Some String Argument"); with __doPostBack(hyperlinkClientID,"Some String Argument");as shown be Steve.

Furthermore I forgot to mention you would have to register your control as an asyncronous control in OnPreRender():

ScriptManager

sm =ScriptManager.GetCurrent(this.Page);
if (sm !=null) sm.RegisterAsyncPostBackControl(this);

I've tried passing in an argument to the second parameter of __doPostBack, but I keep getting a "Invalid postback or callback argument..." popup. I then tried registering the control as suggested:

protected override void OnPreRender(System.EventArgs e)
{

ScriptManager sm = ScriptManager.GetCurrent(this.Page);
if (sm != null)
sm.RegisterAsyncPostBackControl(this);
}

... but then I get "The page cannot be registered through RegisterAsyncPostBackControl or RegisterPostBackControl"

I can get the argument with Request.Params.Get("__EVENTARGUMENT")if I disable EnableEventValidation, but is there any way to get this workingwithout setting EnableEventValidation to false?

Thanks for the help again.

Call ASP.NET web service and return JSON using only html/javascript

I've implmented a pretty basic webservice as per below. I did a quick test in ASP.NET AJAX using the ScriptManager and it returned JSON-formatted data perfectly. I am now trying to do the same using just html/javascript with the XmlHttpRequest object.

Currently I've assigned the context-type to the XmlHttpRequest as is apparently required, and the webservice is "working", but only returning xml.

I'd really appreciate any help - or maybe even a better way to access the ASP.NET web service externally (i.e. outside of ASP.NET). Thanks.

PART A: ASP.NET Webservice snippet

[WebService(Namespace = "http://microsoft.com/webservices/";
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[ScriptService]
public class ScriptingService : OrYxBaseWebService {
[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public ScriptPersonRoleList GetActiveCategoryManagers() {
OrYxAppStatus myStatus = BFManager.GetInstance().CreateStatus(GetDefaultRequest());
return BFManager.ScriptingBF.GetActiveCategoryManagers(ref myStatus);
}
}

PART B: Index html

<html>
<head>
<title>Ajax Test Drive</title>
<script type="text/javascript" language="javascript">

function makePOSTRequest(url, parameters) {
http_request = false;
if (window.XMLHttpRequest) { // Mozilla, Safari,...
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType) {
// set type accordingly to anticipated content type
// http_request.overrideMimeType('text/xml');
http_request.overrideMimeType('text/html');
}
} else if (window.ActiveXObject) { // IE
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
http_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {
alert("not good at all..");
}
}
}
if (!http_request) {
alert('Cannot create XMLHTTP instance');
return false;
}

http_request.onreadystatechange = confirmResponse;
http_request.open('POST', url, true);
http_request.setRequestHeader("Content-Type", "application/json");

http_request.send(parameters);
}

function confirmResponse() {
if (http_request.readyState == 4) {
if (http_request.status == 200) {
result = http_request.responseText;
document.getElementById('databox').innerHTML = result;
alert('Response:\n\n' + result);
} else {
alert('There was a problem with the request.');
}
}
}

function getData() {
var url = 'http://localhost/TVScriptingWebService/TVScripting.asmx/GetActiveCategoryManagers';
var request = makePOSTRequest(url, "");
}
</script>

</head>
<body onload="getData()">
<div style="width: 600px; padding: 10px; border: 1px solid;" align="center">
Test page</div>
<br>
<div id="databox">
</div>
<br>
</body>
</html>

What format do you want data in now?

I am wanting JSON not XML.

use text/json rather than application/json

Thanks for the response, I tried adding the following lines, but they all still return only xml as the responseText

http_request.setRequestHeader('Content-Type','text/json');

Could i again confirm that the webservice is actually returning JSON data?

The only time I have seen the webservice returns JSON data is when its called from within ASP.NET AJAX pages using the ScriptManager - which I don't want to do because these services are ultimately going to be called from a php application..

I am trying to call it using using only javascript/html and cannot get it to return JSON - only xml

Environment: ASP.NET 2.0, AJAX ASP.NET RC1. Tested on IIS5.1 and IIS6

Thanks

Well again it could be an inadvertant policy issue where microsoft doesnt want people to use other products just like datatable which is not returned as webservice. But you can always convert xml to json.

Let me see your code for consuming page in .net

Hi naturehermit,

Thanks again. You're right I could parse the xml into Json within the client, however I think that would eliminate one of the main advantages of using JSON..

I couldn't get it to work so I've implemented my own IHttpHandlerFactor and IHttpHandler classes which was pretty easy. They now intercept the webservice calls and check whether use my classes, which return JSON using the JavaScriptSerializer, or the generic WebServiceHandlerFactory().

Currently the flag I've decided on is if there is an "application/OrYxJson" within the Context-Type property of the request. If this property is set, JSON gets returned, otherwise you get good old SOAP.

Early days, but so far so good..

Good luck mate, let me know if i could be of any help. Its always good to share your experiences

Yep agreed and willdo. Thanks.

naturehermit:

What format do you want data in now?

?

Hi,

I ran into same issue where I specified in the webservice JSON and yet XML was returned. Anyway, I found ot that it actually returns JSON. Try running fiddler to intercept the response from the webservice and you'll see the JSON string. Ignore the "_type".

Thanks

Calenderextender problem

when I use the CalenderExtender with a html button as popupbutton and a asp.net text field as target control it works fine. but the problem is when the calender becomes visible if there are any dropdownlist then it is on the calender. so part of the calender becomes invisible. i.e. goes behind the DropDownList.

but if there is a textbox in the position of the DropDownList then everything works fine.

how do i solve this issue? Any idea?

Hi

I'm afraid that it's a normal thing and no solution yet,just avoid it.

Best regards

Calender Control

Hi,

i am using ajax controls in asp.net.and the problem is with calender control,when i run the application the controls goes behind the text boxes.so whats will be he solution???

Regards ASAD

Just a quickie idea but what if you change the z-index in the styles? will that help?

Hi Asadikram02,

Has your problem been resolved yet ? This kind of issue often occurs on select control and we resolve it by identify its z-index property. Here is the Article which shows the solution. http://support.microsoft.com/default.aspx?scid=kb;en-us;177378

<script>
function setindex()
{
div1.style.zIndex=text1.value;
select1.style.zIndex=text2.value;
getindexes();
}

function getindexes(){

text1.value=div1.style.zIndex;
text2.value=select1.style.zIndex;
text3.value=5;
}
</script>
Above is a sample to set the z-index for a select control. It is similar to your problem.

If it doesn't work , please post your simple sample which contains this issue. Thanks

Best regards,

Jonathan

CalendarExtender not maintaining position in gridview within scrollable div

Hi,

I posted a few months ago on a similar problem with the popupextenderhttp://forums.asp.net/t/1160340.aspx

I am now trying to do the same thing with a calendarextender however my solution in the above post does not work. Does anyone know how to get the calendarextender to appear correctly when attached to a textbox in an edititemtemplate in a gridview surrounded by a scrollable div?

I have tried to attach the same principles in the above post to the ClientOnShown event but to no avail.

Any help greatly appreciated.

Thanks

Craig

Hi Sonnyikea,

Here is the sample and I have tested on IE7 and Firefox. Please compare it with yours.

<%@. Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
<script runat="server">

</script
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div id="div-datagrid" style="width: 100%; height: 100px; overflow: auto;" align="center">
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="EmployeeID"
DataSourceID="SqlDataSource1" AllowPaging="True" >
<Columns>
<asp:BoundField DataField="EmployeeID" HeaderText="EmployeeID" InsertVisible="False"
ReadOnly="True" SortExpression="EmployeeID" />
<asp:BoundField DataField="LastName" HeaderText="LastName" SortExpression="LastName" />
<asp:BoundField DataField="FirstName" HeaderText="FirstName" SortExpression="FirstName" />
<asp:BoundField DataField="Title" HeaderText="Title" SortExpression="Title" />
<asp:TemplateField>
<EditItemTemplate>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<ajaxToolkit:CalendarExtender ID="CalendarExtender1" runat="server" TargetControlID="TextBox1" OnClientShown="onCEShown">
</ajaxToolkit:CalendarExtender>
</EditItemTemplate>
</asp:TemplateField>
<asp:CommandField ShowEditButton="True" />
</Columns>
</asp:GridView><asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NORTHWNDConnectionString%>"
SelectCommand="SELECT [EmployeeID], [LastName], [FirstName], [Title] FROM [Employees]"></asp:SqlDataSource>
</div>
<script type="text/javascript" language="javascript">
function onCEShown(){
alert(1);
}
</script>
</form>
</body>
</html>
If it doesn't work , please feel free to let me know with a tiny and workable sample. Thanks

Best regards,

Jonathan

Thanks Jonathan, I got it working