2017-09-07 15 views
2

私はサブステップを持つ登録プロセスを持っており、管理を容易にするためにこれらのサブステップのための個別のHTMLページを持っています。今私はコンテナである "ベースページ"を持っています。次のdivはサブページをロードする場所です。Thymeleafオブジェクトをベースページからajax生成ページに渡すにはどうすればいいですか?

<div id="substeps" th:object="${stepFourForm}"> 
</div> 

と私はどのようにロードされたサブステップ・ページは、ベースページのstepFourFormオブジェクトを取得することができアヤックス

$('#substeps').html(data); 

を使用してサブステップをロードしますか?

答えて

1

サブセクションページをロードする前に、divコンテンツを削除する必要があります。また、タイムリーフフラグメントを使用してサブコンテンツを読み込むこともできます。

$.ajax({ 
      type: "GET", 
      url: "/example-url", 
      success: function(data){ 
      $('#substeps').html(''); 
      $('#substeps').html(data); 

      } 
     }) 

コントローラコード:

@RequestMapping("/example-url") 
    public ModelAndView example(){ 

     ModelAndView view = new ModelAndView("substep1 :: content"); 
     return view; 
} 

例フラグメントHTML名substep1

<!DOCTYPE html> 
<html lang="en" xmlns:th="http://www.thymeleaf.org" 
     xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" 
     xmlns:dt="http://www.thymeleaf.org/dandelion/datatables" 

> 
<head> 
    <meta charset="UTF-8"/> 
    <title>Title</title> 

</head> 
<body> 
    <div th:fragment="content"> 

    --some content 
    </div> 
</body> 
</html> 
関連する問題