Как предотвратить удары ввода представить, если текстовое поле пустым

У меня есть следующий код:Как предотвратить удары ввода представить, если текстовое поле пустым

<form method="post" action="http://www.mypage.com/search.aspx" id="aspnetForm"> 
    <input name="ctl00$centerContent$txtSearchPhysician" id="ctl00_centerContent_txtSearchPhysician" type="text" size="25" /> 
    <input name="ctl00$centerContent$btnPhysicianSearch" id="ctl00_centerContent_btnPhysicianSearch" type=button value="Search" /> 
</form> 

<script> 
$(document).ready(function(){ 
    jQuery('input[id="ctl00_centerContent_txtSearchPhysician"]').keyup(function() { 
     var raw_text = jQuery(this).val(); 
     var return_text = raw_text.replace(/[^a-zA-Z]/g,''); 
     jQuery(this).val(return_text); 
    }); 

    jQuery('input[id="ctl00_centerContent_txtSearchPhysician"]').keydown(function(e) { 
     jQuery(this).css('background-color', '#FFFFFF'); 
    }); 

    jQuery('input[id="ctl00_centerContent_btnPhysicianSearch"]').click(function() { 
     var raw_text = jQuery('input[id="ctl00_centerContent_txtSearchPhysician"]').val(); 
     if (!raw_text) { 
      alert ('Search Query is Blank'); 
      jQuery('input[id="ctl00_centerContent_txtSearchPhysician"]').css('background-color', '#FF3333'); 
      jQuery('input[id="ctl00_centerContent_txtSearchPhysician"]').focus(); 
     } 
     if (raw_text) { 
      //alert (raw_text); //displays the search string 
      //document.location.href="http://www.google.com"; //redirects to google.com 
      window.document.cookie='postbackcookie='; 
      window.document.location.href="http://www.mypage.com?searchtext=" + raw_text; 
     } 
    }); 
}); 
</script>

Почти все работает отлично, за исключением одной вещи. Если текстовое поле имеет фокус, и я нажимаю Enter, не вводя ничего, он просто перезагружает страницу действия.

Как изменить код, поэтому, когда это произошло, фон текстового поля становится красным, а ввод - нулевым. Единственный раз, когда вводится текст в текстовом поле, есть ли строка?

источник

2014-01-21 Si8

Вы должны изменить JQuery селекторы из JQuery ('вход [ID = "ctl00_centerContent_txtSearchPhysician"]') до $ ('# ctl00_centerContent_txtSearchPhysician'), нет никаких причин, для указания типа ввода, так как вы используете уникальные идентификаторы. – Marko

Вы можете использовать event.preventDefault() в событии нажатия кнопки, если значение текстового поля является пустой строкой. –

Щелчок кнопки работает нормально. У меня просто проблема с нажатием enter в текстовом поле:/ – Si8

Перехватите событие отправки и подтвердите форму, прежде чем разрешить отправку.

$("#aspnetForm").on("submit",function(e){ 
    e.preventDefault(); 
    if ($("#someinput").val() != "") { 
     this.submit(); // this doesn't trigger another submit event 
    } 
})

Делая это таким образом, было бы легко позже добавить дополнительную проверку по мере необходимости.

источник

2014-01-21 16:24:29

Он просто перезагружает страницу:/ – Si8

, что не имеет смысла. Вы изменили его, указав правильный ввод? мой селектор - это, очевидно, просто пример. Идентификатор формы также должен быть правильным. –

Я исправил его ... вместо 'form.submit();' я добавил код из блока if (raw_text) и его работы :) Я проголосовал и принял. – Si8

добавьте к этому входу: required

<input name="ctl00$centerContent$btnPhysicianSearch" id="ctl00_centerContent_btnPhysicianSearch" type=button value="Search" required/>

источник

2014-01-21 16:26:53 wpdaniel

К сожалению, это не работает в IE <= 8:/ – Si8

Попробуйте использовать required = "required", это может сделать старые браузеры лучше. – wpdaniel

Как предотвратить удары ввода представить, если текстовое поле пустым

ответ

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