2017-01-03 13 views
1

jqueryプラグインを使用してライブ検索を行っています。存在していないものを検索しようとすると、テーブルのみが表示されます。それが存在しない場合は、「結果が見つかりません」というメッセージを入力したいと思います。私のコードでは、私はいくつかの検証を追加、ユーザー(JQプラグインに3つの文字ここjqueryプラグインにhtmlタグを追加するにはどうすればよいですか?

/** 
    **options to have following keys: 
     **searchText: this should hold the value of search text 
     **searchPlaceHolder: this should hold the value of search input box placeholder 
**/ 
(function($) 
{ 
    $.fn.tableSearch = function(options) 
    { 
     if(!$(this).is('table')) 
     { 
      return; 
     } 
     var tableObj = $(this), 

      searchText = (options.searchText)?options.searchText:'Search: ', 
      searchPlaceHolder = (options.searchPlaceHolder)?options.searchPlaceHolder:'', 
      divObj = $('<div style="font-size:20px;">'+searchText+'</div><br /><br />'), 
      inputObj = $('<input style="min-width:25%;max-width:50%;margin-left:1%" type="text" placeholder="'+searchPlaceHolder+'" />'), 
      caseSensitive = (options.caseSensitive===true)?true:false, 
      searchFieldVal = '', 
      pattern = ''; 
      inputObj.off('keyup').on('keyup', function(){ 
      searchFieldVal = $(this).val(); 
      if(searchFieldVal.length == 0) 
      { 
       tableObj.find('tbody tr').show(); 
      } 
      else if(searchFieldVal.length >= 3) 
      { 
       pattern = (caseSensitive)?RegExp(searchFieldVal):RegExp(searchFieldVal, 'i'); 
       tableObj.find('tbody tr').hide().each(function() 
       { 
        var currentRow = $(this); 
        currentRow.find('td').each(function() 
        { 
         var result = "No result"; 
         $("tbody tr").append(result); 
         if(pattern.test($(this).html())) 
         { 

          currentRow.show(); 
          return false; 
         } 

        }); 
       }); 
      } 
     }); 
     tableObj.before(divObj.append(inputObj)); 
     return tableObj; 
    } 
}(jQuery)); 
+0

なぜこれにlaravelタグが付いていますか?あなたのhtmlを表示し、私たちはあなたに良い答えを与えることができます。 –

+0

先生、laravelでやっています。私は私のビューを投稿する必要がありますか? – Angel

+0

はい、あなたの意見を投稿してください。あなたの問題にはLaravelに関連するものは何もないので、Laravelタグを持つことは誤解を招きます。 –

答えて

0

の入力最小値を必要とするあなたので掲示される:質問は、私がメッセージ「いいえ結果は見つかりませ」

注意を追加する方法であります質問)、空の結果のハンドラが存在します。そこからコードを見てください。

else if(searchFieldVal.length >= 3) 
{ 
    pattern = (caseSensitive)?RegExp(searchFieldVal):RegExp(searchFieldVal, 'i'); 
    tableObj.find('tbody tr').hide().each(function() 
    { 
     var currentRow = $(this); 
     currentRow.find('td').each(function() 
     { 
      var result = "No result"; 
      $("tbody tr").append(result); 
      if(pattern.test($(this).html())) 
      { 

       currentRow.show(); 
       return false; 
      } 

     }); 
    }); 
} 

あなたの最後に誤解します。それを確認してください。

+0

Pardon me Sirですが、私はそれを取得しません..結果が表示されない場合は、結果が表示されます – Angel

関連する問題