2014-02-05 3 views
-1

Мне нужно использовать Ручки внутри страницы jsp. У меня есть handlebars-v1.3.0.js в моей папке js и используется следующий фрагмент кода, чтобы включить этот js-файл в мою страницу jsp.Рули в JSP

код:

<script type="text/javascript" src="./js/handlebars-v1.3.0.js"></script> 

Я попытался <script type="text/javascript" src="js/handlebars-v1.3.0.js"></script> также. Но не повезло.

Но когда страница загружена, я получаю сообщение об ошибке «Hanldebars not defined» в моей консоли браузера. Пожалуйста, предложите, что я делаю неправильно. Все дело в том, что я использую рули внутри html-страницы.

Структура папок приведена ниже.

-WebContent 
    --Home.jsp 

-js 
    --handlebars-v1.3.0.js 

Я хотел бы знать две вещи. 1.) Каков правильный способ передать путь js-файла внутри jsp-файла? 2.) Поддерживает ли jsp рули?

«Компоненты» - это объект массива, который определен в другом js.

Мой исходный код (Home.jsp):

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" 
    pageEncoding="ISO-8859-1"%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<title>My first JSP</title> 

<script type="text/javascript" src="./js/handlebars-v1.3.0.js"></script> 

<script type="text/javascript"> 
    Handlebars.registerHelper('eachByIdx', function(menuData, options) { 

      // My Logic 
    }); 

    var menuSource = document.getElementById("myTemplate").innerHTML; 
    var menuTemplate = Handlebars.compile(menuSource); 
    document.getElementById("div1").innerHTML = menuTemplate(menuData); 
</script> 

</head> 

<body> 
    <form action="Hello" method="post"> 
      <input type="text" value="ajith" /> 
     <script id="myTemplate" type="text/x-handlebars-template"> 
     <table> 

     {{#eachByIdx components}} 
        // My Logic here    
     {{/eachByIdx}} 

     <tr> 
      <td> 
      <a href="" onclick="return popup(this.form)">Add New</a>     
    </td> 
     </tr>   
     </table>  
     </script> 
    </form> 
</body> 
</html> 

ответ

0

Не использовать относительный путь для загрузки JS файлы из JSP-файлов, так как JSP-файлы могут быть:

  • расположен по существу в любом месте, и
  • Может использоваться (например, включены) в других местах

Вместо этого следует использовать абсолютный р по отношению к вашему корню веб-контента, в идеале используя тег URL-is-JSP JSP, поэтому контекст предоставляется автоматически.

+0

@ Dave: Я попробовал абсолютный путь, а, как показано ниже. Но не повезло. Можете ли вы, пожалуйста, дать мне образец кода для тега URL-ish. Я довольно новичок в этом jsp и все. –

0
  1. Что касается абсолютного пути, попробуйте $ {pageContext.request.contextPath} /js/handlebars-v1.3.0.js
  2. Да, пожалуйста, переместите сценарии код на дно, вы пытаетесь использовать getElementById, но страница не закончила загрузку.

Пожалуйста, смотрите ниже образца:

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<script src="${pageContext.request.contextPath}/js/handlebars-v1.3.0.js"></script> 
</head> 

<body> 
    <form action="Hello" method="post"> 
     <input type="text" value="ajith" /> 
     <div id="div1"></div> 
    </form> 

<script id="myTemplate" type="text/x-handlebars-template"> 
    <table> 
     {{#eachByIdx components}} 
        // My Logic here 
     {{/eachByIdx}} 
     <tr> 
      <td> 
      <a href="" onclick="return popup(this.form)">Add New</a> 
      </td> 
     </tr>   
    </table>  
</script> 
<script type="text/javascript"> 
    Handlebars.registerHelper('eachByIdx', function(menuData, options) { 
      //My Logic 
    }); 

    var menuSource = document.getElementById("myTemplate").innerHTML; 
    var menuTemplate = Handlebars.compile(menuSource); 
    document.getElementById("div1").innerHTML = menuTemplate(menuTemplate); 
</script> 
</body> 
</html> 
Смежные вопросы