Question

我在玉器中使用Express，并且已经为数据创建了一个表格视图。当我单击“编辑”时，它应在编辑页面的相应输入字段中显示数据（工厂，物料，货币等）。

数据的“表格视图”页面，

extends layout

block content
  h1(style='text-align:center')= title
  button(type='submit', onClick='nav()') Add a Material
  script.
    function nav() {
      window.location.href = '/addpage'
    }
    function passvalue(params) {
      console.log(params)
    }
  br
  br
  -var product = data
  div
  table.table.table-hover(border='1', style='width:100%')
    tr
        th Plant
        th Material
        th Currency
        th Rate
        th Options
    tbody
      each value in product
        tr
          td(style='text-align:center')= value.PLANT
          td(style='text-align:left')= value.MATERIAL
          td(style='text-align:left')= value.CURRENCY
          td(style='text-align:right')= value.RATE
          td(style='text-align:left')
            ul
                a(href = '/', 
                onClick = `javascript:alert("Plant :${value.PLANT}, Material : ${value.MATERIAL}, Customer : ${value.CUSTOMER}, Rate : ${value.RATE}, Currency : ${value.CURRENCY}, Price_Unit : ${value.PRICE_UNIT}, Cond_Unit : ${value.COND_UNIT}, Portal_User : ${value.PORTAL_USER}")`
                ) View              
                br
                a(href = '/editpage', onClick = `passvalue(${value})`) Edit
                br
                a(href = '/', onClick = 'javasript:alert("Delete functionality development is in-progress")') Delete

编辑页面以编辑所选数据，

extends layout

block content
  h1= title
  label(for='plant') Plant:
  input(placeholder = 'Plant Number', id = 'plant')
  br
  br
  div
    label(for='material') Material:
    input(placeholder = 'Material Name')
    br
    br
  div
    label(for='customer') Customer:
    input(placeholder = 'Customer Code')
    br
    br
  div
    label(for='rate') Rate:
    input(placeholder = 'Rate')
    br
    br
  div
    label(for='currency') Currency:
    input(placeholder = 'Currency')
    br
    br
  div
    label(for='price_unit') Price_Unit:
    input(placeholder = 'Price_Unit')
    br
    br
  div
    label(for='cond_unit') Cond_Unit:
    input(placeholder = 'Cond_Unit')
    br
    br
  div
    label(for='portal_user') Portal_User:
    input(placeholder = 'Portal_User')
    br
    br
  div
    button(type='submit') Save
    button(type='submit', onClick = 'nav()') Cancel
    script.
      function nav() {
        window.location.href='/'
      }

Table View page for data

Edit page to edit selected data

Answer 1

This tutorial是您的许多良好起点之一。

基本上，您需要为您的编辑页面设置一条路由，该路由将工厂的ID作为URL的一部分，然后使用它来检索该工厂的数据。将结果馈送到jade模板即可使其工作：

app.get('/plant/:id', function(req, res){

  // plant id is available here as req.params.id

  if(req.params.id){
    // fetch data for plant with this id
    res.render('edit-plant', data);
  } else {
    // no id given, must be a new plant
    res.render('edit-plant', {});
  }

});

然后，在列表页面上，只需将工厂ID添加到链接的href标记中即可：

each plant in plants
  a(href= '/plants/' + plant.id)= plant.name

Jade模板-如何将数据从“视图”页面传递到“编辑”页面

1 个答案: