2015-05-17 2 views
1

У меня есть этот поиск:форма поиска не представляет

JSFIDDLE

и он не подчиняется. Когда я нажимаю, чтобы ввести или найти значок. Зачем?

<form action="/search.php" method="get"> 
    <fieldset> 
     <ul class="toolbar clearfix"> 
      <li><button type="submit" id="btn-search"><span class="fa fa-search" style="color:gray;"></span></button></li> 
      <li><input type="search" id="search" placeholder="" name="s"></li> 
     </ul> 
    </fieldset> 
</form> 

$(document).ready(function() { 
    $('#btn-search').on('click', function(e) { 
     e.preventDefault(); 
     $('#search').fadeIn().focus(); 
    }); 
}); 
+2

Потому что вы сказали, это не делать делать с 'e.preventDefault();' – cbergmiller

ответ

3

Потому что вы предотвращение отправки формы с e.preventDefault() и не подчиняющаяся формой с любыми другими методами.
Вы можете отправить форму с помощью Ajax, как это:

$('#btn-search').on('click', function(e) { 
     e.preventDefault(); 

     if($('#search').val()){ 
      $.ajax({ 
       url  : 'submit.php', 
       data : { 'input': $('#search').val() }, 
       success : function(response) { 
        alert(response); 
       } 
      }); 
     } 

     $('#search').animate({ 
      width: 'toggle', 
     }).focus(); 
    }); 

и написать представить функции в submit.php
Внутри submit.php вы можете написать то, что вам нужно сделать с пользовательским вводом. Что-то вроде этого:

<?php 
    echo "You have entered: " . $_GET['input']; 
?> 

Надеется, что это помогает ..

Смежные вопросы