1

私は検索フォームを持っていて、1 つの小さなことで立ち往生しています。問題は次のとおりです。

  • 入力フィールドが空の場合にフォームが送信されないようにするには

jQuery または php を使用した最も効率的な方法を提案してください。

前もって感謝します。

ハッピーコーディング

<!--Search form-->
<div id="searchbar">
    <form method='GET' action='search.php'>
<input type="text" placeholder="Search Database" name="searchkey" id="searchkey" />
</form>
</div>

4

8 に答える 8

1

このコードを html または php ページのヘッドに配置します。これが役立つことを願っています... :)

<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
    $( document ).ready(function() {
        input_value = $.trim($('#searchkey').val());
        if(input_value == ''){
           alert('Enter some value');
           return false;  //Does not submit the form 
        }else{
          //perform your code if it should not be empty. 
       }
    });
</script>
</head>

この$.trim()関数は、指定された文字列の先頭と末尾からすべての改行、スペース (非改行スペースを含む)、およびタブを削除します。これらの空白文字が文字列の途中にある場合、それらは保持されます。

于 2013-10-09T05:49:47.887 に答える
0

html 

<div id="searchbar">
        <form method='GET' action='search.php'>
    <input type="text" placeholder="Search Database" name="searchkey" id="searchkey" />
    </form>
    </div>

脚本

$(document).ready(function(){
$(form).submit(function(){

if( $.trim($("#searchkey").val()) == "")
{
return false; // if in input no value then form not submit
}
return true;
});


});

参照の送信とトリム

于 2013-10-09T05:50:01.187 に答える
0

.submit() ハンドラーの使用

<div id="searchbar">
<form method='GET' action='search.php' id='formdata'>
<input type="text" placeholder="Search Database" name="searchkey" id="searchkey" />
<input type="submit" value="search" id="search">
</form>
</div>

$(document).ready(function()
$( "#formdata" ).submit(function( event ) {
//alert( "Handler for .submit() called." );
 if($('#searchkey').val() === ''){
    event.preventDefault();  
    }
    else {
    alert($('#searchkey').val());
    } 

  });
});

2番目の回答に追加の送信ボタンを含めました

<div id="searchbar">
<form method='GET' action='search.php'>
<input type="text" placeholder="Search Database" name="searchkey" id="searchkey" />
<input type="submit" value="search" id="search">
</form>
</div>

<script type="text/javascript" src="script/jquery.js"></script> //include jquery.js
<script type="text/javascript">
$(document).ready(function(){
    $('#search').on('click',function(){
          if($.trim($('#searchkey')).val() == '')
         {
          alert("No search Keyword"); 
          return false;
         }
        else {
          alert("search Keyword"); 
          return true;
        }

    })
});
</script>

trim() 関数を使用して、検索文字列の先頭と末尾の空白を削除しました

<div id="searchbar">
<form method='GET' action='search.php' id='formdata'>
<input type="text" placeholder="Search Database" name="searchkey" id="searchkey" />
<input type="submit" value="search" id="search">
</form>
</div>

<script type="text/javascript" src="script/jquery.js"></script> //include jquery.js
<script type="text/javascript">
$(document).ready(function(){
    $('#formdata').submit(function(){
     if($.trim($('#searchkey').val()) == '')
     {
       alert("No search Keyword");
       return false;
     }
    else 
    {
     alert($('#searchkey').val());
     return true;
    }     
  })
});
</script>
于 2013-10-09T07:12:54.107 に答える