提交选择表单项值 - 不工作

时间:2016-04-25 21:07:23

标签: javascript html forms sails.js

这是非常基本的东西,所以也许我对它视而不见,但是我无法让它发挥作用。

我有一个表单,该表单的一部分有一个Select项。我已经删除了内联JS,它看起来如下:

<select class="form-control selectpicker" id="restaurantChain" name="restaurantChain" data-live-search="true">
    <option value="null">Not a chain</option>
    <option value="1234">12345</option>
</select>

现在,我将此提交给一个捕获数据的函数,我将其注销,但是它不适用于select项,其他一切都很好:

var restaurantChain = req.param('restaurantChain');

我得到了undefined,但我无法弄明白为什么。这是我的完整代码:

表格

<form method="post" action="restaurant-management/manage">
   <input type="hidden" value="<%= restaurant.id %>" name="restaurantId" id="restaurantId"/>
   <td><input type="text" value="<%= restaurant.name %>" name="restaurantName" id="restaurantName" class="form-control"></input></td>
   <td><input type="text" value="<%= restaurant.location %>" name="restaurantLocation" id="restaurantLocation" class="form-control"></input></td>
   <td>
      <select class="form-control selectpicker" id="restaurantChain" name="restaurantChain" data-live-search="true">
         <option value="null">Not a chain</option>
         <% if(typeof chains != "undefined") { %>
         <% _.each(chains, function(chain){ %>
         <option value="<%= chain.id %>" <% if(restaurant.chain == chain.id) { %> selected <% } %> >
            <%= chain.name %>
         </option>
         <% }) %>
         <% } %>
      </select>
   </td>
   <td class="text-center"><input type="submit" class='btn btn-info btn-s' name="editButton" value="Edit"> <input type="submit" class="btn btn-danger btn-s" name="deleteButton" value="Delete"></td>
</form>

功能

manageRestaurant: function(req, res) {

  var restaurantName     = req.param('restaurantName');
  var restaurantId       = req.param('restaurantId');
  var restaurantLocation = req.param('restaurantLocation');
  var restaurantChain    = req.param('restaurantChain');
  var checkboxes         = req.param('checkboxes');

  console.log(restaurantName); //Works fine
  console.log(restaurantLocation); //Works fine
  console.log(restaurantChain); //Undefined....what?!
}

页面来源

      <tr>
        <form method="post" action="restaurant-management/manage">
          <input type="hidden" value="571c8ad57f18f8a441417a57" name="restaurantId" id="restaurantId"/>
          <td><input type="text" value="Nandos" name="restaurantName" id="restaurantName" class="form-control"></input></td>
          <td><input type="text" value="London - Oxford Street" name="restaurantLocation" id="restaurantLocation" class="form-control"></input></td>
          <td>
            <select class="form-control selectpicker" id="restaurantChain" name="restaurantChain" data-live-search="true">
              <option value="123">Not a chain</option>


                  <option value="571a0b7e09e2eff63befa5fa"  >
                    Nandos
                  </option>

                  <option value="571a0b8409e2eff63befa5fb"  >
                    McDonalds
                  </option>

                  <option value="571df9378fb28b8545ce4b23"  >
                    TGI Fridays
                  </option>

                  <option value="571dfb09f0e2af92456bc53f"  >
                    Subway
                  </option>


            </select>
          </td>
          <td class="text-center"><input type="submit" class='btn btn-info btn-s' name="editButton" value="Edit"> <input type="submit" class="btn btn-danger btn-s" name="deleteButton" value="Delete"></td>
        </form>
      </tr>

答案

如果您仍想使用表,而不是使用CSS重新设置页面以获得相同的结果,则可以使用Javascript函数提交表单数据。这将从页面上的元素中获取值,并发布它们。

0 个答案:

没有答案