Событие OnPress, предназначенное для кнопки «Поиск», вызывает кнопку «Отправить» для всей страницы. - PullRequest
0 голосов
/ 10 марта 2012

У меня есть следующая форма в процессе регистрации:

            <form class="form1" id="register_form1" method="POST" action="<?php echo $register_url; ?>" name="register_form1">

            <!-- other parts of the form that are not relevant to this question -->             
            <!-- text input area to conduct a search -->
             <span style="text-align: left; width: 100%;margin-left:40px;">Select a primary recruiter</span>
             <div class="ansDiv">
             <table style="float: left;">
               <tr>
               <td>
               <input type="text" id="primary_recruiter" name="primary_recruiter" value="" onkeypress="searchKeyPress(event);"> 
               </td>

               <td>
               <input type="button" id="buttonSearch" value="" class="button_search" name="seachprimary" onclick="javascript: searchRecruiter();">
               </td>

               <td>
               <a class="highlight" href="../images/PrimaryRecruiter.gif" style="float: right; padding-right: 655px;">
               <img src="../images/Q-btn.png">
               </a></td>                    

               <td>
               <input type="hidden" id="primary_recruiter_id" name="primary_recruiter_id" value="">
               </td></tr>
            </table>            

            <!-- last part of the form that is not relevant to this question -->

            <!-- Submit button for the page itself. -->
            <p align="center">
              <input type="submit" class="button_submit" name="register1_submit" value="" />
            </p>
            </form>

            And here's the javascript I have setup to implement a button press on Enter:


            <script type="text/javascript">

             function searchRecruiter(){
             var temp = $("#primary_recruiter").val();
                $.ajax({
                    type : 'GET',
                    url : 'searchrecruiter.php',
                    data: "name="+temp,
                    success : function(data){
                     $("#displayrecruiterlist").html(data);
                    }//end function(data) call
              });//end $.ajax call
             }//end searchRecruiter

            //other java scripts
            </script>


            <!-- Press enter to search... -->    
              <script type="text/javascript">
                function searchKeyPress(e){

                    // look for window.event in case event isn't passed in
                    if (typeof e == 'undefined' && window.event) { e = window.event; }
                    if (e.keyCode == 13){
                        document.getElementById('buttonSearch').click();
                    }               
                }
            </script>

Когда я нажимаю ввод в поле ввода текста, я в конечном итоге получаю document.getElementByID ('buttonSearch'). Click ();так что работает.Но тогда страница отвечает, как если бы я нажал на кнопку отправить, у которой нет атрибута id.

Когда я нажимаю на кнопку поиска, она работает как положено.Что я делаю неправильно?Я думал, что посылаю щелчок по кнопке «Поиск», но это не тот ответ, который я получаю.

Спасибо.

Что нужно иметь в виду: я новичок в Интернетеразработки (PHP, JavaScript и т. д.) и учусь на работе.Пожалуйста, дайте мне знать, если мне нужно что-то еще, что я должен предоставить.

1 Ответ

1 голос
/ 10 марта 2012

Нажатие ввода в поле ввода текста отправит родительскую форму. Поскольку поле / кнопка поиска фактически выполняют свою собственную функцию (получение данных с помощью вызова AJAX), они, вероятно, вообще не должны находиться внутри формы. Я бы порекомендовал вытащить эти элементы и поместить их за пределы тега формы. Это решит вашу проблему.

Другой вариант - возвращать false в событии onkeypress.

FYI, onclick = "" - это синтаксис javascript, поэтому javascript: в начале подразумевается и не нужен.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...