---
title: "How to add data in data base using angular.js in mvc"  
description: "How to add data in data base using angular.js in mvc"  
author: "Anonymous User"  
published: 2015-12-28  
updated: 2015-12-28  
canonical: https://www.mindstick.com/forum/33798/how-to-add-data-in-data-base-using-angular-js-in-mvc  
category: ".net"  
tags: ["angular js", "mvc"]  
reading_time: 2 minutes  

---

# How to add data in data base using angular.js in mvc

I want to [add](https://www.mindstick.com/forum/12983/add-address-in-textbox-when-page-is-load-and-if-i-search-address-in-textbox-show-in-map-by-javascript) [data in database](https://www.mindstick.com/forum/34103/how-to-insert-data-in-database-using-sencha-touch-extjs) using angular.js in mvc. please help me

## Replies

### Reply by Anonymous User

AngularJS is a JavaScript framework. It is a library written in JavaScript.AngularJS is distributed as a JavaScript file, and can be added to a web page with a script tag:\
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>AngularJS Extends HTMLAngularJS extends HTML with ng-directives.The ng-app directive defines an AngularJS application.The ng-model directive binds the value of HTML controls (input, select, textarea) to application [data](https://www.mindstick.com/articles/13050/salesforce-aiming-to-dominate-predictive-analytics-with-data-science).The ng-bind directive binds application data to the HTML view.

```
@{
    ViewBag.Title = "Country";
    Layout = "~/Views/Shared/_Dashboard.cshtml";
}
<script src="/Scripts/angular.js" type="text/javascript"></script>
<script src="/Scripts/Country.js" type="text/javascript"></script>
<script language="javascript">
    var App = angular.module('Country', []);
    App.controller('CountryControler', Viewmodel);
</script>
<div data-ng-app="Country">
    <div class="box ui-draggable ui-droppable" data-ng-controller="CountryControler">
        <div class="box-header">
            <div class="box-name">
                <i class="fa fa-search"></i><span>Add Country</span>
            </div>
            <div class="box-icons">
                <a class="collapse-link"><i class="fa fa-chevron-up"></i></a><a class="expand-link">
                    <i class="fa fa-expand"></i></a><a class="close-link"><i class="fa fa-times"></i>
                </a>
            </div>
            <div class="no-move">
            </div>
        </div>
        <div class="box-content">
            <form class="form-horizontal" role="form">
            <div class="form-group">
                <label class="col-sm-2 control-label">
                    Country Name</label>
                <div class="col-sm-4">
                    <input type="text" data-ng-model="Country.countryName" class="form-control" placeholder="Country Name"
                        data-toggle="tooltip" data-placement="bottom" title="" data-original-title="Tooltip for name">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label">
                    Country Code</label>
                <div class="col-sm-4">
                    <input type="text" data-ng-model="Country.countryCode" class="form-control" placeholder="Country Code"
                        data-toggle="tooltip" data-placement="bottom" title="" data-original-title="Tooltip for name">
                </div>
            </div>
            <div class="clearfix">
            </div>
            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-4">
                    <button type="button" class="btn btn-primary btn-label-left" ng-hide="modifyField"
                        data-ng-click="Add()">
                        <span><i class="fa fa-clock-o"></i></span>Submit
                    </button>
                    <button type="button" class="btn btn-primary btn-label-left" ng-show="modifyField"
                        data-ng-click="update()">
                        <span><i class="fa fa-clock-o"></i></span>Update
                    </button>
                    <button type="button" class="btn btn-default btn-label-left">
                        <span><i class="fa fa-clock-o txt-danger"></i></span>Cancel
                    </button>
                </div>
            </div>
            </form>
        </div>
    </div>
</div>
Country.js
var Viewmodel = function ($scope, $http) {
    $scope.Country = {
        "countryId": "",
        "countryName": "",
        "countryCode": ""
    }


    $scope.Add = function () {
        data = $scope.Country;
        $.ajax({
            type: 'POST',
            contentType: 'application/json; charset=utf-8',
            data: JSON.stringify(data),
            url: '/Location/Add',
            success: function (status) {
                $scope.Load();
            },
            error: function (status) { }
        });
    }

}

```

```
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using EntityFramworkEcommerce;
namespace EntityFramworkEcommerce.Controllers
{
    public class LocationController : Controller
    {
        //

        // GET: /Location/
        EcommerceEntities db = new EcommerceEntities();

        public ActionResult Country()
        {
            return View();
        }
        [HttpPost]
        public void Add(country obj)
        {
            db.country.AddObject(obj);
            db.SaveChanges();
        }

    }
}
```

![How to add data in data base using angular.js in mvc](https://www.mindstick.com/mindstickforums/f5c95ddf-afae-44d0-8a6c-81c51860e30c/images/c3b53923-f824-474f-976a-ab2af1943983.png)\


---

Original Source: https://www.mindstick.com/forum/33798/how-to-add-data-in-data-base-using-angular-js-in-mvc

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.