Как мне отменить отправку формы в кнопку отправки onclick?

Я работаю над веб-приложением ASP.net.

У меня есть форма с кнопкой отправки. Код кнопки отправки выглядит как <input type='submit' value='submit request' onclick='btnClick();'>.

Я хочу написать что-то вроде следующего:

function btnClick() {
    if (!validData())
        cancelFormSubmission();
}

Как это сделать?

Ответ 1

Вам лучше делать...

<form onsubmit="return isValidForm()" />

Если isValidForm() возвращает false, ваша форма не отправляется.

Вы также должны перенести обработчик событий из строки.

document.getElementById('my-form').onsubmit = function() {
    return isValidForm();
};

Ответ 2

Измените свой ввод на это:

<input type='submit' value='submit request' onclick='return btnClick();'>

И верните false в свою функцию

function btnClick() {
    if (!validData())
        return false;
}

Ответ 3

Вам нужно изменить

onclick='btnClick();'

к

onclick='return btnClick();'

и

cancelFormSubmission();

к

return false;

Тем не менее, я попытался бы избежать атрибутов встроенных событий в пользу ненавязчивого JS с библиотекой (такой как YUI или jQuery) который имеет хороший API обработки событий и привязывается к событию, которое действительно имеет значение (т.е. событие отправки формы вместо события нажатия кнопки).

Ответ 4

вы должны изменить тип от submit до button:

<input type='button' value='submit request'>

вместо

<input type='submit' value='submit request'>

вы получите имя своей кнопки в javascript и свяжете любое действие, которое вы хотите с ней

var btn = document.forms["frm_name"].elements["btn_name"];
btn.onclick = function(){...};

работал у меня надеюсь, что это поможет.

Ответ 5

Вам нужно return false;:

<input type='submit' value='submit request' onclick='return btnClick();' />

function btnClick() {
    return validData();
}

Ответ 6

Иногда onsubmit не работает с asp.net.

Я решил это очень легко.

если мы имеем такую ​​форму

<form method="post" name="setting-form" >
   <input type="text" id="UserName" name="UserName" value="" 
      placeholder="user name" >
   <input type="password" id="Password" name="password" value="" placeholder="password" >
   <div id="remember" class="checkbox">
    <label>remember me</label>
    <asp:CheckBox ID="RememberMe" runat="server" />
   </div>
   <input type="submit" value="login" id="login-btn"/>
</form>

Теперь вы можете поймать это событие перед отправкой формы и остановить его от обратной передачи и сделать все ajax, которое вы хотите, используя этот jquery.

$(document).ready(function () {
            $("#login-btn").click(function (event) {
                event.preventDefault();
                alert("do what ever you want");
            });
 });

Ответ 7

Почему бы не изменить кнопку отправки на обычную кнопку и в событии клика отправить свою форму, если она пройдет ваши проверки?

например

<input type='button' value='submit request' onclick='btnClick();'>

function btnClick() { 
    if (validData()) 
        document.myform.submit();
} 

Ответ 8

Это просто, просто верните false;

Нижеприведенный код входит в onclick кнопки отправки с помощью jquery..

if(conditionsNotmet)
{
return false;
}

Ответ 9

использовать onclick='return btnClick();'

и

function btnClick() {
    return validData();
}

Ответ 10

function btnClick() {
    return validData();
}

Ответ 11

Вам нужно onSubmit. Не onClick, иначе кто-то может просто нажать Enter, и он будет обходить вашу проверку. Что касается отмены. вам нужно вернуть false. Здесь код:

<form onSubmit="return btnClick()">
<input type='submit' value='submit request'>

function btnClick() {
    if (!validData()) return false;
}

Изменить onSubmit принадлежит в теге формы.

Ответ 12

<input type='button' onclick='buttonClick()' />

<script>
function buttonClick(){
    //Validate Here
    document.getElementsByTagName('form')[0].submit();
}
</script>