根据select选项创建动态JSON

Question

我有这种模态视图：

<div class="modal fade" id ="myModal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">Delta Rom insert missed entries</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal">
                    <div class="form-group">
                        <label class="col-sm-2 control-label">Event:</label>
                        <div class="col-sm-10">
                            <select id="eventData" name="type" data-placeholder="Select"
                                    class="form-control chosen-select">
                                <option value="Harvest">
                                    Harvest Product Machine
                                </option>
                                <option value="Tara">
                                    Tara Machine
                                </option>
                            </select>
                        </div>
                    </div>
                    <div id ="producttab" class="form-group">
                        <label class="col-sm-2 control-label">Product:</label>
                        <div class="col-sm-10">
                            <select name="harvest" id ="harvestData" data-placeholder="Select"
                                    class="form-control chosen-select">
                                <?php
                                foreach ($this->datamodal['products'] as $value) {
                                    echo '<option value = "' . $value->name . '">' . $value->name . '</option>';
                                }
                                ?>
                            </select>    
                        </div>
                    </div>
                    <div id ="tabmachines" class="form-group">
                        <label class="col-sm-2 control-label">Machine:</label>
                        <div class="col-sm-10">
                            <select name="machine" id ="machineData" data-placeholder="Select"
                                    class="form-control chosen-select">
                                <?php
                                foreach ($this->datamodal['machines'] as $value) {
                                    echo '<option value = "' . $value->name . '">' . $value->name . '</option>';
                                }
                                ?>    
                            </select>  
                        </div>
                    </div>
                    <div id="impuritytab" class="form-group">
                        <label class="col-sm-2 control-label">Impurity:</label> 
                        <div class="col-sm-10">
                            <input name="impurities" type="text" class="form-control" id="inputimpuritiesData" 
                                   placeholder="Impurities">    
                        </div>
                    </div>
                    <div id ="humiditytab" class="form-group">
                        <label class="col-sm-2 control-label">Humidity:</label>
                        <div class="col-sm-10">
                            <input name="humidity" type="text" class="form-control" id="humidityAData" 
                                   placeholder="Humidity">
                        </div>    
                    </div>  
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button id="saveModal" type="button" value="submit" class="btn btn-primary">Save changes</button>
            </div>
        </div>
    </div>
</div>

我有两种类型的活动，有价值的Harvest或Tara，根据选择的事件，我会显示一些特定的div：

$('#eventData').change(function() {
    opt = $(this).val();
    if (opt=="Tara") {
    $("#producttab").hide();
    $("#impuritytab").hide();
    $("#humiditytab").hide();
    }else if (opt == "Harvest") {
    $("#producttab").show();
    $("#impuritytab").show();
    $("#humiditytab").show();
    }
});

我有一个提交该表单的ajax：

function onAddMissedEntryInfoClicked(entryId) {
var currentEntryId = entryId;
$('#myModal').modal('show');  //this load modal view
$("#saveModal").unbind( "click");
$('#saveModal').bind('click', function(){
    var event = $('#eventData').val();
    var product = $('#harvestData').val();
    var machine = $('#machineData').val();
    var impurities = $("#inputimpuritiesData").val();
    var humidity = $("#humidityData").val();
    var dataJson = {
        "eventid":currentEntryId,
        "event": event,
        "product": product,
        "machine": machine,
        "impurities": impurities,
        "humidity":humidity

    };
    $.ajax({
        type: 'POST',
        url: "Monitor/thisUpdate",
        data: dataJson,
        success: function (data) {
            console.log(data);
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert(textStatus);
        }
    });
         $('#myModal').modal('hide');

 });

 }

我的问题是，当我在机器上选项时，我只会看到tabmachines id字段（这很好），但是当我提交时，我将发送所有表单值，包括我在jQuery中隐藏的字段。我想只在select选项上发送表单，在我的情况下只发送机器值。如何以动态方式制作我的ajax数据？谢谢！

Answer 1

您可以在onAddMissedEntryInfoClicked中添加if子句，并根据事件数据创建不同的json对象。

if (event==="Harvest") {
   var dataJson = {
    "eventid":currentEntryId,
    "event": event,
    "machine": machine
   };
}
else if (event==="Tara") {
  var dataJson = {
    "eventid":currentEntryId,
    "event": event,
    "product": product
    "impurities": impurities,
    "humidity":humidity
   };
}