Ajax.Beginform - 仅发送已选中复选框的值?

时间:2014-05-25 23:30:20

标签: jquery ajax asp.net-mvc ajax.beginform

我有一个包含文本框(称为名称)和一组复选框以及一组无线电的表单。我想发送文本框的值,这个数组只包含选中的复选框的值和检查的无线电的值。我知道我可以使用jquery ajax语法,但我想用Ajax.BeginForm来做。从我可以告诉Ajax选项OnBegin可能是关键,但我无法弄清楚如何在进入操作之前更改请求。

****编辑:****

我已根据Stephen的答案重新编写代码,但我仍然遇到问题,只是让它正确渲染。这是代码:

public class RecipeSearch
{
    public List<Recipe> Recipe { get; set; }
    public List<Meal> MealSettings { get; set; }
    public List<Ingredient> MainIngredient { get; set; }
}

public class Meal
{
    public int Id { get; set; }
    public bool Value { get; set; }
    public string DisplayName { get; set; }

}

    public ActionResult Search()
    {

        RecipeSearch recipe = new RecipeSearch();
        recipe = recipeSearchDetails(null, null);

        recipe.Recipe = dbContext.Recipes
            .OrderBy(r => r.name)
            .Where(r => r.name.Contains("") || string.IsNullOrEmpty(""))
            .ToList();

        RecipeSearch recipe = new RecipeSearch();
        recipe.MealSettings = new List<Meal>();
        var meals = dbContext.MealCategories
                    .OrderBy(r => r.name)
                    .ToList();

        var MainIngredient = dbContext.Maincategories
                    .OrderBy(r => r.name).ToList();

        foreach (var item in meals)
        {
            recipe.MealSettings.Add(new Meal { DisplayName = item.name, Value = true, Id = item.mealCategoryId });
        }



        recipe.Recipe = dbContext.Recipes
                        .OrderByDescending(r => r.MealCategory.name)
                        .Where(mc => mc.MealCategory.name == mealCategory || (mealCategory == null))
                        .Where(m => m.Ingredients.FirstOrDefault().SubCategory.name == mainIngredient || (mainIngredient == null)).ToList();

        return PartialView("_search", recipe);
    }

型号:

@model RecipeTrackerMVC.Models.Search.RecipeSearch


@for (int i = 0; i < Model.MealSettings.Count(); i++)
   {
      <li>
           @Html.CheckBoxFor(r => Model.MealSettings[i].Value)
           @Html.LabelFor(r => Model.MealSettings[i].Value, Model.MealSettings[i].DisplayName)
                                @Html.HiddenFor(r => Model.MealSettings[i].Id)
      </li>
   }

浏览器为每餐提供以下内容: enter image description here

这个名字应该变得如此草率吗?

除此之外,我做了一个AJAX调用,这是我得到的数据。所有项目都是未经检查的,除了id 12 - 但由于某种原因,一个有两个值,我不知道为什么。另外,我想这个样式(checkboxfor)只有被检查的项目应该在请求中发送?

name:s
allCategories:false
MealSettings[0].Value:false
MealSettings[0].Id:7
MealSettings[1].Value:false
MealSettings[1].Id:8
MealSettings[2].Value:false
MealSettings[2].Id:9
MealSettings[3].Value:false
MealSettings[3].Id:1
MealSettings[4].Value:false
MealSettings[4].Id:10
MealSettings[5].Value:false
MealSettings[5].Id:11
MealSettings[6].Value:false
MealSettings[6].Id:12
MealSettings[7].Value:true
MealSettings[7].Value:false
MealSettings[7].Id:4
MealSettings[8].Value:false
MealSettings[8].Id:3
MealSettings[9].Value:false
MealSettings[9].Id:17
MealSettings[10].Value:false
MealSettings[10].Id:2
allIngredients:all
allIngredients:false
startTime:
endTime:
prepTime:0
cookTime:0
standTime:0
X-Requested-With:XMLHttpRequest

当我用这种语法进行Ajax调用时,模型显示为null:

    public ActionResult Search(IEnumerable<RecipeSearch> model)

1 个答案:

答案 0 :(得分:1)

假设MealCategory是一个布尔值列表,使用@Html.CheckBoxFor将生成用于回发的html(类似于单选按钮)

@model yourModel
@using (Html.BeginForm()) {
  ....
  @for (int i = 0; i < Model.MealCategory.Count; i++) {
    @Html.CheckBoxFor(m => m[i])
    @Html.LabelFor(m => m[i])
  }
  ...
  <button type="submit">Submit</button>
}

修改:继续评论 我不完全确定你要做什么,但我建议创建一个视图模型来表示可能的选择,并在控制器中创建操作方法以选择如下选项:

public class MealSelection
{
  public int ID { get; set;} // to generate a hidden input for postback
  public bool IsSelected { get; set;} // to generate a checkbox
  public string Name { get; set;} // for display in the view
}

[HttpGet]
public ActionResult Selections()
{  
  List<MealSelection> selections = new ..// Generate a list selections
  return View(selections)
}

[HtpPost]
public ActionResult Selections(IEnumerable<MealSelection> model)
{
  IEnumerable<MealSelection> selections = model.Where(m => m.IsSelected);
  // foreach MealSelection in selections, get the ID and do something with it
  return RedirectToAction(..to some view that displays the selections..);
}

查看

@model IEnumerable<MealSelection>

然后循环(上面修改)为ID创建隐藏输入,IsSelected复选框和Name标签。