How to save angularjs table data in database in mvc

Gurmeet Singh

I want to save the angularjs table list in database table in mvc...

the data is coming in angularjs table from database, i want to save that data into sql table in mvc. please anyone help me...Thanx in Advance:)

5 Replies

Know the answer? Post it — somebody with the same question will find it here.

Manas Mohapatra9y ago
Accepted answer
Firstly you need collect all values and then convert it to JSON data. Follow below link that may help you:

http://jsfiddle.net/Malkus/L78kfkx8/

Once you got the JSON data, you need to send AJAX request server to save your data.

http://www.w3schools.com/angular/angular_http.asp
Gurmeet Singh9y ago
hello Manas sir, when i post then one exception is coming:Invalid JSON primitive: data

$scope.genbil = function () {
//alert(angular.toJson($scope.itemslst));
var jdata = JSON.stringify($scope.itemslst);
alert(jdata);
$.ajax({
type: "POST",
url:"/CustomerItem/GetBill",
data: { 'data': JSON.stringify(jdata) },
contentType:'application/json',
datatype:"json",
success:function (data) {
alert("success");
},
error:function (data) {
alert("error");
}
});
}
this is button

[MultipleButton(Name = "action", Argument = "GenerateBill")]
public ActionResult GetBill(List data)
{
}
using System;
using System.Collections.Generic;
using System.Linq;
using System.Reflection;
using System.Web;
using System.Web.Mvc;

namespace CustomerBillApp.Models
{
[AttributeUsage(AttributeTargets.Method, AllowMultiple = false, Inherited = true)]
public class MultipleButtonAttribute : ActionNameSelectorAttribute
{
public string Name { get; set; }
public string Argument { get; set; }

public override bool IsValidName(ControllerContext controllerContext, string actionName, MethodInfo methodInfo)
{
var isValidName = false;
var keyValue = string.Format("{0}:{1}", Name, Argument);
var value = controllerContext.Controller.ValueProvider.GetValue(keyValue);

if (value != null)
{
controllerContext.Controller.ControllerContext.RouteData.Values[Name] = Argument;
isValidName = true;
}

return isValidName;
}
}
}

please sir help how to solve this
Gurmeet Singh9y ago
hello Manas sir, when i post then one exception is coming:Invalid JSON primitive: data

$scope.genbil = function () {
//alert(angular.toJson($scope.itemslst));
var jdata = JSON.stringify($scope.itemslst);
alert(jdata);
$.ajax({
type: "POST",
url:"/CustomerItem/GetBill",
data: { 'data': JSON.stringify(jdata) },
contentType:'application/json',
datatype:"json",
success:function (data) {
alert("success");
},
error:function (data) {
alert("error");
}
});
}
this is button

[MultipleButton(Name = "action", Argument = "GenerateBill")]
public ActionResult GetBill(List data)
{
}
using System;
using System.Collections.Generic;
using System.Linq;
using System.Reflection;
using System.Web;
using System.Web.Mvc;

namespace CustomerBillApp.Models
{
[AttributeUsage(AttributeTargets.Method, AllowMultiple = false, Inherited = true)]
public class MultipleButtonAttribute : ActionNameSelectorAttribute
{
public string Name { get; set; }
public string Argument { get; set; }

public override bool IsValidName(ControllerContext controllerContext, string actionName, MethodInfo methodInfo)
{
var isValidName = false;
var keyValue = string.Format("{0}:{1}", Name, Argument);
var value = controllerContext.Controller.ValueProvider.GetValue(keyValue);

if (value != null)
{
controllerContext.Controller.ControllerContext.RouteData.Values[Name] = Argument;
isValidName = true;
}

return isValidName;
}
}
}

please sir help how to solve this
Manas Mohapatra9y ago
You are passing JSON value correctly to your action. You need to add one parameter in action which will receive JSON data and also make sure JSON data is correct format. Please follow below links that will help you:

http://www.c-sharpcorner.com/UploadFile/cb1429/view-model-and-sending-complex-json-objects-to-Asp-Net-mvc-v/

http://www.mikesdotnetting.com/article/220/posting-data-with-jquery-ajax-in-asp-net-razor-web-pages
Gurmeet Singh9y ago
Hello Manas Sir,i collect all json data, but in ajax call data in not coming.
$scope.genbil = function () {
//alert(angular.toJson($scope.itemslst));
var jdata = JSON.stringify($scope.itemslst);
alert(jdata);
$.ajax({
type: 'POST',
contentType: 'application/json; charset=utf-8',
data: JSON.stringify($scope.itemslst),
url: '/CustomerItem/GetBill',
success: function (data, status) {
alert("success");
},
error: function (status) { }
});
}

public ActionResult GetBill(string data)
{
return View();
}
Please sir help......