Javascript 在通过Jade生成的HTML页面中单击按钮执行服务器端代码(node.js)

Javascript 在通过Jade生成的HTML页面中单击按钮执行服务器端代码(node.js),javascript,jquery,node.js,express,pug,Javascript,Jquery,Node.js,Express,Pug,我正在尝试开发一个web应用程序,我被困在一个点上,需要在单击按钮时执行一些服务器端代码(通过onClick事件处理程序而不是提交按钮。我学会了如何通过表单操作来路由流量)。我正在使用Node.js、Express和Jade。 谁能帮帮我吗。这是我当前的代码快照 我对app.js做了以下更改,将点击流量路由到此node.js函数 app.post('/overview/delete-uni', uniappController.deleteUniversity); 在相应的控制器文件中,我添加

我正在尝试开发一个web应用程序,我被困在一个点上,需要在单击按钮时执行一些服务器端代码(通过onClick事件处理程序而不是提交按钮。我学会了如何通过表单操作来路由流量)。我正在使用Node.js、Express和Jade。 谁能帮帮我吗。这是我当前的代码快照

我对app.js做了以下更改,将点击流量路由到此node.js函数

app.post('/overview/delete-uni', uniappController.deleteUniversity);
在相应的控制器文件中,我添加了删除代码

exports.deleteUniversity = function(req, res) {
  // Code logic
  // More code logic
  res.render('uniapp/university', {
  title: 'University'
  });
})

我的玉模板是这样的。在这里,当我单击
Update
按钮时,我需要执行
deleteUniversity
代码

extends ../layout

block content

  .mdl-layout.mdl-js-layout.mdl-color--grey-100
      main.mdl-layout__content
        .mdl-grid
          #user
          for application in user.applications
            form.form-card.form-horizontal(action='/overview/update-uni', method='POST')
              input(type='hidden', name='_csrf', value=_csrf)
              .mdl-card.mdl-shadow--2dp                    
                .mdl-card__supporting-text
                  textarea#sample5.mdl-textfield__input(type='text', rows='1', name='universityName', readonly)
                    if application.university.name
                      | #{application.university.name}
                  .mdl-textfield.mdl-js-textfield.mdl-textfield--floating-label
                    textarea#sample5.mdl-textfield__input(type='text', rows='1', name='universityDescription')
                      if application.university.description
                        | #{application.university.description}
                    label.mdl-textfield__label(for='sample5') Description of university...
                .mdl-card__actions.mdl-card--border
                  button.mdl-button.mdl-button--colored.mdl-js-button.mdl-js-ripple-effect(type='submit')
                    | Update
                .mdl-card__menu
                  button.mdl-button.mdl-button--icon.mdl-js-button.mdl-js-ripple-effect
                    i.material-icons delete

注:我是一个彻头彻尾的noob w.r.t Jade,因此如果这是一件小事,请原谅我

创建一个javascript文件deleteUni.js(或任何您想调用的文件),并将其添加到模板脚本(src=“/Scripts/deleteUni.js”)

//content of name.js
$(function(){

    var isButtonDisabled = false;
    $('#buttonId').click(function($event){

        //this part handles multiple button clicks by the user, trust me on this one, it's really important to have it
        if (isButtonDisabled){
            return $event.preventDefault();
        }
        isButtonDisabled = true;

        var formData = $('#formId').serialize(); //serialize form to a variable

        $.post( "/overview/delete-uni",formData)
         .success(function(response){
            //handle response

         })
         .fail(function(error){
            //handle error
         })
         .always(function(){
            //always execute
            .
            .
            .
            isButtonDisabled = false;
         });

        return $event.preventDefault();
    })  
});