проверка заполнения формы js - PullRequest
Новая
       5

проверка заполнения формы js

2 голосов
/ 29 сентября 2010

Как я могу вернуть пользователя в незаполненное поле, когда он нажимает кнопку "Отправить"?

У меня есть что-то вроде этого: 

    <!--Contact Name-->
    <div class="section" id="inputdiv">
         <span class="fieldname">Name:</span>
         <input type="text" id="contactname" /> <!-- Nessesary to be filled-->
           <script type="text/javascript">
               var contactname = new LiveValidation('contactname');
               contactname.add(Validate.Presence);
           </script>  
    </div>


     <a class="button-more" style="width:903px; float: right; font-size: 15px; margin-top: 15px;" href="">Submit my answers</a>

Или только это: 

<input type="text" id="contactname" /> <!-- Nessesary to be filled-->

<a href="">Submit my answers</a>

Ответы [ 3 ]

1 голос
/ 29 сентября 2010

В идеале, если вы хотите, чтобы люди, которые не запускают javascript в своих браузерах, использовали вашу форму, вам следует использовать кнопку <input type="submit" /> с последующей проверкой на стороне сервера, с проверкой javascript в качестве ярлыка для тех пользователей, которые

Чтобы добавить проверку javascript, вы можете прикрепить некоторый javascript к событию отправки формы или к событию click привязки: 

    <form name="example" action="example.asp" method="post" onsubmit="javascript:return validate(this) ;">
        <input type="text" name="contactname" id="contactname" />
        <input type="submit" name="submit" value="Button-Label" />
    </form>
    <script type="text/javascript">
        function validate(frm) {
            var message = '' ;
            if(frm.contactname.length < 1) {
                // Put cursor in field.
                if(message.length < 1) frm.contactname.focus() ;
                message = message + 'Please enter your name.\n' ;
            }
            if(message.length > 0) {
                alert(message) ;
                // Stop the form submitting
                return false ;
            }
            return true ;
        }
    </script>
1 голос
/ 29 сентября 2010

Вы должны выполнить следующий код, пока пользователь нажимает «Отправить»: 

if (document.getElementById('contactname').value=='') document.getElementById('contactname').focus();
else // if the field isn't empty, proceed

РЕДАКТИРОВАТЬ: Ой, извини, я только что заметил тег "jquery". Это должно быть создано в jQuery? Я не знаю jQuery, но вы также можете использовать приведенный выше код;)

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

0 голосов
/ 29 сентября 2010

Проверка формы не должна происходить только спереди с HTML и JS, поскольку ее слишком легко обойти Вам также следует выполнить некоторые проверки в своем бэкэнде.

При этом вам необходимо иметь форму, чтобы правильно проверить ее действительность. Например: 

<form id="abcd">
 <input id="input" />
</form>

тогда 

$("abcd").submit(function(e){
  return ( $("#input").val() != "" );
});

Я использовал синтаксис jQuery, но это в основном то же самое с обычным JS.

Если бы вы могли также использовать все хорошие плагины, такие как http://bassistance.de/jquery-plugins/jquery-plugin-validation/

Если вам не нужна форма, просто выполните тест, нажав на ссылку отправки, и проверьте значение здесь.

...