0

ajaxを使用してフォームを送信し、応答データを使用してカラーボックスを開きます。

$("#submitB").click(function () {
    $.post("/previewproposal", $("#proposal-form").serialize(), function(data){$.colorbox({html:data});}, "html");
});

レンダリングされたhtmlは次のようになります。

<script type="text/javascript">
    $(document).ready(function(){

        function plotData()
        {
            var dataArray = ...;
            var options = ...;

            $.plot($("#placeholder"), dataArray, options);
        }

        plotData();
    });
</script>

<div id="placeholder" style="float:left;margin:0;font-size:8pt;width:540px;height:180px;"></div>

動的に生成されるdivの1つは、Flotプロットプレースホルダーです。現在、次のエラーが発生しています。

uncaught exception: Invalid dimensions for plot, width = null, height = null

Flotプロット関数が機能するには、プロットプレースホルダーdivの幅と高さが必要です。だから私は、プロット関数がバインド/呼び出されているときに、プロットプレースホルダーdivがDOMにロードされていないと思いますか？多くのグーグルとこれに近い質問を見つけた後、私はこれを機能させる方法の例を見つけることができませんでした。ここでトラブルシューティングするにはどうすればよいですか？前もって感謝します。

4

1 に答える 1

0

ajax を同期させる必要がありますが、ラッパー $.post() では不可能です。したがって、次のように変更します。

$.ajax({
  type: "POST",
  async:false,
  url: "/previewproposal",
  data: $("#proposal-form").serialize(),
  success: function(data){
         $.colorbox({html:data});
  },
  dataType: 'html'
});

//you can call plotData() here...
于 2013-02-28T17:40:42.790 に答える