How to perform save in ASP.Net using angularjs

Question

I'm trying to save data to DB. The breakpoint is not hit in code behind and the data is not saved. All I see in the console log is - PASS : [object Object]. Where am i going wrong.

default.aspx:

<div data-ng-controller="defaultCtrl">
        Username
        <input type="text" id="txtUsername" data-ng-model="AdminUser.Username" />
        <br />
        Password
        <input type="text" id="txtPassword" data-ng-model="AdminUser.Password" />        
        <br />
        <button type="submit" data-ng-click="AddUser(AdminUser)">Submit</button>
</div>

default.aspx.cs: class:

public class AdminUser
    {
        public string Username { get; set; }
        public string Password { get; set; }        
    }

[WebMethod]
[ScriptMethod(UseHttpGet = true, ResponseFormat = ResponseFormat.Json)]
        public void AddUser(AdminUser adminUser)
        { --breakpoint set here but not hit

            --code to save data
            AdminUserDB.AddUser(adminUser);
        }

defaultCtrl.js:

app.controller("defaultCtrl",["$scope","DefaultFactory",function ($scope,DefaultFactory){
$scope.AddUser = function (AdminUser) {
var promise = DefaultFactory.AddUser(AdminUser);
        promise.then(function (success) {
            console.log("PASS : " + success);
},
        function (error) {
            console.log("ERR : " + error);
        })
    }
}]);

defaultFactory.js:

app.factory("DefaultFactory", ["$http", function ($http) {
    var Factory = {};
    //add new user
    Factory.AddUser = function ($params) {   
        //console.log($params); -- i can see the object with the data in console.     
        return $http({
            url: "http://localhost:49271/default.aspx/AddUser",
            method: "GET", --when i put POST here, there is an error in console
            data: $params            
        })
            .success(function (data, status) {
        })
            .error(function (data, status) {
                console.log("DATA : " + data);
                console.log("STATUS : " + status);
        });
    };    
    return Factory;
}]);

For a start <button type="submit" data-ng-click="AddUser(AdminUser)">Submit</button> you don;t need to pass in AdminUser because it is attached to your scope, so you just use that in the function. — Callum Linington
– Callum Linington, Commented Jun 22, 2015 at 8:23
@CallumLinington. Yes. Dont know that and I find this way more easy & convinient. — sukesh
– sukesh, Commented Jun 22, 2015 at 8:39
Trust me when I say this, in the long run you will find WebApi far more easier to use and far more flexible. It's worth learning. It won't take much, head over to asp.net it is well worth it. — Callum Linington
– Callum Linington, Commented Jun 22, 2015 at 8:41

Mike Gledhill · Accepted Answer · 2015-06-22 08:58:02Z

If you don't want to use WebApi, you could shift your record-saving code into a second .aspx file (or a .ashx handler file, which just contains some C# code, but no HTML page) and do the saving from there.

return $http({
            url: "http://localhost:49271/SaveRecord.ashx",
            method: "POST", 
            data: $params            
        })

If you are posting JSON data to your .ashx file, you can use JSON.Net to deserialize your data back into a C# record...

public class SaveRecordHandler : IHttpHandler
{
    public void ProcessRequest(HttpContext context)
    {
        //  Read in a JSON record which has been POSTED to a webpage, 
        //  and turn it back into an object.  
        string jsonString = "";
        HttpContext.Current.Request.InputStream.Position = 0;
        using (StreamReader inputStream = new StreamReader(context.Request.InputStream))
        {
            jsonString = inputStream.ReadToEnd();
        }

        YourDataClass oneQuestion = JsonConvert.DeserializeObject<YourDataClass>(jsonString);

Hope this helps.

Collectives™ on Stack Overflow

How to perform save in ASP.Net using angularjs

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related