2016-07-18 24 views
0

私はタグヘルパーを使用してjqueryオートコンプリート機能を使用する入力フィールドを作成しています。問題は、私のタグヘルパーがトリガされるとhtmlはコンソールで生成されたとき、私はエラーasp.net mvc 6タグヘルパー注入スクリプト

ReferenceError: $ is not defined

を得ているように、私のオートコンプリートスクリプトことができますです

public override void Process(TagHelperContext context, TagHelperOutput output) 
    { 
     output.TagName = "div"; 
     output.TagMode = TagMode.StartTagAndEndTag; 
     output.Content.AppendHtml("<input id='QuickFilter' autocomplete='on' class='form-control' />"); 
     output.Content.AppendHtml("<script type='text/javascript' src ='../js/autocomplete.js'></script>"); 
    } 

autocomplete.js

$(document).ready(function() { 
$("#QuickFilter").autocomplete({ 
    source: function (request, response) { 
     $.ajax({ 
      url: "/PhoneChange/Autocomplete", 
      type: "POST", 
      dataType: "json", 
      data: { Prefix: request.term }, 
      success: function (data) { 
       response($.map(data, function (item, i) { 
        return { 
         label: item["clientName"] + " " + item["clientSurname"] + " " + item["clientPhone"], 
         value: item 
        }; 
       })) 
      } 
     }) 
    }, 
    messages: { 
     noResults: "", 
     results: function() { } 
    }, 
    select: function (event, ui) { 
     event.preventDefault(); 
     $("#OldPhoneNumber").val(ui.item.value["clientPhone"]); 
     $("#AgreementId").val(ui.item.value["id"]); 
     $("#QuickFilter").val(ui.item.label); 
    } 
}); 
}); 

jquery.jsファイルが見つかりませんが、asp.netが自動的に追加して、ページを調べるとjquery.jsファイルが表示されますが、どういうわけか私のスクリプトは...できません。誰もこの問題の解決策を提案できますか?

答えて

0

タグヘルパーで使用しているスクリプトファイルへのパスが相対パスである可能性があります。より具体的なパスを使用する必要があります。そのため、どのビューでもヘルパーを使用できます(http://www.coffeecup.com/help/articles/absolute-vs-relative-pathslinks/参照)。

<script type='text/javascript' src ='../js/autocomplete.js'></script> 

は、どのページが参照を見つけたので

<script type='text/javascript' src ='~/scripts/jquery/js/autocomplete.js'></script> 

ようにする必要があります。 「〜/」はそのウェブサイトのルートであることを意味します。

+0

を使用して、準備ができたときに

  • スケジュールautocomplete.jsが含まれます。 –

  • 0

    これは、JQueryの前にautocomplete.jsが含まれていることによって引き起こされる可能性があります。

    デフォルトのasp.net mvc razorレイアウト(Views/Shared/_Layout.cshtml)には、次の擬似コードで説明するように、ドキュメントの最後にJavaScriptファイルが含まれています。

    <html> 
    ... content omitted ... 
    <body> 
        @Content <!-- Actual content --> 
        <script src="Jquery"></script> 
        <script src="Site.js"></script> 
    </body> 
    </html> 
    

    ここでは、ウェブページにスクリプトを含める場所はa brief discussionです。

    • 移動し、ページ上部のヘッド要素にライブラリスクリプトを含める:

      をすることができますこの問題を解決するには。文書は、ヘルパーがレンダリングされた後、あなたはjQueryのを参照しているかどうかを確認するために有用であろうwindow.onload
    関連する問題