mercredi 6 mai 2015

Having an Issue In Using Angular Js with DNN7

I have created a user defined controller and than add a module in dnn7(Having resource of my user defined controller) and created a page in dnn7 and than access my newly created Module on it.But It shows me my HTML Page only means Submit button is not working and in Grid as well it's just showing me the name of fields.

For Ex:-

function EmpCtrl($scope) {
    $scope.getEmployee = function () {
        $.ajax({
            type: "POST",
            url: "http://ift.tt/1dMBcXF",
            data: "{}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg) {
                 $scope.Emp = msg.d;
            }
        });
    };

 $scope.save = function () {
        $.ajax({
            type: "POST",
            url: "http://ift.tt/1dMBfTa",
            data: "{'empID':'" + $("#txtEmpID").val() + "','firstName':'" + $("#txtEmpFirstName").val() + "','lastName':'" + $("#txtEmpLastName").val() + "','address':'" + $("#txtEmpAddress").val() + "','city':'" + $("#txtCity").val() + "','pincode':'" + $("#txtPinCode").val() + "','state':'" + $("#txtState").val() + "','country':'" + $("#txtCountry").val() + "'}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg) { 
                alert(msg.d);
            },
            error: function (msg) {
                alert(msg.d);
            }
        });
    };

<body>
    <form id="form1" ng-app="MyApp" ng-controller="EmpCtrl" ng-submit="save() ">
        <div style="text-align: center;">
            <img alt="" src="banner.jpg" />
        </div>
        <br />
        <div style="font-family: Verdana; font-size: 12px; margin-left: 450px;">
            <table>
                <tr>
                    <td style="text-align: right;"></td>
                    <td>
                        <input type="hidden" id="txtEmpID" value="0" ng-model="EmpID" />
                    </td>
                </tr>
                <tr>
                    <td style="text-align: right;">First Name :
                    </td>
                    <td>
                        <input type="text" id="txtEmpFirstName" ng-model="EmpFirstName" autocomplete="off" />
                    </td>
                </tr>
                <tr>
                    <td style="text-align: right;">Last Name :
                    </td>
                    <td>
                        <input type="text" id="txtEmpLastName" ng-model="EmpLastName" autocomplete="off" />
                    </td>
                </tr>

                <tr>
                    <td style="text-align: right;">Address :
                    </td>
                    <td>
                        <textarea id="txtEmpAddress" cols="20" rows="2" ng-model="EmpAddress"></textarea>
                    </td>
                </tr>
                <tr>
                    <td style="text-align: right;">City :
                    </td>
                    <td>
                        <input type="text" id="txtCity" ng-model="EmpCity" autocomplete="off" />
                    </td>
                </tr>
                <tr>
                    <td style="text-align: right;">Pin Code :
                    </td>
                    <td>
                        <input type="text" placeholder="Enter Digits Only" id="txtPinCode" ng-model="EmpPincode" autocomplete="off" onkeypress="return isNumber(event)" />
                    </td>
                </tr>
                <tr>
                    <td style="text-align: right;">State :
                    </td>

                    <td>
                        <input type="text" id="txtState" ng-model="EmpState" autocomplete="off" />
                    </td>
                </tr>
                <tr>
                    <td style="text-align: right;">Country :
                    </td>
                    <td>
                        <input type="text" id="txtCountry" ng-model="country" autocomplete="off" />
                    </td>
                </tr>
                <tr>
                    <td colspan="2" style="text-align: center;">
                        <input type="submit" id="btnSubmit" value="Submit" />
                    </td>


                </tr>


            </table>


        </div>
        <hr />
    </form>
    <div class="container" ng-controller="EmpCtrl" data-ng-init="getEmployee()">
        <div>
            <input type="button" id="btnFetch" value="Fetch" ng-click="getEmployee()" />
        </div>
        <table border="1" style="text-align: center; margin-left: 410px;">
            <tr>
                <td>ID
                </td>
                <td>First Name
                </td>
                <td>Last Name
                </td>
                <td>Address
                </td>
                <td>City
                </td>
                <td>Pincode
                </td>
                <td>State
                </td>
                <td>Country
                </td>
                <td>Use 
                     Action
                </td>

            </tr>
            <tr ng-repeat="record in Emp">
                <td>{{record.ID}}
                </td>
                <td>{{record.FirstName}}
                </td>
                <td>{{record.LastName}}
                </td>
                <td>{{record.Address}}
                </td>
                <td>{{record.City}}
                </td>
                <td>{{record.Pincode}}
                </td>
                <td>{{record.State}}
                </td>
                <td>{{record.Country}}
                </td>
                <td><a ng-click="editEmployee(record.ID)">Edit</a></td>
                <td><a ng-click="deleteEmployee(record.ID)">Delete</a></td>
            </tr>
        </table>
    </div>
</body>
</html>

 [WebMethod]
        [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
        public static string InsertEmployee(int empID, string firstName, string lastName, string address, string city, string pincode, string state, string country)
        {
            string connection = @"Data Source=dbpath;Initial Catalog=AngularJS;User Id=sa;Password=sa@123;";
            SqlConnection con = new SqlConnection(connection);
            SqlCommand cmd;
            string msg = "";
            try
            {
                con.Open();
                cmd = con.CreateCommand();
                if (empID == 0)
                {
                    cmd.CommandText = "INSERT INTO Emp_Details(FirstName,LastName,Address,City,Pincode,State,Country) VALUES(@FirstName,@LastName,@Address,@City,@Pincode,@State,@Country)";
                    msg = "Record Inserted Successfully";
                }
                else
                {
                    cmd.CommandText = "update  Emp_Details set FirstName =@FirstName,LastName=@LastName,Address=@Address,City=@City,Pincode=@Pincode,State=@State,Country=@Country where ID=" + empID;
                    msg = "Record updated Successfully";
                }
                cmd.Parameters.AddWithValue("@FirstName", firstName);
                cmd.Parameters.AddWithValue("@LastName", lastName);
                cmd.Parameters.AddWithValue("@Address", address);
                cmd.Parameters.AddWithValue("@City", city);
                cmd.Parameters.AddWithValue("@Pincode", Convert.ToInt32(pincode));
                cmd.Parameters.AddWithValue("@State", state);
                cmd.Parameters.AddWithValue("@Country", country);
                cmd.ExecuteNonQuery();
                return msg;
            }
            catch (Exception)
            {

                throw;
            }
            finally
            {
                if (con.State == ConnectionState.Open)
                {
                    con.Close();
                }

            }
        }

<Cs Code>

DNN Output Image

As you can see in the above image it's not fetching any data it's just printing my field description.

Aucun commentaire:

Enregistrer un commentaire