2016-06-14 4 views
0

私はExpressJSアプリケーションを構築していて、コレクションに削除アイコンを追加して個々のアイテムを削除したいと考えています。expressJSビューでアイテムを削除する方法

私は少しこれを行う方法が混乱しています。私は特急ビュー内のアイコンにクリックイベントをバインドし、クリックされたときにサーバーへのAJAX呼び出しを行っていると考え

  • 一つの方法。

  • もう1つの方法は、アイコンの周りにフォームを作成することです。アイコンは、クリックするとフォームを送信するボタンになります。

私は2つのアプローチの自信を持っていないです、誰もがこのことは現時点では理解するのがより簡単ですので、私は第二の方法をお勧めします高速道路

答えて

0

行うためのエレガントな方法で考えています。

私は間違った方法で行った場合、削除ボタンが脆弱性またはセキュリティホールになる可能性があることを理解しています。削除ボタンです。 より安全な方法で簡単に行うには、セッション変数を使用する方法があります。 権限がない(ログインしていない)ユーザーは削除できません。そうであれば、サーバー上でセッションを開き、そのセッションのキーをユーザーに与えます。

セッションでは、ログインプロセスで与えたセッションキーを提供することで、サーバーとやり取りするユーザーに関するデータを安全に保存できます。

この手順では、ユーザーは文書を削除するためにボタンをクリックしますが、この文書を削除する権限を持つ必要があります。これは彼があなたに彼の身元を知らせるためにあなたに提供するセッションキーの時間です。彼の要求を削除するか拒否するかはあなた次第です。

上記のすべての単語は、コード内で何が起こるかの概念です。 私はログインコントローラのために2つのパート1の部分を書いて、ユーザの許可を与えます。もう1つは文書削除コントローラです。

ログイン:

if(var user = isUser(username, password){ 
    //open session 
    req.session.user_id = user._id 
} 

文書コントローラを削除します

if(req.session.user_id){ 
    //if true that means he is logged in authorized user 
    //you can also to check by his user_id if he has the privilege to delete the document 
    document.delete();//in mongoose model.remove(); 

}

この溶液は、任意の文書を削除するのセキュリティのためのものです。

0

あなたが求める結果を達成するには複数の方法があります。

  1. あなたはYourURL.com/item/delete/idを削除し、それにクリックイベントを添付したいアイテムのIDを持っているリンクを使用することができます。リンクがクリックされると、ハンドラはid queryパラメータを取得し、それを使ってAJAXコールをサーバに送信できます。あなたが言ったように

  2. また、あなたは基本的に1

上記ボトムラインと同じものである、ボタンを使用することができ、いくつかの人々は隠し要素を使用することができ、両方の方法はかなり標準的なものであり、 HTML要素は、 IDまたは値を格納できるほとんどのものですが、ほとんどの人も上記の方法を使用することがわかります。どのIMHOがかなり標準です。

以下は、どのように動作すべきかのスニペットです.JavaScriptライブラリを使用しているかどうかわかりませんので、Javascriptライブラリやフレームワークを使用していない場合はVanilla Javascriptでスクリプトを作成しています。あなたはJavascriptを処理する方法でブラウザの違いから得る多くの頭痛を軽減するのに役立ちます。

PS:あなたの質問にどのように答えられるかを説明するためのコードを含めてください。

var makeDeleteCall = function(e, id) { 
 
    e.preventDefault(); 
 
    console.log(id); 
 
    // Make AJAX Call here to server to delete item with the ID 
 
    //After call to remote server you can then update the DOM to remove the item 
 
    document.getElementById(id).remove(); 
 
}
<!-- Using Link --> 
 
<a href="#/delete/1" onclick="makeDeleteCall(event, 1);" id="1"> 
 
    Delete Item 
 
</a> 
 

 

 
<br/> 
 
<br/> 
 

 
<!-- Using a Button--> 
 
<button onclick="makeDeleteCall(event, 2);" id="2"> 
 
    Delete Button 
 
</button>

Link to JSFiddle

関連する問題