Как отправить форму с помощью javascript?

У меня есть форма с id theForm которая имеет следующий div с кнопкой отправки внутри:

<div id="placeOrder" 
     style="text-align: right; width: 100%; background-color: white;">
     <button type="submit" 
             class='input_submit' 
             style="margin-right: 15px;" 
             onClick="placeOrder()">Place Order
     </button>
</div>

При щелчке placeOrder() функция placeOrder(). Функция изменяет innerHTML вышеуказанного div на "обработку..." (так что кнопка отправки теперь исчезла).

Вышеприведенный код работает, но теперь проблема в том, что я не могу получить форму для отправки! Я попытался поместить это в placeOrder():

document.theForm.submit();

Но это не работает.

Как я могу отправить форму?

Ответ 1

Установите атрибут name вашей формы на "theForm", и ваш код будет работать.

Ответ 2

Вы можете использовать...

document.getElementById('theForm').submit();

... но не заменить innerHTML. Вы можете скрыть форму и затем вставить обработку... span, которая появится на своем месте.

var form = document.getElementById('theForm');

form.style.display = 'none';

var processing = document.createElement('span');

processing.appendChild(document.createTextNode('processing ...'));

form.parentNode.insertBefore(processing, form);

Ответ 3

Это отлично работает в моем случае.

document.getElementById("form1").submit();

Кроме того, вы можете использовать его в функции, как показано ниже:

function formSubmit()
{
     document.getElementById("form1").submit();
}

Ответ 4

document.forms["name of your form"].submit();

или

document.getElementById("form id").submit();

Вы можете попробовать все это... это определенно будет работать.

Ответ 5

//Take form name as "theForm"
//Example:   
         ## ----Html code----- ##    
      <form method="post" action="" name="theForm">
            <button onclick="placeOrder()">Place Order</button>
      </form>

            ## -------javascript code------ ##

        function placeOrder(){
        document.theForm.action="yourUrl";
        document.theForm.submit();
        }

Ответ 6

Это старое сообщение, но я оставлю способ отправить форму без использования тега name внутри формы:

HTML

<button type="submit" onClick="placeOrder(this.form)">Place Order</button>

function placeOrder(form){
    form.submit();
}

Надеюсь, что это решение может помочь кому-то другому. TQ

Ответ 7

Если ваша форма не имеет идентификатора, но имеет имя класса, такое как форма, вы можете использовать инструкцию ниже:

document.getElementsByClassName("theForm")[0].submit();

Ответ 8

Я придумал легкое решение, используя простую форму, скрытую на моем веб-сайте, с той же информацией, с которой вошли пользователи. Пример. Если вы хотите, чтобы пользователь был зарегистрирован в этой форме, вы можете добавить что-то вроде этого в следующую форму ниже.

<input type="checkbox" name="autologin" id="autologin" />

Насколько я знаю, я первый, кто скрыл форму и отправил ее, нажав ссылку. Существует ссылка, представляющая скрытую форму с информацией. Не 100% безопасно, если вам не нравятся автоматические методы входа на ваш сайт с паролями, сидящими на скрытой форме текстового поля пароля...

Итак, вот работа. Допустим, что $siteid - учетная запись, а $sitepw - пароль.

Сначала сделайте форму в своем php script, если вам не нравится html, в ней используются минимальные данные, затем эхо в значении в скрытой форме. Я просто использую значение php и эхо в любом месте, где я хочу pref рядом с кнопкой формы, поскольку вы не можете ее увидеть.

Форма PHP для печати

$hidden_forum = '
<form id="alt_forum_login" action="./forum/ucp.php?mode=login" method="post" style="display:none;">
    <input type="text" name="username" id="username" value="'.strtolower($siteid).'" title="Username" />
    <input type="password" name="password" id="password" value="'.$sitepw.'" title="Password" />
</form>';

PHP и ссылка для отправки формы

<?php print $hidden_forum; ?>
<pre><a href="#forum" onClick="javascript: document.getElementById('alt_forum_login').submit();">Forum</a></pre>

Ответ 9

вы можете использовать ниже код для отправки формы с помощью Javascript;

document.getElementById('FormID').submit();

Ответ 10

Это старый пост, но я оставлю это так:

//Html side. 
//Table is styled to have previous btn on left and next on right botton
<form method="post" action="#">
<table style='width:50% ;height:50%;border: 3px solid #00BABF;' align='center'>
...

 <tr id="trButton" >
   <td id="tdBefore" colspan='4'>
     <input id="btnPrev" class='btn_submit' type="submit" name="submitPrevious" value="Previous"  disabled style="float: left;">
     <input id="btnNext" class='btn_submit' type="submit" name="submitNext" value="Next"disabled style="float: right;">
   </td>                    
 </tr>
</table>
</form>

//Js side
$('.btn_submit').on( 'click', function() {        
    var objEvent=$(this);
    if(objEvent.attr('name')==='submitNext'){                            
         $('form').attr('action','stepNext.php');//Use $('#formId')... if is there more than one                                
    }
    else if(objEvent.attr('name')==='submitPrevious'){
         $('form').attr('action','stepPreviuos.php');
    }
    return true;            
}); //End of $('.btn_submit').on( 'click', func ....

Этот код работает хорошо для меня.

Ответ 11

<html>
<body>

<p>Enter some text in the fields below, then press the "Submit form" button to submit the form.</p>

<form id="myForm" action="/action_page.php">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br><br>
  <input type="button" onclick="myFunction()" value="Submit form">
</form>

<script>
function myFunction() {
    document.getElementById("myForm").submit();
}
</script>

</body>
</html>