0

I am creating a Json object. Inside that I am creating an array, the array will push some fields dynamically when user clicks add buttons, I want to store the dynamic fields values in scope variable called table and passing that to submit() function, so when the user clicks the save button it calls the submit() function, where it send that field values to node using $http. The values which is sent to node js server is not inserting in tables

HTML

<form ng-controller="NewTableCtrl" ng-app="myApp" name="frm" class="form-inline" ng-submit="submitTable()">
      <input type="string" name="cat_name" class="form-control" ng-model="table.cat_name" placeholder="Enter Category Name" ng-pattern="/^[a-zA-Z]*$/" required>
      <input type="text" name="cat_desc" class="form-control" ng-model="table.cat_desc" placeholder="Enter Your Description" ng-pattern="/^[a-zA-Z]*$/" required>
      <input type="disable" class="form-control"  name="count" ng-model="table.fields.length">
      <fieldset ng-repeat="field in table.fields track by $index" >
      <input type="text" ng-model="table.fields[$index].item_name" class="form-control" name="item_name" placeholder="Category Item Name" ng-pattern="/^[a-zA-Z]*$/" required>
      <input type="text" ng-model="table.fields[$index].item_desc" class="form-control" name="item_desc" placeholder="Category Item Description" ng-pattern="/^[a-zA-Z]*$/" required>
      <input type="number" ng-model="table.fields[$index].item_count" class="form-control" name="item_count" ng-pattern="/^[0-9]/" placeholder="Category Item View Count" required>
          <div class="form-group move-down">
              <label for="Autocomplete">Generic Autocomplete</label>
              <input type="text" id="Autocomplete" class="form-control" ng-autocomplete="table.fields[$index].result1" details="details1" options="options1"/>
          </div>
          <span class="help-block well" ng-show="frm.item_count.$error.pattern">numbers only allowed</span>
             <button ng-click="removeChoice()" class="remove btn btn-danger" >close</button>
          </fieldset>
         <!--  <button ng-click="removeChoice()" >close</button> -->
         <div>
             <button class="addfields btn btn-success" ng-disabled="!frm.cat_name.$dirty||!frm.cat_desc.$dirty||frm.cat_desc.$invalid||frm.cat_name.$inavalid||!frm.item_name.$dirty||frm.item_name.$invalid||!frm.item_desc.$dirty||frm.item_desc.$invalid||!frm.item_count.$dirty||frm.item_count.$invalid" ng-click="submit(table)">Save</button>
             <button class="addfields btn btn-success" ng-click="addFormField()" ng-disabled="!frm.cat_name.$dirty||!frm.cat_desc.$dirty||frm.cat_desc.$invalid||frm.cat_name.$inavalid">Add fields</button>
         </div>
         <span class="help-block" class="well" style="color:red" ng-show="frm.cat_desc.$error.pattern">ERROR:<BR/>text only allowed</span >
         <span class="help-block" class="well" style="color:red" ng-show="frm.cat_name.$error.pattern">ERROR:<BR/>text only allowed</span >
         <span class="help-block" style="color:red" ng-show="frm.item_desc.$error.pattern">ERROR:<BR/>text only allowed</span >  
         <span class="help-block" style="color:red" ng-show="frm.item_name.$error.pattern">ERROR:<BR/>text only allowed</span >
            <pre>{{ table | json }}</pre>
</form>

Angular Code

 var app = angular.module('myApp', ['ngAutocomplete']);
     app.controller('NewTableCtrl', function($scope,$http) {
     var counter=0;
     $scope.table = { fields: [] };
     $scope.addFormField = function() {
     $scope.table.fields.push('');            

    }
   $scope.submitTable = function() {
         console.log($scope.table);
   }
   $scope.removeChoice = function() {
         $scope.table.fields.splice(this.$index,1);
   };  
   $scope.result1 = '';
         $scope.options1 = null;
         $scope.details1 = '';
         $scope.details3 = '';
         $scope.submit=function(category){                       
        $http({method:"post",url:"http://localhost:3000/insert",data:category})
         .then(function(data){
         /* Success callback */
         alert("Data hase been entered!");
              // console.log("success");
          },function(err){
             /* Failure callback */
             alert("Something went wrong!");
          });
        }

    });

Node

var mysql=require('mysql');
var http=require('http');
var uuid = require('node-uuid');
var path=require('path');
var express=require('express');
var app=express();
var bodyparser=require('body-parser');
app.use(bodyparser.json());       
app.use(bodyparser.urlencoded({extended: true})); 
var myconnection = mysql.createConnection({
host : "localhost",

user : "root",

password : "",

database : "siva"
});
app.use(express.static(__dirname + ""));
var uqid= uuid.v1();
var it_id=uuid.v4();
var tt=1;
var status="active";
app.post("/insert",function(req,res){
    console.log(req.body);
    /* TODO: Now just check that your drive function is correct, SQL is correct and whether what arguements passed to SQL callback is correct */
    myconnection.query('Insert into cate_tbl (cat_id,cat_name,cat_desc,cat_view_count,cat_status) VALUES ("'+uqid+'","'+req.body.cat_name+'","'+req.body.cat_desc+'","'+tt+'","'+status+'")',function(err, results, fields) {
        //if (err) throw err;
        if (err) {console.log("DB Error"+err); res.send("add failed"+err);}
        else res.send("add success");
    });
      myconnection.query('Insert into cate_item (cat_it_id,cat_it_name,cat_pid,cat_it_count,cat_it_desc,cat_it_status) VALUES ("'+it_id+'","'+req.body.item_name+'","'+uqid+'","'+req.body.tem_count+'","'+req.body.item_desc+'","'+status+'")',function(err, results, fields) {
        //if (err) throw err;
        if (err) {console.log("DB Error"+err); res.send("add failed"+err);}
        else res.send("add success");
    });
});
app.get('/',function(req,res){
    res.sendfile("index.html");
});

app.listen(3000,function(){
    console.log("It's Started on PORT 3000");
})
7
  • 1
    Please clean up your code for readability, just go to jsbeautifier and paste the code there; they'll clean it up for you. Commented Dec 23, 2015 at 21:57
  • Does this HTML fragment <pre>{{ table | json }}</pre> render proper data? Commented Dec 23, 2015 at 23:34
  • yes its rendering the data but only the table json data is storing in db notthe fields data Commented Dec 24, 2015 at 2:47
  • Inside your nodejs code, are you getting anything for console.log(req.body); ?? Commented Dec 24, 2015 at 12:11
  • @Thalaivar am not getting you could you please tell me what you are looking exactly Commented Dec 24, 2015 at 15:13

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.