title: bootstrap modal for file upload
body: <p>I have been using bootstrap modal through out my application which is developed in asp.net mvc. Now I am stuck while trying to upload file using bootstrap Model. With normal ajax, the controller did showed null in HttpPostedFileBase. I then used JQuery.Form.js, and switched from @using (Html.BeginHtml to @using (Ajax.BeginForm. With this the file shown in HttpPostedFileBase. But however, this time Callback is not working. Here is the javascript snippet that had been used</p>
  
  <pre><code>$(function () {
      $.ajaxSetup({ cache: false });
      $(document).delegate("a[data-ajax-model]", "click", function (e) {
          $('#myModalContent').load(this.href, function () {
              $('#myModal').modal({
                  keyboard: true
              }, 'show');
              bindAjaxForm(this);
          });
          return false;
      });
  });
  
  function bindAjaxForm(dialog) {    
      $('form', dialog).submit(function (e) {
          e.preventDefault();
          $('#ajaxForm').ajaxForm({
              success: function (data, textStatus, xhr) {
                  alert('test0');
                  $('#myModal').modal('hide');
                  $('#replacetarget').html(data);
                  Initialize_ThreeFixDT();
              },
              error: function (xhr, status) {
                  alert('test');
                  $('#myModalContent').html(xhr.responseText, xhr.status);
                  bindAjaxForm(dialog);
              }
          });
          return false;
      });
  }
  </code></pre>