1

ユーザーがルートによって呼び出された請求書をプレビューしたいときに、関数でフォームの検証を行っています。

routes: {
        "new"                   : "newInvoice",
        "new/:assignmentid"     : "newInvoiceAssignment",
        "edit/:invoiceid"       : "editInvoice",
        "preview/:invoiceid"    : "previewInvoice",
        "preview"               : "preview",
        "delete/:invoiceid"     : "deleteInvoiceModal",
        "whyCant"               : "whyCant",
        "whatsThis"             : "whatsThis"
    },

そして、これがフォーム上の私の2つのボタン（実際には、ボタンとhref）です。

<div class="span8 alignRight">
    <button id="saveInvoiceDraft" type="submit" class="btn btn-warning">Save Draft</button>
    <a id="previewInvoice" class="btn btn-primary">Preview &amp; Send</a>
</div>

この請求書が作成されると、タグのURLは次のように設定されます。

var url = '#preview';
$('#previewInvoice').attr('href',url);

最後に、[プレビューと送信]ボタンをクリックすると、以下のpreviewInvoice（invoiceid）関数が実行され、欠落している1つのフォームフィールドが適切にキャッチされ、エラーメッセージが表示されます。その時点で、フォームフィールドに入力しても、そのボタンは無効になり、応答しなくなります。ただし、[ドラフトの保存]ボタンは完全に機能し、previewInvoice（）関数と同じコードを模倣します。

これを行うにはおそらくもっと良い方法があることを私は知っていますが、私はそれが私が継承したアプリの別のセクションで行われた方法に従っていました。実際、これを入力していると、sendDraft（）関数が機能し、そのボタンが機能し、previewInvoice（）関数が機能しないため、hrefであるという事実が関係している可能性があります。

function previewInvoice(invoiceid) {
    var invoice = new Invoice({"invoiceid": invoiceid});
    invoice.set({"invoiceid": invoiceid,"invoicestatus": "draft"});
    formGetter(invoice);
    validateInvoiceForm(invoice);

    if (window.errors.length == 0) {
        //business logic here

        if (window.panel == undefined) {
            // business logic here
        }
        else {
            //save business logic here
        }
    }
    else {
        showInvoiceErrors();
    }
}

ボタンが応答しなくなった理由はありますか？コンソールにエラーが表示されません。別のフォーム要素の値を表示するために関数内にconsol.logを追加しました。これはコンソールに初めて表示されますが、データを変更してもう一度ボタンをクリックすると、そのログは更新されません。それがただ発砲していないというもう一つの手がかりです。

4

3 に答える 3

1

Backbone.Historyイベントをリッスンしてhashchange、ルートへのナビゲーションをトリガーします。最初にpreviewInvoiceボタンをクリックすると、URL ハッシュ フラグメントが に設定され#preview、一致するルートがトリガーされます。

同じボタンを 2 回目にクリックすると、ハッシュは実際には変更されないため、ルーターはそれをキャッチしません。

この問題に対する適切な解決策を推奨するのに苦労しています。router.navigate("preview", {trigger:true});通常、クリック イベントをキャッチして手動で呼び出すことをお勧めします。ただし、コード サンプルに基づくと、アプリケーションは を中心に構築されているように見え、ほとんどのバックボーン アプリケーションで期待されるような DOM イベント処理Routerのレイヤーはありません。View

ルーター レベルでは、これを解決するのは少し難しいです。ルートが実行されたrouter.navigate後にダミーのハッシュを設定するために使用できます。previewこれにより、リンクがhashchange2 回目にもトリガーされます。残念ながら、これはpreviewページがブックマーク可能ではないことを意味し、pushState を使用していないため、不要な履歴エントリが残ることになります。

残念ながら、この問題は (上で概説したように) ハッキーな修正または大規模なリファクタリングで解決する必要があります。

于 2013-02-05T20:57:41.420 に答える
1

それ以外の

var url = '#プレビュー';

$('#previewInvoice').attr('href',url);

これを試して

var date = new Date();

var url = '#preview?date:' + 日付 ;

$('#previewInvoice').attr('href',url);

したがって、新しいリクエストが生成されるたびに、これで問題が解決します。

于 2014-02-04T12:48:13.267 に答える