Is there a way to retrieve the post title and display it in a notification? The notification's title is extracted from a form and shown in the notification. When the user clicks the submit button, the system captures the duration and title, displaying the notification for the specified time frame. Here's the code I've posted... any suggestions on improving it or providing an alternative solution?
$(document).ready(function() {
$("#form").validate({
rules: {
time: {
required: true,
number: true
},
title: "required"
},
messages: {
time: "Please enter time (in seconds)",
title: "Please enter the title"
}
});
$("#notify").hide();
$("#form").submit(function(e) {
if($('#form').valid()) {
$("#notify").slideDown();
var timeOut = parseInt($("#time").val())*1000 ;
var str = parseInt($("#title").val());
setTimeout(function() {
$("#notify").slideUp();
}, timeOut, str);
}
return false;
});
});
#notify
{
width: 100%;
position: absolute;
top: 0;
left: 0;
height: 50px;
background: #00FF00;
opacity: 0.8;
display: none;
}
#message
{
width: 100%;
text-align: center;
padding-top: 15px;
}
#form .formelement
{
display: inline-block;
padding: 10px 10px;
width: 900px;
}
#form .formelement label{
float: left;
text-align: left;
width: 110px;
}
#form .submit {
padding: 10px;
width: 220px;
height: 40px;
}
#form .formelement label.error {
color: red;
display: inline-block;
margin: 4px 0 10px 100px;
padding: 0;
text-align: left;
width: 900px;
}<html>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script>
<script src="valid.js"></script>
<link rel="stylesheet" type="text/css" href="style.css" />
<div id="notify">
<div id="message"></div>
</div>
<fieldset>
<form action="" id="form" >
<div class="formelement">
<label for="time">Time (in Seconds): </label>
<input type="text" name="time" id="time"/>
</div>
<div class="formelement">
<label for="title">Title: </label>
<input type="text" name="title" id="title"/>
</div>
<div class="formelement">
<input type="submit" value="Show Success" class="submit" id="s"/>
</div>
</form>
</fieldset>
</html>