Форма представления программно не вызывает внутреннюю функцию

Question

У меня есть следующие функции автозаполнения. Форма присваивается автоматически при нажатии одного из предложенных значений:

var submitAutocompleteForm = function (event, ui) {  
    var $input = $(this); 
    $input.val(ui.item.value);  
    var $form = $input.parents("form:first");  
    $form.submit(); 
}; 

var createAutoComplete = function() {  
    var $input = $(this);  
    var options = { 
     source: $input.attr("data-source-autocomplete"), 
     select: submitAutocompleteForm, 
    };  
    $input.autocomplete(options); 
}; 
$("input[data-source-autocomplete]").each(createAutoComplete); 

Это работает просто отлично. Форма имеет этот дополнительный скрытый вход:

<input id="autocomplete" name="autocomplete" type="hidden" value="False" /> 

Теперь я хочу изменить submitAutocompleteForm функцию, чтобы изменить значение этого входного к true на представить:

$form.submit(function (e) { 
    $(this).children('#autocomplete').val(true); 
}); 

но эта внутренняя функция никогда не вызывается. Даже попробованный с простым alert внутри, это также никогда не вызывает.

Что я делаю неправильно?

EDIT: Html код:

@using (Ajax.BeginForm("LoadBook", new { id = Model.CollectionId }, new AjaxOptions 
{ 
    HttpMethod = "POST", 
    InsertionMode = InsertionMode.Replace, 
    UpdateTargetId = "bookDetailsPlaceHolder", 
    OnComplete = "animateBookLoad" 
})) 
{ 
    @Html.Hidden("autocomplete", false) 

    <div class="form-horizontal"> 
     <div class="form-group form-custom"> 
      <div class="col-md-12"> 
       @Html.TextBox("bookDetails", null, new { @class = "form-control pull-left", @placeholder = "Szukaj tytułu", data_source_autocomplete = Url.Action("Autocomplete") }) 
       <span class="input-group-btn"> 
        <button id="addCopySearchBtn" class="btn btn-default" type="submit"> 
         <span class="glyphicon glyphicon-search"></span> 
        </button> 
       </span> 
      </div> 
     </div> 
    </div> 
} 

<div id="bookDetailsPlaceHolder" style="display:none"> 
</div> 

Кроме того, я заметил, что когда я вручную нажмите кнопку submit, внутренняя функция вызывается, ... Так что мне кажется, что $form.submit() отправляет форму (очевидно), но $form.submit(function() { } фактически вызывается, когда форма отправляется.

Я попробую указать, что мне нужно: Мне нужна функция submitAutocompleteForm для отправки значения в TextBox, но также для изменения значения скрытого ввода. Я не могу написать что-то вроде $('#form").on('submit', function() { }, так как я не хочу, чтобы значение ввода менялось, когда пользователь вручную вводит форму.

Answer 1

$form.submit(function (e) { 
    e.preventDefault(); 
    $(this).children('#autocomplete').val(true); 
}); 

Это останавливает форму от отправки что означает, что функция ниже будет иметь возможность манипулировать элементы формы. Однако это означает, что у вас есть AJAX данные формы через JavaScript или отправить форму еще раз.