Suppression de la forme du formulaire à l'entrée lorsqu'une zone de texte est vide

Question

J'utilise MVC, pas que cela fasse une différence, mais j'ai une zone de texte pour la recherche.

<% using (Html.BeginForm("Index", "Search", FormMethod.Post)) { %> 
      <%= Html.AntiForgeryToken() %> 
      <div id="search_box"> 
      <span id="search-title">Search Site</span> 
       <div> 
        <%= Html.TextBox("searchText", "type here, then press enter", new { @class = "search_input" }) %> 
       </div> 
      </div> 
     <% } %> 

Je l'habitude d'avoir le onblur et onfocus événements prévus sur cette zone de texte pour faire quelques swapping texte lorsque l'utilisateur a cliqué dans ou hors de celui-ci sans avoir à saisir quoi que ce soit. Mais, je les ai déplacés dans un fichier JS parce que, finalement, nous voulons ajouter d'autres fonctionnalités par JS, telles que la saisie semi-automatique, etc

Le problème avec mon JS est qu'il soumet n'importe quoi.

var searchHandler = function() { 

    var searchBox = "searchText"; 
    var defaultText = "type here, then press enter"; 

    var attachEvents = function() { 

     $("#" + searchBox).focus(function() { 
     if (this.value == defaultText) { 
       this.value = ''; 
      } 
     }).blur(function() { 
      if (this.value == '') { 
       this.value = defaultText; 
      } 
     }).keyup(function(event) { 
      var searchTerms = $("#" + searchBox).val(); 
      if (event.keyCode == 13 && searchTerms == '') { 
       return false; 
      } 
      else { 
       return true; 
      } 
     }); 

    }; 

    return { 

    init: function() { 
      $("#" + searchBox).val(defaultText) 
      attachEvents(); 
     } 
    } 
}(); 

$().ready(function() { 
    searchHandler.init(); 
}); 

Ce dont j'ai vraiment besoin, c'est de faire en sorte que enter ne soumette pas le formulaire si la zone de texte est vide. Des idées?

Answer 1

Si vous utilisez jQuery, vous pouvez simplement renvoyer un faux si les règles de validation ne sont pas respectées.

$(document).ready(function(){ 
    $('form').submit(function(){ 
     if($('#searchText').val() == '') 
      return false; 
     else 
      return true; //just to be explicit, not really necessary. 
    }); 
}); 

Ou quelque chose près de cela.