Ajax.BeginForm() with checkbox syntax error

问题

I have an Ajax.BeginForm() in a partial view that contains a CheckBox for a bool value. The model is as follows;

public class ViewBusinessAdd
{
    [Required(ErrorMessage="Name must be supplied")]
    [Display(Name = "Business Name")]
    public string Name { get; set; }

    [Required(ErrorMessage = "Contact must be supplied")]
    [Display(Name = "Business Contact")]
    public string Contact { get; set; }

    [Display(Name = "Phone Number")]
    public string Number { get; set; }

    public string Postcode { get; set; }

    public Dictionary<string, string> States  { get; set; }

    public string AddressRegion { get; set; }

    public bool IsFacebookPost { get; set; }

    public List<RecommendationViewAttribute> Attributes { get; set; }
}

The CheckBox is rendered using the Html helpers;

<div class="control-group">
   <label class="control-label">
      @Html.LabelFor(m => m.IsFacebookPost, "Post recommendation")
      <img src="~/Content/images/f_logo.png" alt="Facebook" />
   </label>
   <div class="controls">
      @Html.CheckBoxFor(m => m.IsFacebookPost)
   </div>
</div>

This produces the following HTML when rendered;

<input data-val="true" data-val-required="The IsFacebookPost field is required." id="IsFacebookPost" name="IsFacebookPost" type="checkbox" value="true" /><input name="IsFacebookPost" type="hidden" value="false" />

When submitting the form with, it produces this error in Chrome;

Uncaught SyntaxError: Unexpected token u

If I remove the CheckBox the form submits without any error. If I convert this to a non-Ajax form, it also submits but that's not going to work with the page design unfortunately.

I'm absolutely stumped on this - I even changed this to a RadioButton and the same behavior exists. Does anyone have any ideas?

Edit: Forgot to add it's a Javascript error.

Edit: The error is coming from jQuery library on the return below;

parseJSON: function( data ) { // Attempt to parse using the native JSON parser first
  if ( window.JSON && window.JSON.parse ) {
      return window.JSON.parse( data );
  }

But this only happens if I use the Razor HTML helpers to generate the checkboxes.

回答1:

I got bit by this and burned about 6 hours trying to figure out what the issue was. According to the Jquery developers this is intended behavior in 1.9.1. If you use the jQuery Migrate 1.1.1 plugin everything should work, other than the console warnings which I think can be turned off.

http://bugs.jquery.com/ticket/13412

See the bug report, which isn't actually a bug :)

回答2:

Well it seems there was a bug introduced with jQuery 1.9.1. I've downgraded to 1.8.3 and the Razor helpers for the Checkboxes now work correctly. Steps to downgrade if anyone is interested;

Uninstall-Package jQuery -force

Install-Package jQuery -version 1.8.3

来源：https://stackoverflow.com/questions/14928170/ajax-beginform-with-checkbox-syntax-error

标签

ajax

razor

asp.net-mvc-4

checkbox