Happy to Help

<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="background-color: white; color: #3d3d3d; font-family: arial, sans-serif; font-size: 13px; line-height: 14px;">Using </span><span style="background-color: white; color: #3d3d3d; font-family: arial, sans-serif; font-size: 13px; line-height: 14px;">ASP.Net AJAX ScriptManager , you can call Server Side ASP.Net methods from client side without any PostBack using PageMethods.</span><br />
<span style="background-color: white; color: #3d3d3d; font-family: arial, sans-serif; font-size: 13px; line-height: 14px;"><br /></span>
<span style="background-color: white; color: #3d3d3d; font-family: arial, sans-serif; font-size: 13px; line-height: 14px;">Actually it serves as an AJAX call to the server but it allows us to call the method or function defined at server side.For this you have to add a scriptmanager tag and set the EnablePageMethods property as true.</span><br />
<span style="background-color: white; color: #3d3d3d; font-family: arial, sans-serif; font-size: 13px; line-height: 14px;"><br /></span>
<br />
<div style="background-color: white; color: #3d3d3d; font-family: 'Open Sans', Arial, Verdana, sans-serif; font-size: 13px; margin: 0in 0in 10pt;">
<b><span style="font-family: arial, sans-serif; font-size: 10pt; line-height: 14px;">Enabling PageMethods</span></b></div>
<div style="background-color: white; color: #3d3d3d; font-family: 'Open Sans', Arial, Verdana, sans-serif; font-size: 13px; margin: 0in 0in 10pt;">
<span style="font-family: arial, sans-serif; font-size: 10pt; line-height: 14px;">The first thing you need to do is add a ASP.Net AJAX ScriptManager to the page and set its</span>

