Question

我试图将我的javascript上的下拉列表的值发送到同一视图中的变量，purpouse是我想使用所选选项的值在另一个下拉选项中生成if语句而我不知道这样做的其他任何方式

这是我的JavaScript

＆＃13;

$('#sel0').on('change', function () {
                       dataTable.columns('.fechas').search(this.value).draw();
                       date = $(this).val();
                      
                   });

＆＃13;

这是我的观点中的变量：

@{
var Date = "";
}

这是我的下拉列表，我想采用所选的值：

＆＃13;

  <select  id="sel0">
     <option value="">Todos</option>

          @foreach (var item in Model.Select(l => l.Fecha).Distinct())
               {
               <option value="@lines">@lines</option>
          
              }
     </select>

＆＃13;

我希望能够根据我从下拉列表选择值中获取的日期输入我的列表的总和值，例如：我的下拉列表中的用户图片1日期我应该能够该值并在我的列表的foreach语句中进行求和，并使用如下结果创建输入：

@foreach (var item in Model.Where(x => x.Date == this.Date)//date is the value i took from the user select option
            .Select(x =>
                {
                Rid = x.Rid,
               Total = x.Total
                 })
                 .GroupBy(l => l.Rid) //and then grouping
                  .Select(z => new
                  {
                  Turno = z.Key,
Total = Decimal.Round(z.Sum(l => l.Total), 0)
                  }))
                  {
                  <input value="@item)" />
                   }

任何帮助将不胜感激我不知道其他任何方式这样做

Answer 1

在浏览器中呈现视图后执行服务器代码的方式是：

表单发布，制作计算，重新渲染视图
调用Ajax调用action方法，将所选日期作为数据传递，在action方法中处理逻辑并返回结果。成功时，在收到回复的情况下绘制您的输入（或填写它的值）。

查找您需要的选项示例。

Answer 2

剃刀视图中的C＃代码在服务器上执行并生成标记，并将返回浏览器。关于select元素更改事件的客户端js代码稍后在客户端发生。您选择的选项中的值不能用于再次执行剃刀中的某些代码。

您有2个选项。

使用所选选项的查询字符串值重新加载页面

当用户选择日期时，重新加载页面并将所选项目作为查询字符串传递。这意味着您需要更新当前的GET操作方法以接受此参数值，然后您将使用此值来执行过滤。

public ActionResult Index(DateTime? date)
{
   YourViewModel vm = new ViewModel();
   if(date!=null)
   {
     //Do your filtering based on the date.Value.
   }
   return View(vm);
}

当用户更改下拉列表时，请使用选择选项值重新加载页面;

$('#sel0').on('change', function () {
   window.location.href="@Url.Action("Index","Home")?date="+$(this).val();
});

<强>的Ajax

您可以对执行过滤器的服务器进行ajax调用，然后返回部分视图并将其注入DOM

$('#sel0').on('change', function () {
   $("#InputContainer").load("@Url.Action("GetDynamicInputs","Home")?date="+$(this).val());
});

现在请确保在您的主页面中有一个容器div（我们将加载动态输入数量），ID为InputContainer

并有一个动作方法接受日期并根据传递的日期值使用过滤器返回部分视图

public ActionResult GetDynamicInputs(DateTime date)
{
  //use the date to determine the markup you want return from your partial view
  return PartialView();
}

将选项值发送到视图上的全局变量

2 个答案: