发送列表控制器查看

Question

从控制器发送列表到视图的最佳方式是什么。 顺便说一句，我是 MVC 的新手。 我想发送我的 companyList（在后控制器处）查看。 如果你问我为什么要在视图中显示 companyList[0].Name 并且我想在我的 ajax 中的“成功”状态下执行此操作。

谢谢。

这是我的 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>

Answer 1

只需使用 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 中，您可以在成功回调中访问 c​​ompanyList。函数的 msg 参数是包含状态和数据属性的 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 中的模型绑定功能，并创建一个代表页面视图模型的类，并使用该类代替在 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    
},