User588019485 posted
Below is the code for View. I am trying to use placeholder for input type date but it doesnt work. However placeholder works for type text without any problem.
<input type="date" name="dateofbirth" placeholder="Date"/>
@{
var signup = (SignupViewModel)Model.Signup;
Style.Include("Common.css");
}
@{
Style.Include("datetime.css");
Script.Require("jQuery").AtFoot();
Script.Require("jQueryUI_Core").AtFoot();
Script.Require("jQueryUI_Widget").AtFoot();
Style.Require("jQueryUI_Orchard").AtFoot();
Script.Include("hint.js").AtFoot();
}
<style type="text/css">
#wrapper {
width:450px;
margin-top:20px;
font-family:Verdana, sans-serif;
}
legend {
color:#0481b1;
font-size:16px;
padding:0 10px;
background:#fff;
-moz-border-radius:4px;
box-shadow: 0 1px 5px rgba(4, 129, 177, 0.5);
padding:5px 10px;
text-transform:uppercase;
font-family:Helvetica, sans-serif;
font-weight:bold;
}
fieldset {
border-radius:4px;
background: #fff;
background: -moz-linear-gradient(#fff, #f9fdff);
background: -o-linear-gradient(#fff, #f9fdff);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#f9fdff));
background: -webkit-linear-gradient(#fff, #f9fdff);
padding:20px;
border-color:rgba(4, 129, 177, 0.4);
}
input,
textarea {
color: #373737;
background: #fff;
border: 1px solid #CCCCCC;
color: #aaa;
font-size: 14px;
line-height: 1.2em;
margin-bottom:15px;
-moz-border-radius:4px;
-webkit-border-radius:4px;
border-radius:4px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset, 0 1px 0 rgba(255, 255, 255, 0.2);
}
input[type="text"],
input[type="password"]{
padding: 2px 2px;
height: 20px;
width:250px;
}
input[type="text"]:focus,
input[type="password"]:focus {
background:#f5fcfe;
text-indent: 0;
z-index: 1;
color: #373737;
-webkit-transition-duration: 400ms;
-webkit-transition-property: width, background;
-webkit-transition-timing-function: ease;
-moz-transition-duration: 400ms;
-moz-transition-property: width, background;
-moz-transition-timing-function: ease;
-o-transition-duration: 400ms;
-o-transition-property: width, background;
-o-transition-timing-function: ease;
width: 300px;
border-color:#ccc;
box-shadow:0 0 5px rgba(4, 129, 177, 0.5);
opacity:0.6;
}
input[type="submit"]{
background: #222;
border: none;
text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
text-transform:uppercase;
color: #eee;
cursor: pointer;
font-size: 15px;
margin: 5px 0;
padding: 5px 22px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-border-radius:4px;
-webkit-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
}
textarea {
padding:3px;
width:96%;
height:100px;
}
textarea:focus {
background:#ebf8fd;
text-indent: 0;
z-index: 1;
color: #373737;
opacity:0.6;
box-shadow:0 0 5px rgba(4, 129, 177, 0.5);
border-color:#ccc;
}
.small {
line-height:14px;
font-size:12px;
color:#999898;
margin-bottom:3px;
}
</style>
@Html.ValidationSummary()
@using (Html.BeginFormAntiForgeryPost(Url.Action("Signup", "SignupOrLogin", new { area = "Course" }))) {
<div id="wrapper">
<form action="" method="post">
<fieldset>
<legend>Register Form</legend>
<div>
<input type="text" name="first_name" placeholder="First Name"/>
</div>
<div>
<input type="text" name="last_name" placeholder="Last Name"/>
</div>
<div>
<input type="date" name="dateofbirth" placeholder="Date"/>
</div>
<div>
<input type="text" name="housename" placeholder="House Name/No."/>
</div>
<div>
<input type="text" name="street" placeholder="Street"/>
</div>
<div>
<input type="text" name="town" placeholder="Town"/>
</div>
<div>
<input type="text" name="county" placeholder="County"/>
</div>
<div>
<input type="text" name="postcode" placeholder="Post Code"/>
</div>
<div>
<input type="text" name="homephone" placeholder="Home Phone"/>
</div>
<div>
<input type="text" name="mobilephone" placeholder="Mobile Phone"/>
</div>
<div>
<input type="text" name="bcunumber" placeholder="BCU Number"/>
</div>
<div>
<input type="password" name="password" placeholder="Password"/>
</div>
<div>
<input type="password" name="confirmpassword" placeholder="Confirm Password"/>
</div>
<div>
<input type="text" name="email" placeholder="Email"/>
</div>
<div>
<textarea name="message" placeholder="Health Declaration"></textarea>
</div>
@Html.CheckBoxFor(m => signup.AcceptTerms)
<div class="checkbox-and-label">
<label for="@Html.FieldIdFor(m => signup.AcceptTerms)">
@Html.Raw(T(" Please tick to confirm you have read, understood and agree to abide by our <a href=\"{0}\" target=\"_blank\">Terms and Conditions</a>", "#").ToString())
</label>
</div>
<input type="submit" name="submit" value="Send"/>
</fieldset>
</form>
</div>
}
