2017-01-14 3 views
0

У меня есть следующий входной HTML тегИзменить текст кнопки ввода после нажатия на нее

<input type="submit" id="submitForm" value="Submit" class="btn btn-primary start" autocomplete="off" onclick="submitForm();" /> 

При нажатии на кнопку отправки, он идет в соответствующий файл JavaScript и выполняет функцию SubmitForm();

Я хочу изменить текст формы отправки на «Подождите ...» до тех пор, пока функция не будет завершена.

Есть ли способ, которым это можно сделать?

Это как SubmitForm() функция выглядит следующим образом:

function submitForm() { 
     $("#submitForm").val("Please wait..."); 
     if (formValidation() === true) { 
      submitFormInfo().done(function() { 
       $("#submitForm").val("Submit"); 
      }); 
     } 
} 

function submitFormInfo() { 
return $.ajax({ 
     cache: false, 
     url: "URLHERE" 
     error: function (xhr) { 

     }, 
     success: function (result) { 
     }, 
     async: false, 
     processData: false 
    }); 
} 
+1

Несомненно, найдите элемент по идентификатору и установите его атрибут value. Вы также можете отключить элемент, чтобы избежать двойного представления. – Lucero

+1

вы что-то пробовали? Как выглядит ваш 'submitForm()'? –

+0

Вот что ... когда я это делаю, это не изменяет значение, потому что кнопка зависает, пока форма отправки не будет полностью завершена. Похоже, что поток JS заблокирован и имя не изменяется. – user3587624

ответ

0

Вы можете использовать JQuery смотрите: -

https://jsfiddle.net/swawrm1g/3/

Я удалил: -

onclick="submitForm();" 

и добавлено: -

$('#submitForm').click(function(){ 
    $(this).val('Please Wait...'); 
    submitForm() 
}); 

function submitForm() { 
    alert('Form submitted'); 
}; 
0

Имеете ли вы операцию асинхрона в форме отправки()? если да, то вы можете использовать следующую строку

$("#submitForm").val("Please Wait"); 
+0

Вот что ... когда я это делаю, это не изменяет значение, потому что кнопка зависает, пока форма отправки не будет полностью завершена. Похоже, что поток JS заблокирован и имя не изменяется. – user3587624

+0

Можете ли вы поделиться кодом, который у вас есть на submitForm()? я уверен, что у вас должен быть обычный пост, а не вызов асинхронов, который не задерживает страницу. –

+0

Добавление дополнительного кода, который должен помочь – user3587624

0

Используйте опцию beforeSend на вашем АЯКС аукнется, так и в вашей submitForm() функции, вы можете сделать что-то вроде этого:

function submitForm() { 
    var submitForm = $("#submitForm"); 
    if (formValidation() === true) { 
    $.ajax({ 
     cache: false, 
     url: "URLHERE", 
     async: false, 
     type: 'post', 
     data: { somedata: 'here' }, 
     beforeSend: function(){ 
      submitForm.val("Please wait...").attr("disabled", "disabled"); 
     }, 
     success: function (data){ 
      // do something 
     }, 
     error: function(){ 
      // do something 
     }, 
     complete: function() { 
      // regardless of the response status (success/error) 
      // the codes below will be executed. 
      submitForm.val("Submit").removeAttr("disabled"); 
     } 
    }); 
    } 
} 
0

Простой Javascript достаточно сделайте это ..

<script> 
function submitForm(){ 
    document.getElementById('submitForm').value="Please wait.."; 
} 
</script> 
<input type="submit" id="submitForm" onclick="submitForm()" value="Submit"> 
Смежные вопросы