在我的JSP页面中,我创建了一个表单,
<form class="form-horizontal" id="genericDatabaseLoad" name="genericDatabaseLoad"
action="genericDatabaseLoad" method="post" onsubmit="validateDBFom()">
<fieldset>
<input type="radio" name="connectionType" value="jdbcConnection"> <b><s:text name="global.genericdb_jdbc_connection" /></b>
<div class="dbConnection" id="jdbcConnection" style="display: none; position: relative; left: 30px;">
<div class="control-group">
<label class="control-label input-label" for="hostname"><s:text name="global.genericdb_hostname" /> :
<span class="requiredField"> * </span>
</label>
<div class="controls">
<input type="text" class="inputstyle" id="dbHostname" name="hostname" placeholder="<s:text name="global.genericdb_hostname" />" required="required" />
</div>
</div>
<div class="control-group">
<label class="control-label input-label" for="port"><s:text name="global.genericdb_port" /> :
<span class="requiredField"> * </span>
</label>
<div class="controls">
<input type="text" class="inputstyle" name="port" placeholder="<s:text name="global.genericdb_port" />" required="required" />
</div>
</div>
<div class="control-group">
<label class="control-label input-label" for="dbname"><s:text name="global.genericdb_databasename" />:</label>
<div class="controls">
<input type="text" class="inputstyle" name="dbname" placeholder="<s:text name="global.genericdb_databasename" />"
required="required" />
</div>
</div>
<div class="control-group">
<label class="control-label input-label" for="username"><s:text name="global.genericdb_username" /> :
<span class="requiredField"> * </span>
</label>
<div class="controls">
<input type="text" class="inputstyle" name="username" placeholder="<s:text name="global.genericdb_username" />" required="required" />
<label class="input-tip"><s:text name="global.genericdb_username_info" /></label>
</div>
</div>
<div class="control-group">
<label class="control-label input-label" for="password"><s:text name="global.genericdb_password" />:</label>
<div class="controls">
<input type="password" class="inputstyle" name="password" placeholder="<s:text name="global.genericdb_password" />" />
<label class="input-tip"><s:text name="global.genericdb_password_info" /></label>
</div>
</div>
</div>
<input type="radio" name="connectionType" value="jndiConnection"> <b><s:text name="global.genericdb_jndi_connection" /></b>
<div class="dbConnection" id="jndiConnection" style="display: none; position: relative; left: 30px;">
<div class="control-group">
<label class="control-label input-label" for="jndidbType"><s:text name="global.genericdb_jndi_databse" />:</label>
<div class="controls">
<select id="jndidbType" class="inputstyle" name="jndidbType">
<option value="oracle">Oracle</option>
<option value="sybase">Sybase</option>
<option value="mssql">MS SQL</option>
<option value="mysql">MySQL</option>
<option value="other">Other</option>
</select>
</div>
</div>
<div class="control-group">
<label class="control-label input-label" for="jndiConnectionString"><s:text name="global.genericdb_jndi_connection_string" />:</label>
<div class="controls">
<input type="text" class="inputstyle" name="jndiConnectionString"
placeholder="<s:text name="global.genericdb_jndi_connection_string" />" />
</div>
</div>
</div>
<div class="control-group" style="position: relative; top: 15px; left: 30px;">
<label class="control-label input-label" for="query"><s:text name="global.genericdb_query" /> :
<span class="requiredField"> * </span>
</label>
<div class="controls">
<textarea name="query" rows="4" placeholder="<s:text name="global.genericdb_query" />"
required="required" ></textarea>
<label class="input-tip"><s:text name="global.genericdb_query_info" /></label>
</div>
</div>
</fieldset>
</form>
正如您所看到表单中没有“提交”按钮,我在表单外添加提交按钮。
<button type="submit" id="submitbtn" class="btn btn-primary inputstyle" onclick="submitForm();">SUBMIT</button>
因此,当我点击提交按钮时,它会将表单提交给struts动作。 JQuery是 验证表单的Jquery是 当我单击提交按钮而不选择任何单选按钮时,它显示正确的消息。也就是说,表单验证正确发生。但如果它也返回false,表单仍然会提交给行动。如果验证函数返回false,我该怎么做才能保留页面而不提交?<script>
function submitForm() {
var $submitform=$('#formId').val();
$('#'+$submitform).submit(); // $submitform is the id of the form.
}
</script>
function validateDBFom()
{
var selectedVal = "";
var selected = $("input[type='radio'][name='connectionType']:checked");
if (selected.length > 0)
{
selectedValue = selected.val();
if(selectedValue=="jdbcConnection")
{
var $dbHostname=$("#dbHostname").val();
alert($dbHostname);
if($dbHostname==""||$dbHostname==null)
{
alert("Please fill host name");
return false;
}
}
}
else
{
alert("Please Select Connection Type.");
return false;
}
}
答案 0 :(得分:1)
你的代码是正确的,除了这一行
<form class="form-horizontal" id="genericDatabaseLoad" name="genericDatabaseLoad"
action="genericDatabaseLoad" method="post" onsubmit="validateDBFom()">
你应该使用
<form class="form-horizontal" id="genericDatabaseLoad" name="genericDatabaseLoad"
action="genericDatabaseLoad" method="post" onsubmit="return validateDBFom();">
注意onsubmit