creating ajax function

Question

how we can create ajax function for login form. In this form user click on login tab not whole webpage get reload but only login form part reload

Brajesh Kumar · Answer

You could create a PageMethod:(controllor) [WebMethod] public static bool MyMethod(string username string password) { ...//your code return true; } in your index or cshtml page(view) and then get rid of the double JSON stringification and call the page method: var postData = JSON.stringify({ username: $(#username).val() password: $(#password).val() }); $.ajax({ type: POST url: LoginPageForLearn.aspx/MyMethod data: postData contentType: application/json; charset=utf-8 success: callbackfunction error: function (msg) { alert(msg); } }); (view ) and in your callback you could test the result of the page method: function callbackfunction(result) { if (result.d) { alert('success'); } } You can go through simple article it will help you a lot http://www.aspdotnet-pools.com/2014/09/ajax-login-form-using-jquery-in-aspnet.html http://www.binaryintellect.net/articles/51a057aa-dd50-435c-96a1-31b1fc43b9d6.aspx If you want to use web form your code may look like this Design Page Username: Password: $(function () { $([id*=btnlogin]).bind(click function () { var user = {}; user.Username = $([id*=txtUsername]).val(); user.Password = $([id*=txtPassword]).val(); $.ajax({ type: POST url: Login.aspx/ValidateUser data: '{user: ' + JSON.stringify(user) + '}' contentType: application/json; charset=utf-8 dataType: json success: function (IsValidate) { alert(IsValidate); } }); return false; }); }); SQL ALTER PROCEDURE [dbo].[Validate_Admin] @Username NVARCHAR(20) @Password NVARCHAR(20) AS BEGIN SET NOCOUNT ON; DECLARE @AdminId INT IF @AdminId IS NOT NULL BEGIN IF NOT EXISTS(SELECT AdminId FROM Admin WHERE Username = @Username AND [Password] = @Password) BEGIN SELECT @AdminId [AdminId] SELECT -3 -- Login Successfully. END ELSE BEGIN SELECT -2 -- User not activated. END END ELSE BEGIN SELECT -1 -- User invalid. END END Code Behind public partial class _Login : System.Web.UI.Page { protected void Page_Load(object sender EventArgs e) { } [System.Web.Services.WebMethod] [System.Web.Script.Services.ScriptMethod] public static string ValidateUser(Users user) { int userId = 0; string constr = ConfigurationManager.ConnectionStrings[conString].ConnectionString; using (SqlConnection con = new SqlConnection(constr)) { using (SqlCommand cmd = new SqlCommand(Validate_Admin)) { cmd.CommandType = CommandType.StoredProcedure; cmd.Parameters.AddWithValue(@Username user.Username); cmd.Parameters.AddWithValue(@Password user.Password); cmd.Connection = con; con.Open(); userId = Convert.ToInt32(cmd.ExecuteScalar()); con.Close(); } } string IsValidate = string.Empty; switch (userId) { case -1: IsValidate = Username and/or password is incorrect.; break; case -2: IsValidate = Account has not been activated.; break; case -3: IsValidate = Login Successfully.; break; } return IsValidate; } } Your Model public class Users { public string Username { get; set; } public string Password { get; set; } }

El Mahdi Archane · Answer

Hello arron below you find an example of how you can call login action from server by using ajax. $(document).ready(function () { $('#savedata').click(function () { var data = { userid: $(#userid).val() password: $(#password).val() }; $.ajax({ url: /Account/validateuser type: POST data: JSON.stringify(data) dataType: json contentType: application/json success: function (response) { if (response.Success) { $.get(@Url.Action(Index Home) function (data) { $('.container').html(data); }); } else window.location.href = @Url.Action(Login Account); } error: function () { console.log('Login Fail!!!'); } }); }); }); Try this. if you have any problem please tell me

Joginder Banger · Answer

Hi Some thought create in mind if after login page not reload what is the meaning in every website you seen that after login page reload i don't know waht is your requirement but by the way I shared some example for you http://jsfiddle.net/GRMule/WQXXT/ http://jsfiddle.net/barzik/QZ3ff/