在Jive工具上使用此代码将数据发布到某些服务器。 但这没有发生。代码无法在firefox和IE中获得成功消息，但收到：
参考错误：未定义
$j。
由于一些jquery冲突。添加juery.noConflict()后，结果相同。
还有其他方法可以实现这一目标。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-validator/0.4.5/js/bootstrapvalidator.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js" type="text/javascript"></script>
</head>
<script>
$(document).ready(function() {
$('#contact_form').bootstrapValidator({
// To use feedback icons, ensure that you use Bootstrap v3.1.0 or later
feedbackIcons: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
name: {
validators: {
stringLength: {
min: 2,
},
notEmpty: {
message: 'Please enter your name'
}
}
},
email: {
validators: {
notEmpty: {
message: 'Please enter your email address'
},
emailAddress: {
message: 'Please enter a valid email address'
}
}
},
Function: {
validators: {
stringLength: {
min: 2,
},
notEmpty: {
message: 'Please supply Function'
}
}
},
RequestFor: {
validators: {
notEmpty: {
message: 'Please select request for'
}
}
},
RequestTitle: {
validators: {
stringLength: {
min: 1,
max: 100,
message:'Please enter at least 1 characters and no more than 100'
},
notEmpty: {
message: 'Please enter request title'
}
}
},
DescribeYourRequest: {
validators: {
stringLength: {
min: 1,
message:'Please enter at least 1 character'
},
notEmpty: {
message: 'Please describe your request'
}
}
}
}
});
});
</script>
<script>
$("#contact_form").submit(function(e)
{
// get form data and add to body
var body="some data";
var req = { some object };
req = JSON.stringify(req);
console.log(req);
$.ajax({ type:"POST",
url: "<<Some Url>>",
headers: { 'X-J-Token': window.parent._jive_auth_token },
contentType: "application/json",
data: req,
dataType: "json",
success: function(data, textStatus, jqXHR)
{
alert("Result: "+data.result+", Message: "+data.message);
}
});
});
</script>
<div class="container">
<fieldset>
<!-- Form Name -->
<form id="contact_form" >
<span class="text-center"><h2>My Form</h2></span>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label">Name<font color="red">*</font></label>
<div class="col-md-4 inputGroupContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
<input name="name" placeholder="Name" id="Name" class="form-control" type="text" required>
</div>
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label">E-Mail<font color="red">*</font></label>
<div class="col-md-4 inputGroupContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-envelope"></i></span>
<input name="email" placeholder="E-Mail Address" id="EmailId" class="form-control" type="text" required>
</div>
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label" >Function<font color="red">*</font></label>
<div class="col-md-4 inputGroupContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-pencil"></i></span>
<input name="Function" placeholder="Function" id="Function" class="form-control" type="text">
</div>
</div>
</div>
<!-- Select Basic -->
<div class="form-group">
<label class="col-md-4 control-label">Request For<font color="red">*</font></label>
<div class="col-md-4 selectContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span>
<select name="RequestFor" id="Requestfor" class="form-control selectpicker" >
<option value=" " >Please select Request For</option>
<option >a</option>
<option>b</option>
<option>c</option>
<option>d</option>
</select>
</div>
</div>
</div>
<!-- Button -->
<div class="form-group pull-right">
<label class="col-md-4 control-label"></label>
<div class="col-md-4">
<button type="submit" class="btn btn-primary" onclick="documentCreation()">Submit</button>
</div>
</div>
</fieldset>
</div>
</form>
</div><!-- /.container -->
</html>