我正在使用ng-click提交一个包含id的表单。我也在使用jquery方法。如何让我的表单一键提交。我试图只使用ng-click提交完整的数据,但是在我使用jQuery之前我的表单数据没有提交。请帮我解决这个问题。谢谢
<div class="add-rule-container">
<div class="add-rule-form">
<form>
<table class="addRuleHolder bordered" >
<tbody>
<tr>
<td>Rule Name</td>
<td>
<input type="text" class="event name" ng-model="configuration.rule.name" readonly>
</td>
</tr>
<tr>
<td>Status</td>
<td>
<select class="browser-default event status" required>
<option ng-value="n.status">{{configuration.rule.status}}</option>
<option value="enabled">Enabled</option>
<option value="disabled">Disabled</option>
</select>
</tr>
<tr>
<td>Trigger Event</td>
<td>
<select class="browser-default event trigger" required>
<option ng-value="n.triggerOn">{{configuration.rule.triggerOn}}</option>
<option value="all">
All Conditions
</option>
<option value="any">
Any Conditions
</option>
</select>
</td>
</tr>
<tr>
<td>Relay State</td>
<td>
<select class="browser-default event relay state" required>
<option ng-value="n.onSuccess">{{configuration.rule.onSuccess}}</option>
<option value="1">On</option>
<option value="0">Off</option>
</select>
</td>
</tr>
</tbody>
</table>
<div class="condition-container">
<div class="condition z-depth-1" style="margin-bottom:20px">
<fieldset class='conditionHolder' ng-repeat="c in configuration.rule.conditions | limitTo:-30 ">
<legend>
<button class="btn-floating btn-large waves-effect waves-light cyan darken-2">{{$index+1}}</button>
</legend>
<table class="addRuleHolder ">
<table class="addRuleHolder">
<tbody>
<tr>
<td>Sensor</td>
<td>
<select class="browser-default event sensor" required>
<option ng-value="c.fact">{{c.fact}}</option>
<option value="s1">S1</option>
<option value="s2">S2</option>
</select>
</td>
</tr>
<tr>
<td>Condition</td>
<td>
<select class="browser-default event condition" required>
<option ng-value="c.operator">{{c.operator}}</option>
<option value="lessThan"><</option>
<option value="lessThanInclusive"><=</option>
<option value="greaterThan">></option>
<option value="greaterThanInclusive">>=</option>
</select>
</td>
</tr>
<tr>
<td>Threshold Value</td>
<td>
<input type="number" class="event threshold" ng-model="c.value" required>
</td>
</tr>
</tbody>
</table>
</fieldset>
</div>
</div>
<div class="rule-add-btn">
<button type="submit" class="waves-effect waves-light btn blue" ng-click="editData(configuration.rule._id)">Edit Rule</button>
</div>
</form>
</div>
</div>
这是我提交表单的控制器
$scope.editData = function (_id) {
jQuery(function () {
function editData(y) {
var obj = {
gid: $stateParams.gid,
uid: $stateParams.uid,
configuration: {
rule: {
_id:_id,
name: y.find(".name").val(),
status: y.find(".status option:selected").val(),
triggerOn: y.find(".trigger option:selected").val(),
onSuccess: y.find(".state option:selected").val(),
conditions: []
}
}
};
if (y.find(".conditionHolder").length) {
y.find(".conditionHolder").each(function (index, elem) {
var item = jQuery(elem);
obj.configuration.rule.conditions.push({
fact: item.find(".sensor option:selected").val(),
operator: item.find(".condition option:selected").val(),
value: parseInt(item.find(".threshold").val()),
});
});
}
return obj;
}
var myData = editData(jQuery(this));
$http.put('v1/relay/configuration/edit', myData)
.then(function (response) {
Materialize.toast("Rule Edited successfully", 4000)
$scope.configuration.rule = response.data;
console.log($scope.configuration.rule);
});
});
);
}