发送列表控制器查看

时间:2015-12-19 16:57:08

标签: c# ajax model-view-controller view controller

从控制器发送List以查看的最佳方式是什么。 顺便说一句,我是MVC的新手。 我想发送我的companyList(在post controller)来查看。 如果你问我为什么要在视图中显示companyList [0] .Name,我想在我的ajax中的“成功”状态下执行此操作。

感谢。

这是我的控制器代码For Get

public ActionResult Index()
{
    KargoDB database = new KargoDB();
    var query = database.States.Select(s => new SelectListItem
    {
        Value = s.State_id.ToString(),
        Text = s.Description,
        Selected = s.State_id.Equals(1)

    });

    var model = new State()
    {
        lstStates = query.AsEnumerable()
    };

    return View(model);
}

这是我的控制器代码发布

[HttpPost]
public ActionResult Index(string senderAddress, string senderState, string receiverAddress, string receiverState,
    string receiverName, string receiverPhoneNumber, string requestDate, string cargoHeight, string cargoLenght,
    string cargoQuantity, string paymentType, string cargoWidth, string cargoWeight)
{

    RouteDetailRepository rdr = new RouteDetailRepository();
    int routeId = rdr.getRouteId(senderState, receiverState);
    List<RoutesDetail> companyList = rdr.getRouteDetail(routeId);
    if (companyList == null)
    {
        return JavaScript("Seçilen Güzergaha Sistemde Kayıtlı Olan Hiç Bir Kargo Firması Servis Yapmamaktadır.");
    }
    return Json(new { status = "success" });
}

你可以看到我正在为我的ajax返回成功。

这是我的观看代码的一部分

@model denemee.Models.State
 <script type="text/javascript">    
        $(document).on("click", "#btnSearch", function () {

            var senderAddress = document.getElementById("senderAddress").value;
            var senderState = document.getElementById("senderState").value;
            var receiverAddress = document.getElementById("receiverAddress").value;
            var receiverState = document.getElementById("receiverState").value;
            var receiverName = document.getElementById("receiverName").value;
            var receiverPhoneNumber = document.getElementById("receiverPhoneNumber").value;
            var requestDate = document.getElementById("datepicker").value;
            var cargoHeight = document.getElementById("cargoHeight").value;
            var cargoLenght = document.getElementById("cargoLength").value;
            var cargoQuantity = document.getElementById("cargoQuantity").value;
            var paymentType = document.getElementById("paymentType").value;
            var cargoWidth = document.getElementById("cargoWidth").value;
            var cargoWeight = document.getElementById("cargoWeight").value;


            if (senderAddress === "" || senderState === "" || receiverAddress === "" || receiverState === "" ||
                receiverName === "" || receiverPhoneNumber === "" || requestDate === "" || cargoHeight === "" ||
                cargoLenght === "" || cargoQuantity === "" || paymentType === "" || cargoWidth === "" ||
                cargoWeight === "") {
                alert("Lütfen Tüm Alanları Doldurunuz.")
            } else {    
                $.ajax({
                    type: 'POST',
                    url: '/Main/Index',
                    dataType: 'json',
                    data: {
                        'senderAddress' :  senderAddress,
                        'senderState': senderState,
                        'receiverAddress' :  receiverAddress,
                        'receiverState' :  receiverState,
                        'receiverName' :  receiverName,
                        'receiverPhoneNumber' :receiverPhoneNumber,
                        'requestDate': requestDate,
                        'cargoHeight': cargoHeight,
                        'cargoLenght' : cargoLenght,
                        'cargoQuantity' : cargoQuantity,
                        'paymentType' : paymentType,
                        'cargoWidth' : cargoWidth,
                        'cargoWeight' : cargoWeight,

                    },
                    success: function (msg) {

                    },
                    error: function (msg) {
                        alert(msg.responseText);
                    }        
                });
            }
        });    
    </script>

1 个答案:

答案 0 :(得分:0)

只需使用companyList的值在匿名对象中创建一个属性,如下所示:

