In this article I will explain with an example, how to read (get) value from the AppSettings section of the Web.Config file in jQuery in ASP.Net using C# and VB.Net.
It is not possible to read the AppSetting value directly in jQuery and hence an AJAX call will be made to a WebMethod which will read the AppSetting value and return it to the Client Side script.
 
 
The AppSetting
The following AppSetting value will be read and fetched in JavaScript through AJAX call using jQuery.
<appSettings>
    <add key="Name" value="Mudassar Khan"/>
</appSettings>
 
 
HTML Markup
The HTML Markup consists of a TextBox and a HTML Button.
AppSetting:
<asp:TextBox ID="txtKey" runat="server"></asp:TextBox>
<input id="btnGet" type="button" value="Get AppSetting" />
 
 
Namespaces
You will need to import the following namespace.
C#
using System.Configuration;
 
VB.Net
Imports System.Configuration
 
 
The WebMethod
The GetAppSetting WebMethod accepts the parameter named key. The key parameter value is passed to the ConfigurationManager.AppSettings collection to fetch the value of the AppSettings Key.
Finally, the AppSettings value is returned.
Note: The method is declared as static (C#) and Shared (VB.Net) and also it is declared as WebMethod unless you do this you won’t be able to call the methods.
 
C#
[System.Web.Services.WebMethod]
public static string GetAppSetting(string key)
{
    return ConfigurationManager.AppSettings[key];
}
 
VB.Net
<System.Web.Services.WebMethod()>
Public Shared Function GetAppSetting(ByVal key As String) As String
    Return ConfigurationManager.AppSettings(key)
End Function
 
 
The jQuery AJAX call
The Get AppSetting Button has been assigned a jQuery click event handler and when the Button is clicked a jQuery AJAX call is made to the WebMethod.
The WebMethod which accepts the key value and returns the AppSettings value.
Finally, the AppSettings value is displayed using the JavaScript Alert Message Box.
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
    $(function () {
        $("#btnGet").click(function () {
            $.ajax({
                type: "POST",
                url: "Default.aspx/GetAppSetting",
                data: '{key: "' + $("#txtKey").val() + '" }',
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (response) {
                    alert(response.d);
                },
                failure: function (response) {
                    alert(response.responseText);
                },
                error: function (response) {
                    alert(response.responseText);
                }
            });
        });
    });
</script>
 
 
Screenshot
ASP.Net: Read (Get) AppSettings Key Value from Web.Config file in jQuery
 
 
Browser Compatibility

The above code has been tested in the following browsers.

Internet Explorer  FireFox  Chrome  Safari  Opera 

* All browser logos displayed above are property of their respective owners.

 
 
Downloads
Download Code