Как отправить форму с <li>вместо кнопки отправки?

Question

Я хочу иметь возможность отправить форму, но вместо того, чтобы нажимать кнопку отправки, я хотел бы иметь возможность щелкнуть элемент <li> и отправить его.

Любая помощь будет БОЛЬШОЙ!

Заранее спасибо!

Ncoder

Answer 1

Вы можете поместить событие onclick в LI, которое вызывает событие отправки форм:

<form id="myForm" action="foo.htm" method="post">  
  <ul>
    <li onclick="myForm.submit();">Click me</li>
  </ul>
</form>

Ваша форма будет нестандартной и не очень доступной.

Answer 2

<li onclick="formName.submit();">

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

Answer 3

Добавьте click обработчик к элементу <li> и используйте javascript для отправки формы document.getElementById('formid').submit();

Answer 4

JavaScript.

Связать событие onclick элемента. Получить ссылку на форму.

var frm = document.getElementById('formid');

Отправить.

frm.submit()

Answer 5

Мне кажется, я пытался сделать что-то очень похожее на вас, но я решил написать «правильный» способ. Вот альтернативный подход, который в основном стилизует кнопку отправки как элемент li.

HTML / Coldfusion

<div id="student_options">
<ul>
    <cfoutput query="student_specs">
        <cfif #currentStudent# IS NOT #student_specs.GS1FNFP#>
            <form action="" method="POST" name="dropdown">
                <input type="hidden" name="change_stnum" value="#Trim(student_specs.STNUM)#" />
                <input type="submit" name="submit_stu_change" value="#Trim(student_specs.GS1FNFP)#" />
            </form>
        </cfif>
    </cfoutput>
</ul>
</div>

CSS

#student_options input[type="submit"] {
    padding:15px 20px 15px 20px;
    font-size:90%;
    color:#555;
    background-color:#eee;
    display:block;
    width:100%;
    text-align:left;
}

#student_options input[type="submit"]:hover {
    background-color:#F4F4F4;
    cursor:pointer;
}

Вам придется настраивать элементы по своему вкусу, но это лучший подход, чем использование JavaScript для отправки формы.

Answer 6

<form id="myForm">
...

<li id="something" onclick="mySubmit();"><p>hello world!</p></li>
...
</form>
<script type="text/javascript">
   function mySubmit(){
   document.getElementById("myForm").submit();
}</script>