0

我怎样才能编写以下内容,以便我不需要这个广泛的列表,req.payload.reps + number并且req.payload.kilos + number只有一对,req.payload.reps - req.payload.kilos但它会根据传递给具有这些名称的模式的数据数量自动递增?

此外,如果我不使用计数器来增加字段的name属性,则和input的值将作为两个数组存储在数据库中。之后匹配相应的值会更容易,还是像我事先询问的那样设置模式更有意义?repskilos

所以有类似的东西req.payload.reps[i]。这样,当用户为这些输入字段发送的值少于 10 个时,我不会将空对象发布到数据库,并且用户可以通过维护模式格式发送任意数量的输入值。

hapijs在服务器端使用。

我的路由器功能:

var sendWorkout = {
    handler: function(req, reply){


      var d = new Date();
      var cd = d.getDate() + "-" + (d.getMonth()+1) + "-" + d.getFullYear();

      console.log(req.payload);

      // sets schema for workout
      // this needs to be the data from the form and then should be validated with joi!!!
      var workoutSchema = {
          // "personId": "personId", //to later be replaced with actual username
          "date": cd,
          "workout": [
              {
                "exercise": req.payload.exercise,
                "musclegroup": req.payload.musclegroup,
                "sets": [
                  {
                    "reps": req.payload.reps,
                    "kilos": req.payload.kilos
                  },
                  {
                    "reps": req.payload.reps1,
                    "kilos": req.payload.kilos1
                  },
                  {
                    "reps": req.payload.reps2,
                    "kilos": req.payload.kilos2
                  },
                  {
                    "reps": req.payload.reps3,
                    "kilos": req.payload.kilos3
                  },
                  {
                    "reps": req.payload.reps4,
                    "kilos": req.payload.kilos4
                  },
                  {
                    "reps": req.payload.reps5,
                    "kilos": req.payload.kilos5
                  },
                  {
                    "reps": req.payload.reps6,
                    "kilos": req.payload.kilos6
                  },
                  {
                    "reps": req.payload.reps7,
                    "kilos": req.payload.kilos7
                  },
                  {
                    "reps": req.payload.reps8,
                    "kilos": req.payload.kilos8
                  },
                  {
                    "reps": req.payload.reps9,
                    "kilos": req.payload.kilos9
                  },
                  {
                    "reps": req.payload.reps10,
                    "kilos": req.payload.kilos10
                  },
                ]
              }
          ]
      };


      // defines unique key for data
      var key = cd + req.payload.exercise;
      console.log(key);

      // adds payload to database
      db.add(key, workoutSchema, function(error, results){
          if (error) {
              console.log("Coushbase error: " + error);
              reply(error + "\n");
          }
          console.log(results);
          reply(workoutSchema);
      });
    }
};

我的 jQuery 为该input字段添加了一个计数器name

$(document).ready(function() {
  console.log('Document ready');

  var counter = 0;

  // function to add sets to specific exercise
  $('#add-set').on('click', function() {
    console.log ('Button add-set clicked');
    counter += 1;
    console.log(counter);

        var htmlSets = '<div class="sets">' +
            '<label for="reps" class="labels">Reps</label><input type="text" name="reps' + counter +'" class="reps-column" placeholder="How many reps?" />' +
            '<label for="kilos" class="labels">Kg\'s</label><input type="text" name="kilos' + counter +'" class="kilos-column" placeholder="How much Kg?" />' +
        '</div>';

    $('div.sets:last').append(htmlSets);
  });

});

还有我的 HTML:

      <div id="forms">
          <form id="workout-form" name="workout-form" action="newworkout/workout" method="POST" enctype="application/x-www-form-urlencoded">

              <div class="workouts">
                  <label for="exercise" class="labels"><strong>Exercise</strong></label> <input type="text" name="exercise" id="exercise" placeholder="Which exercise?" autofocus />
                  <label for="musclegroup" class="labels"><strong>Muscle-Group</strong></label> <input type="text" name="musclegroup" id="musclegroup" placeholder="Which muscle-group?" />

                  <div class="sets">
                      <label for="reps" class="labels">Reps</label> <input type="text" name="reps" class="reps-column" placeholder="How many reps?" />
                      <label for="kilos" class="labels">Kg's</label> <input type="text" name="kilos" class="kilos-column" placeholder="How much Kg?" />
                  </div>
                  <hr>
              </div>

              <button id="add-set"class="add-buttons" type="button"><i class="fa fa-plus-circle fa-2x"></i></button>
              <button id="submit-workout" type="submit"><strong>Save Workout</strong></button>
          </form>
      </div>

  </main>
4

1 回答 1

0

将您的 jQuery 更改为以下内容(注意输入名称上的方括号):

var htmlSets = '<div class="sets">' +
        '<label for="reps" class="labels">Reps</label><input type="text" name="reps[' + counter +']" class="reps-column" placeholder="How many reps?" />' +
        '<label for="kilos" class="labels">Kg\'s</label><input type="text" name="kilos[' + counter +']" class="kilos-column" placeholder="How much Kg?" />' +
    '</div>';

这样你发送两个数组,repskilos. 应该解决你的问题:)

于 2015-03-04T11:22:02.700 回答