Функция загрузки jquery не вызывает весенний загрузочный контроллер для замены фрагмента шаблона тимелина - PullRequest
Новая
       14

Функция загрузки jquery не вызывает весенний загрузочный контроллер для замены фрагмента шаблона тимелина

0 голосов
/ 04 июля 2018

Я пытаюсь загрузить контент в следующий фрагмент. Я подтвердил, что этот фрагмент работает, когда я делаю простое сопоставление с HTML-шаблоном. 

<div id="fbtresult" th:if="${not #lists.isEmpty(fbts)}" th:fragment="fbtList">
    <h2>Frequent Bought Together List</h2>
    <table class="table table-striped">
        <tr>
            <th>Id</th>
            <th>Main Product Id</th>
            <th>FBT 1 Product ID </th>
            <th>FBT 2 Product ID</th>
            <th>BSR</th>
            <th>View</th>
        </tr>
        <tr th:each="fbt : ${fbts}">
            <td th:text="${fbt.id}"><a href="/fbt/${fbt.id}">Id</a></td>
            <td th:text="${fbt?.mainProduct?.asin}">main product asin</td>
            <td th:text="${fbt.sproductFbt1 != null} ? ${fbt.sproductFbt1.asin} : ''">product fbt1 asin</span>
            <td th:text="${fbt.sproductFbt2 != null} ? ${fbt.sproductFbt2.asin} : ''">product fbt2 asin</span>
            <td th:text="${fbt.bsr}">bsr</td>        
            <td><a th:href="${ '/fbt/' + fbt.id}">View</a></td>
        </tr>       
    </table>
</div>

Однако я пытаюсь использовать следующий оператор загрузки запроса, который находится в функции щелчка canvasjs. Я подтвердил, что jquery загружается, и консоль будет регистрировать URL-адрес при щелчке диаграммы canvasjs. 

                    click: function (e) {
                        var asin = /*[[${asin}]]*/ 'null';
                        var url = "/FBTChartfbtrequest?fbt=2&asin=" + asin + "&collectdate=" + e.dataPoint.x;
                        console.log(url);
                        $("#fbtresult").load(url);
                    },

Однако следующий контроллер не выполняется $ ("# fbtresult"). Load (url); что ясно из журнала. 

    @GetMapping(value = "/FBTChartfbtrequest")
        public String FBTChartfbtrequest(@RequestParam("fbt") String fbt,
                @RequestParam("asin") String asin, @RequestParam("collectdate") String collectdate, Model model) {
            System.out.println("ZZZZ requestFBTCHar with asin " + asin + " and collectdate " + collectdate);

...
                    model.addAttribute("fbts", fbtService.findByASINInFBT1andDateRange(asin, convertUtilToSql(date), convertUtilToSql(date)));
....
            return "results :: fbtList";
        }

Я подтвердил, что могу загрузить новую страницу с помощью / FBTChartfbtrequest? Fbt = 2 & asin = "+ asin +" & collectdate = "+ e.dataPoint.x; URL-адреса при выполнении перенаправления с помощью window.location.href = URL;

my pom.xml 

<dependencies>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-data-jpa</artifactId>
    </dependency>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-data-rest</artifactId>
    </dependency>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-thymeleaf</artifactId>
    </dependency>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-web</artifactId>
    </dependency>
    <dependency>
        <groupId>org.webjars</groupId>
        <artifactId>bootstrap</artifactId>
        <version>3.3.4</version>
    </dependency>
    <dependency>
        <groupId>org.webjars</groupId>
        <artifactId>jquery</artifactId>
        <version>3.1.0</version>
    </dependency>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-devtools</artifactId>
        <scope>runtime</scope>
    </dependency>
    <dependency>
        <groupId>mysql</groupId>
        <artifactId>mysql-connector-java</artifactId>
        <scope>runtime</scope>
    </dependency>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-security</artifactId>
    </dependency>

    <dependency>
        <groupId>org.springframework.security</groupId>
        <artifactId>spring-security-test</artifactId>
        <scope>test</scope>
    </dependency>
</dependencies>

http://localhost:8086/FBTMetricsRequest отображается на вкладке сети еще до того, как я нажму на график, и нажатие на график не изменит вид сети. Graph and network tab

Есть идеи, почему функция загрузки jquery не вызывает функцию контроллера?

Ответы [ 2 ]

0 голосов
/ 06 июля 2018

Оказывается, что функция загрузки должна быть настроена следующим образом, чтобы использовать логику фрагментов 

var url = "/FBTChartfbtrequest?";
$('#fbtresult').load(url, "fbt=1&asin=" + asin + "&collectdate=" + e.dataPoint.x);
0 голосов
/ 04 июля 2018

Решение Ajax Centric выглядит следующим образом. Я все же хотел бы запустить шаблонно-ориентированную версию. 

$.ajax({
    url: url,
    method: "GET",
    success: function (res) {
        $("#fbtresult").html(res);
    },
    fail: function (err) {
        console.log(err);
    }

});

Со следующей настройкой контроллера 

@GetMapping(value = "/FBTChartfbtrequest")
public String FBTChartfbtrequest(@RequestParam("fbt") String fbt,
@RequestParam("asin") String asin, @RequestParam("collectdate") String collectdate, Model model) {
    model.addAttribute("fbts", fbtService.findByASINInFBT1andDateRange(asin, convertUtilToSql(date), convertUtilToSql(date)));
    return "fbtList";
}

И HTML Модификация 

<div id="fbtresult">
     <!-- Dynamic content using ajax -->
</div>

Это не так желательно, как возможность ссылаться на объекты, например, для создания новых ссылок.

Id основной продукт asin продукт fbt1 asin продукт fbt2 asin BSR
Посмотреть

Полагаю, я могу сгенерировать html в java-приложении, содержащем эти ссылки. Я предполагаю, что предпочитаю создавать динамический HTML в представлении шаблона.

...