<span style="color: red; font-family: 'courier new'; font-size: 10pt; line-height: 14px;">EnablePageMethods</span><span style="font-family: arial, sans-serif; font-size: 10pt; line-height: 14px;"> property to true as shown below</span></div>
<div class="code" style="background-attachment: scroll; background-color: #f2f2f2; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: 1pt solid windowtext; color: #3d3d3d; font-family: 'Open Sans', Arial, Verdana, sans-serif; font-size: 13px; padding: 1pt 4pt; width: 600px !important;">
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: blue; font-family: 'courier new'; font-size: 10pt;"><</span><span style="color: maroon; font-family: 'courier new'; font-size: 10pt;">asp</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">:</span><span style="color: maroon; font-family: 'courier new'; font-size: 10pt;">ScriptManager </span><span style="color: red; font-family: 'courier new'; font-size: 10pt;">ID</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">="myScriptManager" </span><span style="color: red; font-family: 'courier new'; font-size: 10pt;">runat</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">="server"</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;"> </span><br />
<span style="color: red; font-family: 'courier new'; font-size: 10pt;">EnablePageMethods</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">="true"></span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: blue; font-family: 'courier new'; font-size: 10pt;"></</span><span style="color: maroon; font-family: 'courier new'; font-size: 10pt;">asp</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">:</span><span style="color: maroon; font-family: 'courier new'; font-size: 10pt;">ScriptManager</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">></span></div>
</div>
<br style="background-color: white; color: #3d3d3d; font-family: 'Open Sans', Arial, Verdana, sans-serif; font-size: 13px;" />
<div style="background-color: white; color: #3d3d3d; font-family: 'Open Sans', Arial, Verdana, sans-serif; font-size: 13px; margin: 0in 0in 10pt;">
<b><span style="font-family: arial, sans-serif; font-size: 10pt; line-height: 14px;">HTML Markup</span></b></div>
<div class="code" style="background-attachment: scroll; background-color: #f2f2f2; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: 1pt solid windowtext; color: #3d3d3d; font-family: 'Open Sans', Arial, Verdana, sans-serif; font-size: 13px; padding: 1pt 4pt; width: 600px !important;">
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: blue; font-family: 'courier new'; font-size: 10pt;"><</span><span style="color: maroon; font-family: 'courier new'; font-size: 10pt;">form</span><span style="color: red; font-family: 'courier new'; font-size: 10pt;"> id</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">="form1" </span><span style="color: red; font-family: 'courier new'; font-size: 10pt;">runat</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">="server"></span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: blue; font-family: 'courier new'; font-size: 10pt;"><</span><span style="color: maroon; font-family: 'courier new'; font-size: 10pt;">asp</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">:</span><span style="color: maroon; font-family: 'courier new'; font-size: 10pt;">ScriptManager </span><span style="color: red; font-family: 'courier new'; font-size: 10pt;">ID</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">="</span><span style="color: blue; font-family: 'courier new'; font-size: 13px;">myScriptManager</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">"</span><span style="color: red; font-family: 'courier new'; font-size: 10pt;"> runat</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">="server" </span><span style="color: red; font-family: 'courier new'; font-size: 10pt;">EnablePageMethods</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">="true"></span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: blue; font-family: 'courier new'; font-size: 10pt;"></</span><span style="color: maroon; font-family: 'courier new'; font-size: 10pt;">asp</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">:</span><span style="color: maroon; font-family: 'courier new'; font-size: 10pt;">ScriptManager</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">></span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: blue; font-family: 'courier new'; font-size: 10pt;"><</span><span style="color: maroon; font-family: 'courier new'; font-size: 10pt;">div</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">></span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: #3d3d3d; font-family: 'courier new'; font-size: 10pt;">Your Name :</span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: blue; font-family: 'courier new'; font-size: 10pt;"><</span><span style="color: maroon; font-family: 'courier new'; font-size: 10pt;">asp</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">:</span><span style="color: maroon; font-family: 'courier new'; font-size: 10pt;">TextBox</span><span style="color: red; font-family: 'courier new'; font-size: 10pt;"> ID</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">="txtUserName" </span><span style="color: red; font-family: 'courier new'; font-size: 10pt;">runat</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">="server" ></</span><span style="color: maroon; font-family: 'courier new'; font-size: 10pt;">asp</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">:</span><span style="color: maroon; font-family: 'courier new'; font-size: 10pt;">TextBox</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">></span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: blue; font-family: 'courier new'; font-size: 10pt;"><</span><span style="color: maroon; font-family: 'courier new'; font-size: 10pt;">input</span><span style="color: red; font-family: 'courier new'; font-size: 10pt;"> id</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">="btnGetMessage" </span><span style="color: red; font-family: 'courier new'; font-size: 10pt;">type</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">="button" </span><span style="color: red; font-family: 'courier new'; font-size: 10pt;">value</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">="Show Message"</span><span style="color: red; font-family: 'courier new'; font-size: 10pt;"> onclick</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">="ShowMessage()"/></span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: blue; font-family: 'courier new'; font-size: 10pt;"></</span><span style="color: maroon; font-family: 'courier new'; font-size: 10pt;">div</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">></span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: blue; font-family: 'courier new'; font-size: 10pt;"></</span><span style="color: maroon; font-family: 'courier new'; font-size: 10pt;">form</span><span style="color: blue; font-family: 'courier new'; font-size: 10pt;">></span></div>
</div>
<br style="background-color: white; color: #3d3d3d; font-family: 'Open Sans', Arial, Verdana, sans-serif; font-size: 13px;" />
<div style="background-color: white; color: #3d3d3d; font-family: 'Open Sans', Arial, Verdana, sans-serif; font-size: 13px; margin: 0in 0in 10pt;">
<span style="font-family: arial, sans-serif; font-size: 10pt; line-height: 14px;">As you noticed above I have added a textbox when user can enter his name and a HTML button that calls a JavaScript method to get the Current Time.</span></div>
<div style="background-color: white; color: #3d3d3d; font-family: 'Open Sans', Arial, Verdana, sans-serif; font-size: 13px; margin: 0in 0in 10pt;">
<b><span style="font-family: arial, sans-serif; font-size: 10pt; line-height: 14px;">Client Side Methods</span></b></div>
<div class="code" style="background-attachment: scroll; background-color: #f2f2f2; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: 1pt solid windowtext; color: #3d3d3d; font-family: 'Open Sans', Arial, Verdana, sans-serif; font-size: 13px; padding: 1pt 4pt; width: 600px !important;">
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: blue; font-family: 'courier new'; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: 'courier new'; font-size: 9.5pt;">script </span><span style="color: red; font-family: 'courier new'; font-size: 9.5pt;">type</span><span style="color: blue; font-family: 'courier new'; font-size: 9.5pt;">="text/javascript"></span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: blue; font-family: 'courier new'; font-size: 9.5pt;">function</span><span style="color: #3d3d3d; font-family: 'courier new'; font-size: 9.5pt;"> ShowMessage() {</span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: #3d3d3d; font-family: 'courier new'; font-size: 9.5pt;">PageMethods.</span><span style="color: #3d3d3d; font-family: 'courier new'; font-size: 13px;">CallServerSideMethod</span><span style="color: #3d3d3d; font-family: 'courier new'; font-size: 9.5pt;">(document.getElementById(<span style="color: maroon; font-family: 'Courier New' !important; font-size: 10pt;">"<span style="background-attachment: scroll; background-color: yellow; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; color: #3d3d3d; font-size: 10pt;"><%</span>=txtUserName.ClientID<span style="background-attachment: scroll; background-color: yellow; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; color: #3d3d3d; font-size: 10pt;">%></span>"</span>).value, OnSuccess);</span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: #3d3d3d; font-family: 'courier new'; font-size: 9.5pt;">}</span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: blue; font-family: 'courier new'; font-size: 9.5pt;">function</span><span style="color: #3d3d3d; font-family: 'courier new'; font-size: 9.5pt;"> OnSuccess(response, userContext, methodName) {</span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: #3d3d3d; font-family: 'courier new'; font-size: 9.5pt;">alert(response);</span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: #3d3d3d; font-family: 'courier new'; font-size: 9.5pt;">}</span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: blue; font-family: 'courier new'; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: 'courier new'; font-size: 9.5pt;">script</span><span style="color: blue; font-family: 'courier new'; font-size: 9.5pt;">></span></div>
</div>
<br style="background-color: white; color: #3d3d3d; font-family: 'Open Sans', Arial, Verdana, sans-serif; font-size: 13px;" />
<div style="background-color: white; color: #3d3d3d; font-family: 'Open Sans', Arial, Verdana, sans-serif; font-size: 13px; margin: 0in 0in 10pt;">
<span style="font-family: arial, sans-serif; font-size: 10pt; line-height: 14px;">Above the </span><span style="font-family: 'courier new';"><b>ShowMessage</b></span><span style="font-family: arial, sans-serif; font-size: 10pt; line-height: 14px;"><b>method </b>makes an AJAX call to the server using ASP.Net AJAX ScriptManager PageMethods and executes the </span><span style="font-family: 'courier new';"><b>CallServerSideMethod </b></span><span style="font-family: arial, sans-serif; font-size: 10pt; line-height: 14px;">method which accepts string parameter (name) and returns a string value.</span></div>
<div style="background-color: white; color: #3d3d3d; font-family: 'Open Sans', Arial, Verdana, sans-serif; font-size: 13px; margin: 0in 0in 10pt;">
<b><span style="font-family: arial, sans-serif; font-size: 10pt; line-height: 14px;">Server Side Methods</span></b></div>
<div style="background-color: white; color: #3d3d3d; font-family: 'Open Sans', Arial, Verdana, sans-serif; font-size: 13px; margin: 0in 0in 10pt;">
<b><span style="font-family: arial, sans-serif; font-size: 10pt; line-height: 14px;">C#</span></b></div>
<div class="code" style="background-attachment: scroll; background-color: #f2f2f2; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: 1pt solid windowtext; color: #3d3d3d; font-family: 'Open Sans', Arial, Verdana, sans-serif; font-size: 13px; padding: 1pt 4pt; width: 600px !important;">
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: #3d3d3d; font-family: 'courier new'; font-size: 10pt;">[System.Web.Services.<span style="color: #2b91af; font-family: 'Courier New' !important; font-size: 10pt;">WebMethod</span>]</span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: blue; font-family: 'courier new'; font-size: 10pt;">public staticstring</span><span style="color: #3d3d3d; font-family: 'courier new'; font-size: 10pt;"> CallServerSideMethod(<span style="color: blue; font-family: 'Courier New' !important; font-size: 10pt;">string</span> name)</span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: #3d3d3d; font-family: 'courier new'; font-size: 10pt;">{</span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; padding: 0in; width: 600px !important;">
<span style="color: blue; font-family: 'courier new'; font-size: 10pt;">return </span><span style="color: #a31515; font-family: 'courier new'; font-size: 10pt;">"Hello "</span><span style="color: #3d3d3d; font-family: 'courier new'; font-size: 10pt;"> + name + <span style="color: #2b91af; font-family: 'Courier New' !important; font-size: 10pt;">Environment</span>.NewLine + <span style="color: #a31515; font-family: 'Courier New' !important; font-size: 10pt;">"You have called server side method"</span></span><span style="color: #3d3d3d; font-family: 'courier new'; font-size: 10pt;">;</span></div>
<div style="background-attachment: scroll; background-image: none; background-position: 0% 0%; background-repeat: repeat repeat; border: medium none; color: white !important; font-family: 'Courier New' !important; font-size: 10pt; margin: 0in 0in 10pt; padding: 0in; width: 600px !important;">
<span style="color: #3d3d3d; font-family: 'courier new'; font-size: 10pt; line-height: 14px;">}</span></div>
<div>
<br /></div>
</div>
<div style="background-color: white; color: #3d3d3d; font-family: 'Open Sans', Arial, Verdana, sans-serif; font-size: 13px; margin: 0in 0in 10pt;">
<span style="font-family: arial, sans-serif; font-size: 10pt; line-height: 14px;">The above method simply returns a message. An important thing to note is that the method is declared as </span><span style="color: blue; font-family: 'courier new'; font-size: 10pt; line-height: 14px;">static</span><span style="font-family: arial, sans-serif; font-size: 10pt; line-height: 14px;"> (C#) </span><span style="font-family: arial, sans-serif; font-size: 10pt; line-height: 14px;"> and also it is declared as <b>Web Method.</b></span><br />
<span style="font-family: arial, sans-serif; font-size: 10pt; line-height: 14px;"><br /></span>
<span style="font-family: arial, sans-serif; font-size: 10pt; line-height: 14px;">Unless we mark this  method as with </span><b><i><span style="font-family: 'courier new';">[System.Web.Services.</span><span style="color: #2b91af; font-family: 'Courier New' !important; font-size: 10pt;">WebMethod</span><span style="font-family: 'courier new';">]</span></i></b><span style="font-family: arial, sans-serif; line-height: 14px;"> </span><span style="font-family: arial, sans-serif; line-height: 14px;">attribute we </span><span style="font-family: arial, sans-serif; font-size: 10pt; line-height: 14px;"> will not be able to call it using javascript function and ASP.Net ScriptManager PageMethods.</span></div>
<div style="background-color: white; color: #3d3d3d; font-family: 'Open Sans', Arial, Verdana, sans-serif; font-size: 13px; margin: 0in 0in 10pt;">
<br /></div>
</div>

Calling Server Sides C# functions from Javascript in ASP.Net

Using ASP.Net AJAX ScriptManager , you can call Server Side ASP.Net methods from client side without any PostBack using PageMethods. Actually it serves as an AJAX call to the server but it allows us …

Read complete article »

Happy to Help

Calling Server Sides C# functions from Javascript in ASP.Net

NaMo & The Truth About US Visa

इस स्वतंत्रता दिवस पर....

Freshers job in Sapient Nitro