Smoothstate.js和Django - 表單POST僅在第二次點擊時觸發

我正在嘗試將Smoothstate.js集成到我的Django項目中。我使用的是來自smoothstate.js github網站的js代碼片段。Smoothstate.js和Django - 表單POST僅在第二次點擊時觸發

$(function(){ 
    'use strict'; 
    var options = { 
    prefetch: true, 
    cacheLength: 2, 
    onStart: { 
     duration: 250, // Duration of our animation 
     render: function ($container) { 
     // Add your CSS animation reversing class 
     $container.addClass('is-exiting'); 

     // Restart your animation 
     smoothState.restartCSSAnimations(); 
     } 
    }, 
    onReady: { 
     duration: 0, 
     render: function ($container, $newContent) { 
     // Remove your CSS animation reversing class 
     $container.removeClass('is-exiting'); 

     // Inject the new content 
     $container.html($newContent); 

     } 
    } 
    }, 
    smoothState = $('#main').smoothState(options).data('smoothState'); 
});

我的模板看起來像這樣（我簡化它這個問題）：

<head> 
{% load static %} 
<script src="{% static 'js/vendor/jquery.js' %}"></script> 
<script src="{% static 'js/vendor/what-input.js' %}"></script> 
<script src="{% static 'js/vendor/foundation.js' %}"></script> 
<link rel="stylesheet" href="{% static 'css/foundation.css' %}"> 
<link rel="stylesheet" type="text/css" href="{% static 'css/style.css' %}" /> 
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> 
</head> 
<body> 
    <div id="main" class="m-scene"> 
     <!--...--> 
     <div class="row expanded collapse"> 
      <div class="scene_element scene_element--fadeinright large-12 columns"> 
       <a href="{% url 'transition' %}">test</a> 
       <form action="{% url 'transition' %}" method='POST'> 
        {% csrf_token %} 
        {{form}} 
        <input type="submit" class="button green" value="join"></input> 
       </form> 
      </div> 
     </div> 
    </div> 


    <script src="{% static 'js/jquery.smoothState.js' %}"></script> 
    <script src="{% static 'js/initSmoothState.js' %}"></script> 
</body>

當我點擊一個鏈接Smoothstate.js就像預期。但是當我提交表單時，它不會發送帖子，只會觸發動畫。當我再次單擊它時，它會發送POST並按照它應該的方式工作。

任何想法？

編輯

我發現在smoothstate.js這兩個問題： Issue #189和Issue #231

兩者都是這個問題，如果一個form POST action指向same URI的POST永遠發送。當我將表單緩存設置爲true時，我可以重新創建此行爲。

當我將它設置爲false和點POST action到different URI的POST將被送到像它應該是。將它設置爲same URI而沒有form caching會使我回到原來的問題。

這是Smoothstate.js中的錯誤嗎？我看不到這應該來自django。

來源

2016-10-01 LonnyT

我對smoothstate.js github page提出了同樣的問題。它看起來像唯一的解決方案是黑名單的形式。

$('#main').smoothState({ blacklist: '.no-smoothState' }); 

<form class="no-smoothState"> 
    ... 
</form>

來源

2017-01-11 01:49:03 LonnyT

Smoothstate.js和Django - 表單POST僅在第二次點擊時觸發

回答

相關問題