Метод ajax serialize() не читает все поля данных формы html

Question

Я пытаюсь отправить данные формы своей веб-страницы с помощью метода jquery get(). Но когда я отправляю форму только немногим из данных поля, которые отправляются на сервер.

форма:

<form class="form-horizontal" id="addpost" method="GET" action=""> 
     <div class="control-group"> 
      <label class="control-label" for="form-field">Post Title</label> 
      <div class="controls"> 
       <input type="text" id="form-field" placeholder="Post Title" name="Post-title" value="" /> 
      </div> 
     </div> 
     <div class="control-group"> 
     <label class="control-label" for="form-field-11">Content Here</label> 
      <div class="controls"> 
      <textarea name="post-content" value="" class="autosize-transition span12" id="form-field-11" style="overflow: hidden; word-wrap: break-word; resize: horizontal; height: 67px;"></textarea> 
      </div> 
      </div><!-- Insert Image Code --> 
      <div class="control-group"> 
      <div class="widget-main"> 
       <div class="controls"> 
        <div class="ace-file-input"> 
         <input id="id-input-file-2" type="file"> 
         <a class="remove" href="#"></a> 
        </div> 
       </div> 
       <div class="controls"> 
        <div class="ace-file-input ace-file-multiple"> 
         <input id="id-input-file-3" type="file" multiple=""> 
         <a class="remove" href="#"> 
         <i class="icon-remove"></i> 
         </a> 
        </div> 
        <label> 
        <input id="id-file-format" type="checkbox" name="file-format"> 
         <span class="lbl"> Allow only images</span> 
        </label> 
       </div> 
       </div> 
      </div><!-- Insert Image Code --> 
      <div class="space-4"></div> 
      <div class="control-group"> 
       <label class="control-label" for="form-field-tags">Tag input</label> 
       <div class="controls"> 
        <input id="form-field-tags" type="hidden" placeholder="Enter tags ..." value="Tag Input Control" name="tags"> 
       </div> 
      </div> 

      <div class="space-4"></div> 
      <div class="control-group"> 
       <label class="control-label" for="form-field-select-3">Select Category</label> 
       <div class="controls"> 
       <label for="form-field-select-3">Chosen</label> 
       <select class="chzn-select" id="form-field-select-3" data-placeholder="Choose a Category..."> 
       <option value=""> 
       </option><option value="Blog">Blog 
       </option><option value="News Letter">News Letter 
       </option></select> 
      </div> 
      </div> 

    <div class="control-group" style="float:left; margin-right:25px"> 
     <div class="controls"><button type="submit" class="btn btn-info"> 
     <i class="icon-ok bigger-110"></i> 
     <input type="submit" value="" id="posubmit" style="opacity:0"/>Submit</button> 
     <button type="reset" class="btn"><i class="icon-undo bigger-110"></i>Reset</button> 
     </div> 
    </div> 
    <div id="resp" style="float:left; margin-top:5px"> 
     <img id="loading" style="visibility:hidden;" src="assets/img/ajax-load.gif" width="16" height="16" alt="loading" /> 
     </div> 
    </form> 

JavaSccript:

$('#addpost').submit(function(e){ 
if(use_ajax) 
     { 
      $('#loading').css('visibility','visible'); 
      $.get('test.php',$(this).serialize(), 

       function(data){ 
        if(parseInt(data)==-1) 
         $.validationEngine.buildPrompt("#resp","* Please ensure all fields are filled.","error"); 

        else 
        { 
         $("#resp").show('slow').after('<p id="resp-mes" style=" color:#000000; text-decoration: bold;">Success....</p>'); 
        } 

        $('#loading').css('visibility','hidden'); 
        setTimeout("jQuery('#resp').hide('slow');",3000); 
        setTimeout("jQuery('#resp-mes').hide('slow');",5000); 
        }); 
     } 
     e.preventDefault(); 
} 
)}; 

В этом только значения 3, где поле, отправленных на сервер. Это пост-заголовок, сообщение и теги Я не знаю, почему это происходит. Любая помощь будет оценена по достоинству.

Answer 1

У вас есть две проблемы.

1. Ajax и загрузка по серийному номеру не работает с загрузкой файла. (Read this question and answer for async upload)

2. jquery form serialize требуется атрибут имени. ваш поле выбора (form-field-select-3) не имеет атрибута имени.

Ниже приводится примечание в jquery serialize странице документации -

Примечание: Только "successful controls" упорядочиваются в строку. No значение кнопки отправки сериализуется, так как форма не была отправлена ​​ с помощью кнопки. Для значения элемента формы, которое должно быть включено в последовательную строку , элемент должен иметь атрибут имени. Значения от флажков и переключателей (входы типа «радио» или «флажок») включены только в том случае, если они отмечены. Данные из элементов выбора файла не сериализованы.

Answer 2

Я вижу, что требуется attrbute name="", а некоторые из входных элементов отсутствуют. так что вы можете попробовать разместить этот атрибут и посмотреть, разрешает ли это вопрос:

<select class="chzn-select" name="your-elem-name"> 
//--------------------------^^^^^^^^^^^^^^^^^^^^^-----try placing the name attr 

Answer 3

ОК всей этой формы, только четыре элемента могут быть отправлены, если все четыре заполнены/выбраны из более высокого индекса, чем ноль;
те с этими именами;
«метка»
«файл формат»
«пост-контент»
«Пост-титул»

это потому, что только эти теги с атрибутом имени определенным.
, пожалуйста, укажите все элементы, которые вы хотите отправить, на сервер атрибут имени с индексом почтового индекса, который вы хотите использовать для доступа к ним.

Answer 4

Его, потому что вы пропустили «имя» атрибут выберите элемент

<select class="chzn-select" id="form-field-select-3" name="form-field-select-3" data-placeholder="Choose a Category...">

Я проверил в моем местном, и теперь это работает отлично.

Пожалуйста, проверьте и сообщите мне, если возникли проблемы.

Спасибо