JQuery reference is not working in Orchard

Question

Hi i added a jquery reference to a cshtml page in orchard module.but my alert message not working and no errors as well. i found few answers for the same issue but none of them works for me.So i appreciate your help on this. I have added an entry to the Module.txt file as "Dependencies: Settings, Orchard.jQuery" and my cshtml code looks like below :

@using Orchard.UI.Resources;

@{
   Script.Require("jQuery");
   Script.Require("jQueryUI");
  }
<div>
    <button name="click" id="btnClick">
     Click here
    </button>
    <h1>Hello</h1>
  </div>

@using(Script.Foot()) {
    <script type ="text/javascript">
         $(function () {
            $("#btnClick").click(function () {
                alert("Hello");
            });
        });
    </script>

Answer 1

Thanks everybody for giving me suggestions on this issue. I myself found what went wrong.I used a .cshtml view and once its rendered i checked the view source and it didn't have header,body and footer tags.So the script was not attached.When the page is rendered through a layout page the issue is solved :) .

Answer 2

Try this

@using Orchard.UI.Resources;

@{
Script.Include("http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js").AtHead();

 Script.Include("http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.min.js").AtHead();
  }
<div>
    <button name="click" id="btnClick">
     Click here
    </button>
    <h1>Hello</h1>
  </div>

@using(Script.Foot()) {
    <script type ="text/javascript">
         $(function () {
            $("#btnClick").click(function () {
                alert("Hello");
            });
        });
    </script>