[HttpPost]
public ActionResult Index(string senderAddress, string senderState, string receiverAddress, string receiverState,
    string receiverName, string receiverPhoneNumber, string requestDate, string cargoHeight, string cargoLenght,
    string cargoQuantity, string paymentType, string cargoWidth, string cargoWeight)
{

    RouteDetailRepository rdr = new RouteDetailRepository();
    int routeId = rdr.getRouteId(senderState, receiverState);
    List<RoutesDetail> companyList = rdr.getRouteDetail(routeId);
    if (companyList == null)
    {
        return JavaScript("Seçilen Güzergaha Sistemde Kayıtlı Olan Hiç Bir Kargo Firması Servis Yapmamaktadır.");
    }
    return Json(new { status = "success", data = companyList });
}

然后在您的javascript中,您可以在成功回调中访问companyList。函数的msg参数是包含status和data属性的JSON。

$.ajax({
    type: 'POST',
    url: '/Main/Index',
    dataType: 'json',
    data: {
        'senderAddress' :  senderAddress,
        'senderState': senderState,
        'receiverAddress' :  receiverAddress,
        'receiverState' :  receiverState,
        'receiverName' :  receiverName,
        'receiverPhoneNumber' :receiverPhoneNumber,
        'requestDate': requestDate,
        'cargoHeight': cargoHeight,
        'cargoLenght' : cargoLenght,
        'cargoQuantity' : cargoQuantity,
        'paymentType' : paymentType,
        'cargoWidth' : cargoWidth,
        'cargoWeight' : cargoWeight,

    },
    success: function (msg) {
        if(msg.status === "success") {
            //msg.data is your companyList
            //do whataver you need
        }
    },
    error: function (msg) {
        alert(msg.responseText);
    }        
});

你也可以使用jQuery从输入中获取值,而不是使用document.getElementById

var senderAddress = $("senderAddress").val();
var senderState = $("senderState").val();
var receiverAddress = $("receiverAddress").val();
var receiverState = $("receiverState").val();
var receiverName = $("receiverName").val();
var receiverPhoneNumber = $("receiverPhoneNumber").val();
var requestDate = $("datepicker").val();
var cargoHeight = $("cargoHeight").val();
var cargoLenght = $("cargoLength").val();
var cargoQuantity = $("cargoQuantity").val();
var paymentType = $("paymentType").val();
var cargoWidth = $("cargoWidth").val();
var cargoWeight = $("cargoWeight").val();

此外,您可以使用ASP.NET MVC中的模型绑定功能,并创建表示页面视图模型的classe,并使用它代替接收Index操作中的许多参数,如下所示:

public class ViewModel
{
    public string SenderAddress { get; set; }
    public string SenderState { get; set; }
    public string ReceiverAddress { get; set; }
    public string ReceiverState { get; set; }
    public string ReceiverName { get; set; }
    public string ReceiverPhoneNumber { get; set; }
    public string RequestDate { get; set; }
    public string CargoHeight { get; set; }
    public string CargoLenght { get; set; }
    public string CargoQuantity { get; set; }
    public string PaymentType { get; set; }
    public string CargoWidth { get; set; }
    public string CargoWeight { get; set; }
}

[HttpPost]
public ActionResult Index(ViewModel viewModel)
{
    RouteDetailRepository rdr = new RouteDetailRepository();
    int routeId = rdr.getRouteId(viewModel.SenderState, viewModel.ReceiverState);
    List<RoutesDetail> companyList = rdr.getRouteDetail(routeId);
    if (companyList == null)
    {
        return JavaScript("Seçilen Güzergaha Sistemde Kayıtlı Olan Hiç Bir Kargo Firması Servis Yapmamaktadır.");
    }
    return Json(new { status = "success" });
}

如果你这样做,你必须更改javascript代码中的字段名称,使其大写,如下:

data: {
    'SenderAddress' :  senderAddress,
    'SenderState': senderState,
    'ReceiverAddress' :  receiverAddress,
    'ReceiverState' :  receiverState,
    'ReceiverName' :  receiverName,
    'ReceiverPhoneNumber' :receiverPhoneNumber,
    'RequestDate': requestDate,
    'CargoHeight': cargoHeight,
    'CargoLenght' : cargoLenght,
    'CargoQuantity' : cargoQuantity,
    'PaymentType' : paymentType,
    'CargoWidth' : cargoWidth,
    'CargoWeight' : cargoWeight    
},