title: Using Jquery Globalize with MVC 5
body: <p>I am trying to use the MVC unobstrusive validation with jquery globalize plugin in MVC5 (in conjunction with the package <a href="https://github.com/johnnyreilly/jquery-validation-globalize" rel="nofollow noreferrer">jquery-validate-globalize</a>). For learning purposes I started a demo project as per <a href="https://johnnyreilly.github.io/jQuery.Validation.Unobtrusive.Native/AdvancedDemo/Globalize.html" rel="nofollow noreferrer">here</a>, but it fails to run with globalize (it works on default Microsoft unobstrusive validation). The model is very simple: </p>
  
  <pre><code>public class GlobalizeModel
  {
      [Range(10.5D, 20.3D)]
      public decimal Double { get; set; }
  
      [Required]
      public DateTime? DateTime { get; set; }
  }
  </code></pre>
  
  <p>I try to initiate Globalize as follows at the bottom of the _Layout page (the view is minimal with 2 input only): (I get list of necessary files from <a href="https://johnnyreilly.github.io/globalize-so-what-cha-want/" rel="nofollow noreferrer">https://johnnyreilly.github.io/globalize-so-what-cha-want/</a>)</p>
  
  
  
  <pre><code>&lt;script src="~/Scripts/bootstrap.min.js"&gt;&lt;/script&gt;
  &lt;script src="~/Scripts/jquery.validate.min.js"&gt;&lt;/script&gt;
  &lt;script src="~/Scripts/jquery.validate.unobtrusive.min.js"&gt;&lt;/script&gt;
  
  &lt;!--cldr scripts--&gt;
  &lt;script src="~/Scripts/cldr.js"&gt;&lt;/script&gt;
  &lt;script src="~/Scripts/cldr/event.js"&gt;&lt;/script&gt;
  &lt;script src="~/Scripts/cldr/supplemental.js"&gt;&lt;/script&gt;
  &lt;!--globalize scripts--&gt;
  &lt;script src="~/Scripts/globalize.js"&gt;&lt;/script&gt;
  &lt;script src="~/Scripts/globalize/number.js"&gt;&lt;/script&gt;
  &lt;script src="~/Scripts/globalize/date.js"&gt;&lt;/script&gt;
  &lt;!--jquery globalize--&gt;
  &lt;script src="~/Scripts/jquery.validate.globalize.js"&gt;&lt;/script&gt;
  
  
  &lt;script&gt;
  
      $.when(
          $.getJSON("/Scripts/cldr/supplemental/likelySubtags.json"),
          $.getJSON("/Scripts/cldr/main/en/numbers.json"),
          $.getJSON("/Scripts/cldr/supplemental/numberingSystems.json"),
          $.getJSON("/Scripts/cldr/main/en/ca-gregorian.json"),
          $.getJSON("/Scripts/cldr/main/en/timeZoneNames.json"),
          $.getJSON("/Scripts/cldr/supplemental/timeData.json"),
          $.getJSON("/Scripts/cldr/supplemental/weekData.json"),
          $.getJSON("/Scripts/cldr/main/tr/numbers.json"),
          $.getJSON("/Scripts/cldr/main/tr/ca-gregorian.json"),
          $.getJSON("/Scripts/cldr/main/tr/timeZoneNames.json"),
          console.log("JSONs loaded")
          ).then(function () {
              console.log("start slicing");
              return [].slice.apply(arguments, [0]).map(function (result) {
                  console.log("slicing done");
                  return result[0];
              });
          }).then(Globalize.load).then(function () {
              Globalize.locale("en");
              console.log("Locale set to en");
          }).then(console.log("LOADED EVERYTHING"));
  
  
  &lt;/script&gt;
  </code></pre>
  
  <p>But when I run the page, I only see the console logs <code>JSOns loaded</code> and <code>LOADED EVERYTHING</code>. Moreover, when I try a client side validation by typing anything in the number textbox (and of course when the focus is lost), I get the following error in the console:</p>
  
  <pre><code>Uncaught Error: E_DEFAULT_LOCALE_NOT_DEFINED: Default locale has not been defined.
  </code></pre>
  
  <p>This post <a href="https://stackoverflow.com/questions/32753888/jquery-globalize-setup-using-plain-javascript-uncaught-error">here</a> is similar, and I tried to check the things listed there. I think my JSON objects are not fetched, but I am not good aj JS so I am not sure on that. I added the following items to web.config to see if this is something related with file serving, with no avail:</p>
  
  <pre><code>&lt;system.webServer&gt;
   &lt;staticContent&gt;
    &lt;remove fileExtension=".json"/&gt;
    &lt;mimeMap fileExtension=".json" mimeType="application/json" /&gt;
   &lt;/staticContent&gt;
  &lt;/system.webServer&gt; 
  </code></pre>
  
  <p>The culture is set to auto in web.config as follows:</p>
  
  <pre><code>&lt;system.web&gt;
    &lt;globalization culture="auto" uiCulture="auto" /&gt;
    &lt;compilation debug="true" targetFramework="4.5.2"/&gt;
    &lt;httpRuntime targetFramework="4.5.2"/&gt;
  &lt;/system.web&gt;
  </code></pre>
  
  <p>You can see <code>Scripts</code> folder structure in here:</p>
  
  <p><a href="https://i.stack.imgur.com/KzVfB.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/KzVfB.png" alt="You can see &lt;code&gt;Scripts&lt;/code&gt; folder structure in here"></a></p>
  
  <p>So, what is the problem here? How can I make this thing work?</p>