I am consuming Wcf Service into Angular JS application but its not working according my expection. I am trying to send money to one account to another account using Sql transaction method. When i clicked the submit button in angular js application it is unable to post the input values to wcf service.I checked in Google Chrome in Console Application its does not show any error and i also checked in Network tab , Its receiving all the values from input filed . But the problem is the values are not receiving by Wcf Service
Here is the local class named Money Transfer…
{
[DataContract]
public class MoneyTransfer
{
string sender_account_no;
string sender_name;
string sender_sort_code;
string amount1;
string transcation_type;
string date;
string receiver_account_no;
string receiver_name;
string receiver_sort_code;
string amount2;
string transcation_type1;
string date1;
[DataMember]
public string Sender_Account_No
{
get { return sender_account_no; }
set { sender_account_no = value; }
}
[DataMember]
public string Sender_Name
{
get { return sender_name; }
set { sender_name = value; }
}
[DataMember]
public string Sender_Sort_Code
{
get { return sender_sort_code; }
set { sender_sort_code = value; }
}
[DataMember]
public string Amount
{
get { return amount1; }
set { amount1 = value; }
}
[DataMember]
public string Transcation_Type
{
get { return transcation_type; }
set { transcation_type = value; }
}
[DataMember]
public string Date
{
get { return date; }
set { date = value; }
}
[DataMember]
public string Receiver_Account_No
{
get { return receiver_account_no; }
set { receiver_account_no = value; }
}
[DataMember]
public string Receiver_Name
{
get { return receiver_name; }
set { receiver_name = value; }
}
[DataMember]
public string Receiver_Sort_Code
{
get { return receiver_sort_code; }
set { receiver_sort_code = value; }
}
[DataMember]
public string Amount1
{
get { return amount2; }
set { amount2 = value; }
}
[DataMember]
public string Transcation_Type1
{
get { return transcation_type1; }
set { transcation_type1 = value; }
}
[DataMember]
public string Date1
{
get { return date1; }
set { date1 = value; }
}
}
}
Here is my interface.
[OperationContract]
[WebInvoke(Method = "POST",
RequestFormat = WebMessageFormat.Json,
ResponseFormat = WebMessageFormat.Json,
UriTemplate = "/MoneyTranfer")]
bool MoneyTranfer(MoneyTransfer mopneyTransfer);
Here is my Implementation.
public bool MoneyTranfer(MoneyTransfer mopneyTransfer)
{
int amount = System.Convert.ToInt32(mopneyTransfer.Amount);
int amount1 = System.Convert.ToInt32(mopneyTransfer.Amount1);
SqlConnection cn = new SqlConnection(ConnectionString);
string sql = "select Account_Balance from Current_Account_Details where Account_Number='" + mopneyTransfer.Sender_Account_No + "'";
SqlCommand cmd = new SqlCommand(sql, cn);
if (cn.State == ConnectionState.Closed)
cn.Open();
//amount = int.Parse(cmd.ExecuteScalar().ToString());
if (amount > 0)
{
int b;
int b1;
SqlCommand cmd1 = new SqlCommand();
SqlTransaction trans;
if (cn.State == ConnectionState.Closed)
cn.Open();
trans = cn.BeginTransaction();
cmd1.Connection = cn;
cmd1.CommandType = CommandType.Text;
cmd1.Transaction = trans;
cmd1.CommandText = "update Current_Account_Details set Account_Balance=Account_Balance-'" + mopneyTransfer.Amount + "' where Account_Number='" + mopneyTransfer.Sender_Account_No + "'";
b = cmd1.ExecuteNonQuery();
cmd1.CommandText = "update Reward_Account_Details set Account_Balance=Account_Balance+'" + mopneyTransfer.Amount1 + "' where Account_Number='" + mopneyTransfer.Receiver_Account_No + "'";
b1 = cmd1.ExecuteNonQuery();
if (b == 1 && b1 == 1)
{
trans.Commit();
using (SqlConnection con = new SqlConnection(ConnectionString))
{
//Create the SqlCommand object
//Create the SqlCommand object
SqlCommand cmd3 = new SqlCommand("Current_Account_WITHDRAR", con);
//Specify that the SqlCommand is a stored procedure
cmd3.CommandType = System.Data.CommandType.StoredProcedure;
//Add the input parameters to the command object
cmd3.Parameters.AddWithValue("@Account_Number", mopneyTransfer.Sender_Account_No);
cmd3.Parameters.AddWithValue("@Account_Holder_Name", mopneyTransfer.Sender_Name);
cmd3.Parameters.AddWithValue("@Amount", mopneyTransfer.Amount);
cmd3.Parameters.AddWithValue("@Sort_Code", mopneyTransfer.Sender_Sort_Code);
cmd3.Parameters.AddWithValue("@Transcation_Type", mopneyTransfer.Transcation_Type);
cmd3.Parameters.AddWithValue("@Date", mopneyTransfer.Date);
SqlCommand cmd2 = new SqlCommand("Reward_Account_Dposit", con);
//Specify that the SqlCommand is a stored procedure
cmd2.CommandType = System.Data.CommandType.StoredProcedure;
//Add the input parameters to the command object
cmd2.Parameters.AddWithValue("@Account_Number", mopneyTransfer.Receiver_Account_No);
cmd2.Parameters.AddWithValue("@Account_Holder_Name", mopneyTransfer.Receiver_Name);
cmd2.Parameters.AddWithValue("@Amount", mopneyTransfer.Amount1);
cmd2.Parameters.AddWithValue("@Sort_Code", mopneyTransfer.Receiver_Sort_Code);
cmd2.Parameters.AddWithValue("@Transcation_Type", mopneyTransfer.Transcation_Type1);
cmd2.Parameters.AddWithValue("@Date", mopneyTransfer.Date1);
//Open the connection and execute the query
con.Open();
cmd2.ExecuteNonQuery();
cmd3.ExecuteNonQuery();
return true;
//con.Close();
}
}
else
trans.Rollback();
return false;
}
return false;
}
Here is script code.
/// <reference path="../angular.min.js" />
var app = angular.module("WebClientModule", [])
.controller('Web_Client_Controller', ["$scope", 'myService', function ($scope, myService) {
$scope.OperType = 1;
//1 Mean New Entry
//To Clear all input controls.
function ClearModels() {
$scope.OperType = 1;
$scope.Sender_Account_No = "";
$scope.Sender_Name = "";
$scope.Sender_Sort_Code = "";
$scope.Amount = "";
$scope.Transcation_Type = "";
$scope.Date = "";
$scope.Receiver_Account_No = "";
$scope.Receiver_Name = "";
$scope.Receiver_Sort_Code = "";
$scope.Amount1 = "";
$scope.Transcation_Type1 = "";
$scope.Date1 = "";
}
$scope.transfer = function () {
var User = {
Sender_Account_No: $scope.Sender_Account_No,
Serder_Name: $scope.Serder_Name,
Sender_Sort_Code: $scope.Sender_Sort_Code,
Amount: $scope.Amount,
Transcation_Type: $scope.Transcation_Type,
Date:$scope.Date ,
Receiver_Account_No: $scope.Receiver_Account_No ,
Receiver_Name: $scope.Receiver_Name,
Receiver_Sort_Code: $scope.Receiver_Sort_Code ,
Amount1: $scope.Amount1,
Transcation_Type1: $scope.Transcation_Type1,
Date1:$scope.Date1
};
if ($scope.OperType === 1) {
var promisePost = myService.post(User);
promisePost.then(function (pl) {
$scope.Id = pl.data.Id;
$scope.msg = "Operation is successful";
}, function (err) {
$scope.msg = "Operation is failed !";
console.log("Some error Occured" + err);
});
} else {
}
};
}]);
app.service("myService", function ($http) {
//Create new record
this.post = function (User) {
var request = $http({
method: "post",
url: "http://localhost:52098/HalifaxIISService.svc/MoneyTranfer",
data: JSON.stringify(User)
});
return request;
}
})
Here is the HTML Code ..
@{
Layout = null;
}
<html data-ng-app="WebClientModule">
<head title="ASAS">
<title></title>
<script src="~/Scripts/angular.min.js"></script>
<script src="~/RegistrationScript/MoneyTransfer.js"></script>
</head>
<body>
<table id="tblContainer" data-ng-controller="Web_Client_Controller">
<tr>
<td>
<div style="color: red;"></div>
<table style="border: solid 4px Red; padding: 2px;">
<tr>
<td></td>
<td>
<span>Sender Account No</span>
</td>
<td>
<input type="text" id="sender_account_no" data-ng-model="Sender_Account_No" required="" />
</td>
</tr>
<tr>
<td></td>
<td>
<span>Serder_Name</span>
</td>
<td>
<input type="text" id="serder_name" required data-ng-model="Serder_Name" require="" />
</td>
</tr>
<tr>
<td></td>
<td>
<span>Sender_Sort_Code</span>
</td>
<td>
<input type="text" id="sender_sort_code" required data-ng-model="Sender_Sort_Code" require="" />
</td>
</tr>
<tr>
<td></td>
<td>
<span>Amount_to_Send</span>
</td>
<td>
<input type="text" id="amount_to_send" required data-ng-model="Amount" require="" />
</td>
</tr>
<tr>
<td></td>
<td>
<span>Transcation_Type</span>
</td>
<td>
<input type="text" id="transcation_type" required data-ng-model="Transcation_Type" require="" />
</td>
</tr>
<tr>
<td></td>
<td>
<span>Date</span>
</td>
<td>
<input type="text" id="date" required data-ng-model="Date" require="" />
</td>
</tr>
<tr>
<td></td>
<td>
<span>Reciver Account No</span>
</td>
<td>
<input type="text" id="render_account_no" data-ng-model="Reciver_Account_No" required="" />
</td>
</tr>
<tr>
<td></td>
<td>
<span>Reciver_Name</span>
</td>
<td>
<input type="text" id="reciver_name" required data-ng-model="Reciver_Name" require="" />
</td>
</tr>
<tr>
<td></td>
<td>
<span>Reciver_Sort_Code</span>
</td>
<td>
<input type="text" id="reciver_sort_code" required data-ng-model="Reciver_Sort_Code" require="" />
</td>
</tr>
<tr>
<td></td>
<td>
<span>Amount_to_Recived</span>
</td>
<td>
<input type="text" id="amount_to_recive" required data-ng-model="Amount1" require="" />
</td>
</tr>
<tr>
<td></td>
<td>
<span>Transcation_Type</span>
</td>
<td>
<input type="text" id="transcation_type1" required data-ng-model="Transcation_Type1" require="" />
</td>
</tr>
<tr>
<td></td>
<td>
<span>Date</span>
</td>
<td>
<input type="text" id="date1" required data-ng-model="Date1" require="" />
</td>
</tr>
<tr>
<td></td>
<td></td>
<td>
<input type="button" id="Createuser" value="Submit" data-ng-click="transfer()" />
<input type="button" id="Clear" value="Clear" data-ng-click="Clear()" />
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
<script src="~/RegistrationScript/MoneyTransfer.js"></script>
Here is Values on Request PlayLoad on View Parsed..
{"Sender_Account_No":"3","Serder_Name":"rasel khan","Sender_Sort_Code":"11-00-11","Amount":"123900","Transcation_Type":"Withdraw","Date":"11/22/11","Amount1":"123900","Transcation_Type1":"deposit","Date1":"11/22/12"}
Here is the screen shot when I run the application..
Any feedback or suggestion would be highley appricited . Thanks
Source: AngularJS
from Angular Questions https://angularquestions.com/2017/10/13/angular-js-application-failed-to-invock-wcf-rest-service-post-method/
via @lzomedia #developer #freelance #web #lzomedia.com
No comments:
Post a Comment