HTML-форму для отправки

Question

У меня есть функция javascript, которая меняет некоторые поля в форме, у меня есть две кнопки для вызова функции javascript, а другая - в форме. Проблема заключается в том, что кнопка для вызова функции javascript отправляет форму. Я попробовал изменить тип кнопки на «кнопку», которая тормозит кнопку, и она не работает.

$("#button1").click(function() { 

     //$("#usernameField").attr("value",""); 
     //$("#passwordField").attr("value",""); 


     if (authType == 0) { 

      $("#usernameLabel").hide(); 
      $("#usernameField").hide().find('input:text').val(""); 

      $("#passwordLabel").hide(); 
      $("#passwordField").hide().find('input:text').val(""); 

      //$("#initialCatalogLabel").show(); 
      //$("#initialCatalogField").show(); 

      document.getElementById("button1").textContent = "Intergrated"; 
      $('#authType').val(1); 


     } 
     else { 

      $("#usernameLabel").show(); 
      $("#usernameField").show(); 
      $("#passwordLabel").show(); 
      $("#passwordField").show(); 
      //$("#initialCatalogLabel").hide(); 
      //$("#initialCatalogField").hide(); 

      document.getElementById("button1").textContent = "SQL Authentication"; 
      $('#authType').val(0); 
      //return false; 

     } 


<h2>Create</h2> 


@using (Html.BeginForm()) 
{ 
    @Html.ValidationSummary(true) 


<fieldset> 
    <legend>connection</legend> 
    <div class="editor-label"> 
     Authentication Type 
    </div> 
    <div> 
     <button id="button1" value="Intergrated" name="intergrated">SQL Authentication</button> 
    </div> 
    <br /> 
    <br /> 

    <div class="editor-label"> 
     Connection Name 
    </div> 
    <div class="editor-field"> 
     @Html.EditorFor(model => model.conName) 
     @Html.ValidationMessageFor(model => model.conName) 
    </div> 
    <div class="editor-label"> 
     Data Source 
    </div> 
    <div class="editor-field"> 
     @Html.EditorFor(model => model.dataSource) 
     @Html.ValidationMessageFor(model => model.dataSource) 
    </div> 
    <div class="editor-label" id="initialCatalogLabel"> 
     Initial Catalog 
    </div> 
    <div class="editor-field" id="initialCatalogField"> 
     @Html.EditorFor(model => model.initialCatalog) 
     @Html.ValidationMessageFor(model => model.initialCatalog) 
    </div> 

    <div class="editor-label" id = "usernameLabel"> 
     Username 
    </div> 
    <div class="editor-field" id="usernameField"> 
     @Html.EditorFor(model => model.username) 
     @Html.ValidationMessageFor(model => model.username) 
    </div> 
    <div class="editor-label" id = "passwordLabel"> 
     Password 
    </div> 
    <div class="editor-field" id = "passwordField"> 
     @Html.EditorFor(model => model.password) 
     @Html.ValidationMessageFor(model => model.password) 
    </div> 
    <div> 
     <input type="hidden" name="authType" id="authType" value="@Model.authType" /> 
    </div> 


    <p> 
     <input type="submit" value="Create"/> 
     @{ 
if (!string.IsNullOrEmpty(ViewBag.error)) 
{ 
       <div style="color:Red"> 
        @ViewBag.error 
       </div>   
} 
     } 
    </p> 

</fieldset> 

}

Answer 1

Вы должны предназначаться форму, а не кнопку

Нет необходимости использовать e.preventDefault(); при использовании JQuery.

$('form').submit(function(e){ 
    return false; 
}); 

Answer 2

<input type="button" id="button1" value="Integrated" /> 

Может быть, неправильный тип кнопки вы пробовали?