0

私は私のページにこれを持っています:

$('.editable-question').editable('{{my_identifier}}/form_item/edit',{
                    //loadurl: 'example/restful/url/in/app/{{???????????????}}',
                    type   : 'textarea',
                    cancel : 'Cancel',
                    submit : 'OK',                  
                    name   : 'edit_this',
                  });

jinjaテンプレート内のFlaskアプリケーションでjeditableを使用しています。問題は、フォーマットされていないマークダウンテキストを取得するために「loadurl」に情報を渡す必要があることですが、cssからそのloadurlステートメントに何かを取得する方法がわかりません。

<div id="f4d629f9f0" class="editable-question" style="">
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit</p>
</div>

この場合、cssidを{{????????}}に入れたいと思います。これは通常どのように行われますか?よくある質問のようですが、まだ答えが出ていません。私が思うにもっとrtfm'ing。

それほど差し迫った問題は、ある時点でjinjaテンプレートからjsを削除する必要があるということですが、必要な変数をページに入れてからjsに入れる方法がわかりません。隠された要素やjsが必要に応じて変数を取得するURL参照。

編集:

私は次のようなものになってしまいました:

$('.editable-question').editable('/form_item/edit',{
                    id: 'my_id',
                    loadurl: 'node',
                    type   : 'textarea',
                    cancel : 'Cancel',
                    submit : 'OK',                  
                    name   : 'edit_this',
                  });

そしてmy_idはjeditableによってurlparam(?my_id = {{css id}})として渡されますが、それは汚い感じがします。私は安らかなurlを好みますが、それで先に進む必要があります。

4

1 に答える 1

0

あなたの質問が正しいかどうかわかりませんか?しかし、私は3つの答えを思いつきました:

1) HTML テンプレートに js を含めると、jinja は HTML と js をレンダリングできます。jinja の場合、テンプレート HTML、TXT、CSS、または JS に含まれるデータの種類は関係ありません。

2) HTML テンプレートの非表示フィールドに変数を渡し、DOM 操作 (jquery など) を使用して、DOM から変数を取得できます。

3) 変数を持つ関数のみを含む小さな JavaScript を HTML に含めることができます。外部 JavaScript ファイルでは、これらの関数にアクセスして変数を取得できます。

アイデアを得るために、codemirror エディターを構成し、HTML とインライン js で jinja を使用するための HTML テンプレートの一部を次に示します。

<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="/jinjacms/static/jinjacms.css"> 
<link type="text/css" rel="stylesheet" href="/codemirror/lib/codemirror.css">
<link type="text/css" rel="stylesheet" href="/codemirror/theme/rubyblue.css">
<script type="text/javascript" src="/codemirror/lib/codemirror.js"></script>
<script type="text/javascript">
function editor(id)
{
        CodeMirror.fromTextArea(document.getElementById(id), {
        theme: "rubyblue", 
        lineNumbers: true, 
        mode: {{ mode }},
        {% if readonly %}readOnly: "nocursor",{% endif %} 
        tabSize: 4,
        indentUnit: 4,
        indentWithTabs: true,
        tabMode: "shift"
      });
}
</script>
<style>.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}</style>
<title>{{ title }}</title>
</head>
<body onload="editor('text_data');">
于 2012-11-21T16:22:32.697 に答える