title: Ajax.Beginform - send only the values from checkboxes that are checked?
body: <p>I have a form that has a textbox (called name) and a set of checkboxes and a set of radios. I want to send the value of the textbox, an array containing only the value of the checkboxes that are checked and the value of the radio checked. I know that I could use the jquery ajax syntax for this, but I want to do it with Ajax.BeginForm. From what I can tell the Ajax option OnBegin might be the key to this, but I cannot figure out how to alter the request before it goes to the action. </p>
  
  <p>****EDIT:****</p>
  
  <p>I've reworked the code based on Stephen's answer, but I am still running into problems with just getting it to render properly. Here's the code:</p>
  
  <pre><code>public class RecipeSearch
  {
      public List&lt;Recipe&gt; Recipe { get; set; }
      public List&lt;Meal&gt; MealSettings { get; set; }
      public List&lt;Ingredient&gt; 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 =&gt; r.name)
              .Where(r =&gt; r.name.Contains("") || string.IsNullOrEmpty(""))
              .ToList();
  
          RecipeSearch recipe = new RecipeSearch();
          recipe.MealSettings = new List&lt;Meal&gt;();
          var meals = dbContext.MealCategories
                      .OrderBy(r =&gt; r.name)
                      .ToList();
  
          var MainIngredient = dbContext.Maincategories
                      .OrderBy(r =&gt; 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 =&gt; r.MealCategory.name)
                          .Where(mc =&gt; mc.MealCategory.name == mealCategory || (mealCategory == null))
                          .Where(m =&gt; m.Ingredients.FirstOrDefault().SubCategory.name == mainIngredient || (mainIngredient == null)).ToList();
  
          return PartialView("_search", recipe);
      }
  </code></pre>
  
  <p><strong>Model:</strong></p>
  
  <pre><code>@model RecipeTrackerMVC.Models.Search.RecipeSearch
  
  
  @for (int i = 0; i &lt; Model.MealSettings.Count(); i++)
     {
        &lt;li&gt;
             @Html.CheckBoxFor(r =&gt; Model.MealSettings[i].Value)
             @Html.LabelFor(r =&gt; Model.MealSettings[i].Value, Model.MealSettings[i].DisplayName)
                                  @Html.HiddenFor(r =&gt; Model.MealSettings[i].Id)
        &lt;/li&gt;
     }
  </code></pre>
  
  <p>The browser is rendering the following for each meal:
  <img src="https://i.stack.imgur.com/dBvQo.png" alt="enter image description here"></p>
  
  <p>Is the name supposed to render so sloppy?</p>
  
  <p>In addition to that, I made an AJAX call and this is the data that I get. All items were unchecked except for id 12 - but for some reason that one has two values and I'm not sure why. Also, I thought with this style (checkboxfor) only items that were checked were supposed to be sent in the request?</p>
  
  <pre><code>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
  </code></pre>
  
  <p>And when I make my Ajax call with this syntax, the model shows as null:</p>
  
  <pre><code>    public ActionResult Search(IEnumerable&lt;RecipeSearch&gt; model)
  </code></pre>