dimanche 22 février 2015

How to send one model with several classes in Ajax to update a database


I have this issue that I'm sure more experienced folks probably know how to resolve.


I have a class called CustomerProject. Inside this class, there are two other classes containing respective properties for each. One is Customer; the other is Project.


See code.



using System;
using System.ComponentModel.DataAnnotations;
using System.Runtime.Serialization;

namespace YeagerTechDB.ViewModels.Customers
{
[Serializable, DataContract(IsReference = true)]
public class CustomerProjectDTO
{
public class Customer
{

[ScaffoldColumn(true)]
[Display(Name = "ID")]
[DataMember]
public short CustomerID { get; set; }

[Required]
[StringLength(256)]
[DataMember]
public string UserName { get; set; }

[Required]
[StringLength(50)]
[EmailAddress]
[DataMember]
public string Email { get; set; }

[StringLength(50)]
[DataMember]
public string Company { get; set; }

[StringLength(50)]
[DataMember]
public string FirstName { get; set; }

[StringLength(50)]
[DataMember]
public string LastName { get; set; }

[StringLength(50)]
[DataMember]
public string Address1 { get; set; }

[StringLength(50)]
[DataMember]
public string Address2 { get; set; }

[StringLength(50)]
[DataMember]
public string City { get; set; }

[StringLength(2)]
[DataMember]
public string State { get; set; }

[StringLength(10)]
[DataType(DataType.PostalCode)]
[RegularExpression(@"^\d{5}(-\d{4})?$", ErrorMessage = "Must match 99999 or 99999-9999 format")]
[DataMember]
public string Zip { get; set; }

[StringLength(12)]
[DataType(DataType.PhoneNumber)]
[RegularExpression(@"^\s*([\(]?)\[?\s*\d{3}\s*\]?[\)]?\s*[\-]?[\.]?\s*\d{3}\s*[\-]?[\.]?\s*\d{4}$", ErrorMessage = "Must match 999-999-9999 format")]
[DataMember]
public string HomePhone { get; set; }

[StringLength(12)]
[DataType(DataType.PhoneNumber)]
[RegularExpression(@"^\s*([\(]?)\[?\s*\d{3}\s*\]?[\)]?\s*[\-]?[\.]?\s*\d{3}\s*[\-]?[\.]?\s*\d{4}$", ErrorMessage = "Must match 999-999-9999 format")]
[DataMember]
public string CellPhone { get; set; }

[StringLength(100)]
[DataType(DataType.Url)]
[DataMember]
public string Website { get; set; }

[StringLength(50)]
[DataType(DataType.Url)]
[DataMember]
public string IMAddress { get; set; }

[DataType(DataType.DateTime)]
[Display(Name = "Created")]
[DataMember]
public DateTime CreatedDate { get; set; }

[Display(Name = "Updated")]
[DataType(DataType.DateTime)]
[DataMember]
public DateTime? UpdatedDate { get; set; }
}

public class Project
{

[ScaffoldColumn(false)]
[Editable(false)]
[Display(Name = "Proj ID")]
[DataMember]
public short ProjectID { get; set; }

[ScaffoldColumn(false)]
[Editable(true)]
[Display(Name = "Cust ID")]
[DataMember]
public short CustomerID { get; set; }

[Required(ErrorMessage = "Required!")]
[StringLength(30)]
[Display(Name = "Project Name")]
[DataMember]
public string Name { get; set; }

[Required]
[DataType(DataType.MultilineText)]
[DataMember]
public string Description { get; set; }

[ScaffoldColumn(true)]
[Display(Name = "Category")]
[DataMember]
public short CategoryID { get; set; }

[ScaffoldColumn(true)]
[Display(Name = "Priority")]
[DataMember]
public short PriorityID { get; set; }

[ScaffoldColumn(true)]
[Display(Name = "Status")]
[DataMember]
public short StatusID { get; set; }

[DataType(DataType.Currency)]
[DataMember]
public decimal? Quote { get; set; }

[DataType(DataType.MultilineText)]
[DataMember]
public string Notes { get; set; }

[DataType(DataType.DateTime)]
[Display(Name = "Created")]
[DataMember]
public DateTime CreatedDate { get; set; }

[DataType(DataType.DateTime)]
[Display(Name = "Updated")]
[DataMember]
public DateTime? UpdatedDate { get; set; }
}
}
}


If I'm using Code Frist EF 6.1 approach and using the HTML.BeginForm methodology inside an MVC Controller, I have no problem sending the data into a Create method and saving the data for both classes with the above code.


If I'm using an Ajax approach in JavaScript, I had to combine the properties of the two child classes into one class with unique property names. I also had stringify all of the properties while sending over the data. It updated just fine, but I was wondering if there is a similar way I can do it with the Ajax Javascript approach with using the child classes (as in the first approach) ( see one class and ajax code below).


See code below.



using System;
using System.ComponentModel.DataAnnotations;
using System.Runtime.Serialization;

