2017-07-13 14 views
1

これらのコードを別のプロジェクトで再利用していますが、これは機能していないようです。私はMongooseでExpressを使用しており、大学のコースの詳細のリストを保存しています。これがスキーマです。Ajax DELETEリクエストがリストの最初の項目のみを削除しているようです

exports = module.exports = function(app, mongoose) { 
 
    var moduleSchema = new mongoose.Schema({ 
 
    pivot: { type: String, default: '' }, 
 
    module_name: { type: String, required:true}, 
 
    module_code: {type: String, required: true}, 
 
    description: {type: String} 
 
    }); 
 
    moduleSchema.plugin(require('./plugins/pagedFind')); 
 
    moduleSchema.index({ pivot: 1 }); 
 
    moduleSchema.index({ module_name: 1 }); 
 
    moduleSchema.index({ module_code: 1 }); 
 
    moduleSchema.index({ description: 1 }); 
 
    moduleSchema.index({ search: 1 }); 
 
    moduleSchema.set('autoIndex', (app.get('env') === 'development')); 
 
    app.db.model('Module', moduleSchema); 
 
};

削除要求は、このようにルータを介して行われます

app.delete('/modules/delete/:id', require('./views/modules/index').delete);

はその後./views/modules/indexに私が持っています書き込まれた「削除」機能:

exports.delete = function(req, res){ 
 
    var workflow = req.app.utility.workflow(req, res); 
 

 
    workflow.on('validate', function() { 
 
    workflow.emit('deleteModule'); 
 
    }); 
 

 
    workflow.on('deleteModule', function(){ 
 
    req.app.db.models.Module.findOneAndRemove({_id: req.params.id}, function(err){ 
 
     if(err){ 
 
     return workflow.emit('exception', err); 
 
     } 
 
     req.flash('success', 'Module Deleted!'); 
 
     res.redirect('/modules/'); 
 
    }); 
 
    }); 
 
    workflow.emit('validate'); 
 

 
};

だから、実行する機能のための私のようなAJAX呼び出しを行う必要があります。

$(document).ready(function(){ 
 
\t $("#deleteModule").on('click', function(e){ 
 
\t \t e.preventDefault(); 
 
\t \t var deleteId = $('#deleteModule').data('delete'); 
 
\t \t $.ajax({ 
 
\t \t \t url: '/modules/delete/'+ deleteId, 
 
\t \t \t type:'delete', 
 
\t \t \t success: function(result){ 
 
\t \t \t \t console.log(result); 
 
\t \t \t }, 
 
     error: function(error){ 
 
     console.log(error); 
 
     } 
 
\t \t }); 
 
\t \t window.location = '/modules/'; 
 
\t }); 
 
});

そして、ここでは、リストを表示するためのヒスイコードですのアイテム:

ul.list-group 
 
    each module, i in data 
 
     li.list-group-item 
 
     strong #{module.module_code} - #{module.module_name} 
 
     hr 
 
     p #{module.description} 
 
     a(href='/modules/edit/#{module._id}', class='btn btn-primary') Edit 
 
     a(id='deleteModule', data-delete='#{module._id}', class='btn btn-danger pull-right', href="#") Delete

すべてがその今、私は唯一のUIを通じてページの一番上のアイテムを削除することができ、他の削除ボタンをクリックするとトップに私をリダイレクトし、何も起こらない以外に動作するように見えます。

答えて

1
idとして

は、HTMLページで一意でなければなりませんので、代わりにidのクラスを使用して、それを削除機能をバインドするように、

// use .deleteModule instead of #deleteModule 
$(".deleteModule").on('click', function(e){ 
    e.preventDefault(); 
    var deleteId = $(this).data('delete'); // here use this instead of using id #deleteModule 
    $.ajax({ 
     url: '/modules/delete/'+ deleteId, 
     type:'delete', 
     success: function(result){ 
      console.log(result); 
     }, 
     error: function(error){ 
      console.log(error); 
     } 
    }); 
    window.location = '/modules/'; 
}); 

そしてHTMLテンプレートで

ul.list-group 
    each module, i in data 
     li.list-group-item 
     strong #{module.module_code} - #{module.module_name} 
     hr 
     p #{module.description} 
     a(href='/modules/edit/#{module._id}', class='btn btn-primary') Edit 
     a(id='deleteModule', data-delete='#{module._id}', class='btn btn-danger pull-right deleteModule', href="#") Delete 
、のようなクラス deleteModuleを追加
関連する問題