最初在点击按钮上加载leanModal(但是当文档准备就绪时加载leanModal Data entered when the modal is shown on the screen)
[表单输入重置后,表单看起来像第一次加载时的方式[3]
Showing spaces and it is not like how it was first time loaded
$(document).ready(function(){
// the "href" attribute of .modal-trigger must specify the modal ID that wants to be triggered
$('.modal-trigger').leanModal({
dismissible: true, // Modal can be dismissed by clicking outside of the modal
opacity: .5, // Opacity of modal background
ready: function() {
$("#selectFeild").hide();
$("#inputField").show();
}, // Callback for Modal open
complete: function() {
$("#selectType").val("1");
$("#selectFeild").hide();
$("#inputField").show();
$('form').find('input[type=text], input[type=password], input[type=number], input[type=email], textarea').val('');
} // Callback for Modal close
});
$('select').material_select();
});
<!-- Modal Structure -->
<div id="modal1" class="modal">
<div class="modal-content">
<div class="pull-right"><img src="<%=VCUtils.getContextRoot()%>images/close.png" width="20px" class=" modal-action modal-close"/></div>
<div class="col-xs-12 col-sm-12 col-md-12" style="text-align: center;"><h4>Join our growing network of agencies and providers</h4></div>
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
<div style="margin-top: 30px;">
<div class="row" style="border-right: 1px double #eaeaea;">
<div class="row">
<img src="<%=VCUtils.getContextRoot()%>images/check.png" width="25px"/><label class="vclabel">Accountability</label>
<p style="color:#54aecd;">Excehange invoices and documents online -- easily and secure</p>
</div>
<div class="row">
<img src="<%=VCUtils.getContextRoot()%>images/check.png" width="25px"/><label class="vclabel">Efficiency</label>
<p style="color:#54aecd;"> Start processing invoice faster with our secure customer API</p>
</div>
<div class="row">
<img src="<%=VCUtils.getContextRoot()%>images/check.png" width="25px"/><label class="vclabel">Status</label>
<p style="color:#54aecd;">Get real-time invoice status and payment information</p>
</div>
</div>
</div>
</div>
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
<div style="margin-top: 25px; text-align: center;">
<form class="col s12">
<div class="row">
<div class="input-field col s12">
<input id="firstName" type="text" class="validate"> <label for="firstName">First Name</label>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<input id="lastName" type="text" class="validate" style="font-size: 14px !important;"> <label
style="font-size: 14px;" for="email">Last Name</label>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<input id="email" type="email" class="validate"> <label
for="email">Email</label>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<select style="font-size: 14px;" id="selectType">
<option value="1" selected="selected">I represent a NYC Vendor</option>
<option value="2">I represent a NYC Agency</option>
</select>
</div>
</div>
<div id="inputField">
<div class="row">
<div class="input-field col s12">
<div class="input-field col s12">
<input id="companyName" type="text" class="validate"> <label for="firstName">Company Name</label>
</div>
</div>
</div>
</div>
<div id="selectFeild">
<div class="row">
<div class="input-field col s12">
<select style="font-size: 14px;">
<option value="" disabled selected>Agencies</option>
<option value="1">Actuary, NYC Office of the (NYCOA)</option>
<option value="2">Administrative Justice Coordinator, NYC Office of (AJC)</option>
<option value="1">Actuary, NYC Office of the (NYCOA)</option>
<option value="2">Administrative Justice Coordinator, NYC Office of (AJC)</option>
<option value="1">Actuary, NYC Office of the (NYCOA)</option>
<option value="2">Administrative Justice Coordinator, NYC Office of (AJC)</option>
<option value="1">Actuary, NYC Office of the (NYCOA)</option>
<option value="2">Administrative Justice Coordinator, NYC Office of (AJC)</option>
<option value="1">Actuary, NYC Office of the (NYCOA)</option>
<option value="2">Administrative Justice Coordinator, NYC Office of (AJC)</option>
<option value="1">Actuary, NYC Office of the (NYCOA)</option>
<option value="2">Administrative Justice Coordinator, NYC Office of (AJC)</option>
<option value="1">Actuary, NYC Office of the (NYCOA)</option>
<option value="2">Administrative Justice Coordinator, NYC Office of (AJC)</option>
<option value="1">Actuary, NYC Office of the (NYCOA)</option>
<option value="2">Administrative Justice Coordinator, NYC Office of (AJC)</option>
<option value="1">Actuary, NYC Office of the (NYCOA)</option>
<option value="2">Administrative Justice Coordinator, NYC Office of (AJC)</option>
<option value="1">Actuary, NYC Office of the (NYCOA)</option>
<option value="2">Administrative Justice Coordinator, NYC Office of (AJC)</option>
</select>
</div>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<a style="width: 255.594px;" class="waves-effect waves-light btn btnColor" onclick="javascript:validateFields()">Sign Up</a>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<!-- Thank You Model -->
<!-- Modal Structure -->
<div id="modal2" class="modal modalHeight">
<div class="modal-content">
<div class="pull-right"><img src="<%=VCUtils.getContextRoot()%>images/close.png" width="20px" class=" modal-action modal-close"/></div>
<div class="col-xs-12 col-sm-12 col-md-12" style="text-align: center;">
<p style="font-size: 20px; font-weight: normal;">Thank you for your interest. Your request was<br/>successfully submitted.</p>
<p style="font-size: 20px; margin-top: 30px; font-weight: normal;"> We'll be in touch.</p>
</div>
</div>
</div>
答案 0 :(得分:0)
完成:
function() {
//Added this line
location.reload(false); //you can use true or false if true it will reload from the server if false it will reload from browser cache
}
答案 1 :(得分:0)
在 materialize css 中使用
$('select').material_select();
重置Dropdownlist