namespace YeagerTechDB.ViewModels.Customers
{
[Serializable, DataContract(IsReference = true)]
public class CustomerProjectDTO
{
//Customer

[ScaffoldColumn(true)]
[Display(Name = "ID")]
[DataMember]
public short customer_CustomerID { get; set; }

[Required]
[StringLength(256)]
[DataMember]
public string customer_UserName { get; set; }

[Required]
[StringLength(50)]
[EmailAddress]
[DataMember]
public string customer_Email { get; set; }

[StringLength(50)]
[DataMember]
public string customer_Company { get; set; }

[StringLength(50)]
[DataMember]
public string customer_FirstName { get; set; }

[StringLength(50)]
[DataMember]
public string customer_LastName { get; set; }

[StringLength(50)]
[DataMember]
public string customer_Address1 { get; set; }

[StringLength(50)]
[DataMember]
public string customer_Address2 { get; set; }

[StringLength(50)]
[DataMember]
public string customer_City { get; set; }

[StringLength(2)]
[DataMember]
public string customer_State { get; set; }

[StringLength(10)]
[DataType(DataType.PostalCode)]
[RegularExpression(@"^\d{5}(-\d{4})?$", ErrorMessage = "Must match 99999 or 99999-9999 format")]
[DataMember]
public string customer_Zip { get; set; }

[StringLength(12)]
[DataType(DataType.PhoneNumber)]
[RegularExpression(@"^\s*([\(]?)\[?\s*\d{3}\s*\]?[\)]?\s*[\-]?[\.]?\s*\d{3}\s*[\-]?[\.]?\s*\d{4}$", ErrorMessage = "Must match 999-999-9999 format")]
[DataMember]
public string customer_HomePhone { get; set; }

[StringLength(12)]
[DataType(DataType.PhoneNumber)]
[RegularExpression(@"^\s*([\(]?)\[?\s*\d{3}\s*\]?[\)]?\s*[\-]?[\.]?\s*\d{3}\s*[\-]?[\.]?\s*\d{4}$", ErrorMessage = "Must match 999-999-9999 format")]
[DataMember]
public string customer_CellPhone { get; set; }

[StringLength(100)]
[DataType(DataType.Url)]
[DataMember]
public string customer_Website { get; set; }

[StringLength(50)]
[DataType(DataType.Url)]
[DataMember]
public string customer_IMAddress { get; set; }

[DataType(DataType.DateTime)]
[Display(Name = "Created")]
[DataMember]
public DateTime customer_CreatedDate { get; set; }

[Display(Name = "Updated")]
[DataType(DataType.DateTime)]
[DataMember]
public DateTime? customer_UpdatedDate { get; set; }


//Project

[ScaffoldColumn(false)]
[Editable(false)]
[Display(Name = "Proj ID")]
[DataMember]
public short project_ProjectID { get; set; }

[ScaffoldColumn(false)]
[Editable(true)]
[Display(Name = "Cust ID")]
[DataMember]
public short project_CustomerID { get; set; }

[Required(ErrorMessage = "Required!")]
[StringLength(30)]
[Display(Name = "Project Name")]
[DataMember]
public string project_Name { get; set; }

[Required]
[DataType(DataType.MultilineText)]
[DataMember]
public string project_Description { get; set; }

[ScaffoldColumn(true)]
[Display(Name = "Category")]
[DataMember]
public short project_CategoryID { get; set; }

[ScaffoldColumn(true)]
[Display(Name = "Priority")]
[DataMember]
public short project_PriorityID { get; set; }

[ScaffoldColumn(true)]
[Display(Name = "Status")]
[DataMember]
public short project_StatusID { get; set; }

[DataType(DataType.Currency)]
[DataMember]
public decimal? project_Quote { get; set; }

[DataType(DataType.MultilineText)]
[DataMember]
public string project_Notes { get; set; }

[DataType(DataType.DateTime)]
[Display(Name = "Created")]
[DataMember]
public DateTime project_CreatedDate { get; set; }

[DataType(DataType.DateTime)]
[Display(Name = "Updated")]
[DataMember]
public DateTime? project_UpdatedDate { get; set; }

}
}

function createCustomerProject()
{
var currdate = new Date();
var currdate = (currdate.getMonth() + 1) + '/' + currdate.getDate() + '/' + currdate.getFullYear() + ' ' + currdate.getHours() + ':' + currdate.getMinutes() + ':' + currdate.getSeconds();

var customerProject_Input = {
customer_UserName: $('#customer_UserName').val(),
customer_Email: $('#customer_Email').val(),
customer_Company: $('#customer_Company').val(),
customer_FirstName: $('#customer_FirstName').val(),
customer_LastName: $('#customer_LastName').val(),
customer_Address1: $('#customer_Address1').val(),
customer_Address2: $('#customer_Address2').val(),
customer_City: $('#customer_City').val(),
customer_State: $('#customer_State').val(),
customer_Zip: $('#customer_Zip').val(),
customer_HomePhone: $('#customer_HomePhone').val(),
customer_CellPhone: $('#customer_CellPhone').val(),
customer_Website: $('#customer_Website').val(),
customer_IMAddress: $('#customer_IMAddress').val(),
customer_CreatedDate: currdate,
customer_UpdatedDate: null,
project_Name: $('#project_Name').val(),
project_Description: $('#project_Description').val(),
project_CategoryID: $('#project_CategoryID').val(),
project_PriorityID: $('#project_PriorityID').val(),
project_StatusID: $('#project_StatusID').val(),
project_Quote: $('#project_Quote').val(),
project_Notes: $('#project_Notes').val(),
project_CreatedDate: currdate,
project_UpdatedDate: null
};

var Url = $("#customerprojectCreateUrl").val();

$.ajax({
url: Url,
//data: AddAntiCSRFToken(JSON.stringify(customerProject_Input)),
data: JSON.stringify(customerProject_Input),
dataType: "html",
type: "POST",
contentType: "application/json; charset=utf-8",
async: true,




Aucun commentaire:

Enregistrer un commentaire