Week 12
admin | WISE21 Nov 2010
Today I added jQuery based validation in signup.aspx – which contained lot of code and it was challenge to get it all working together. But the best part was how clean the code looked – and how easy it would be to code other validation pages based on this one.
Daniel figured out a neat trick: If you want one or the other field to be required, you can do it like this:
<%= txtHomePhone.UniqueID %>: {
required: "#<%= txtCellPhone.ClientID %>:blank",
},
<%= txtCellPhone.UniqueID %>: {
required: "#<%= txtHomePhone.ClientID %>:blank",
}
:blank is important here. I also added some custom validation methods such as phoneUS, zipUS etc.
On Friday me and Daniel discussed about the expand/collapse ability of the events. We discussed about using tables/divs and we figured out divs would be a better option. Also we also figured out it would be better if I work on figuring out the expand/collapse in jquery because I had something similar earlier.
On Sunday, I worked on Volunteer/default.aspx –
$(document).ready(function () {
$(".expand").click(function (e) {
e.preventDefault(); //Make sure we don't get redirected....
var pointer = $(this).parent().parent().next(); //pointer to the relevant jobsList
if ($(pointer).hasClass("hidden")) //We are hidden... show
{
$(pointer).removeClass("hidden");
$(pointer).fadeIn("slow");
}
else
{
$(pointer).addClass("hidden");
$(pointer).fadeOut("slow");
}
});
$("#expandAll").click(function (e) {
$(".jobsList").fadeIn("slow");
});
$("#collapseAll").click(function (e) {
$(".jobsList").fadeOut("slow");
});
});
<div class="list">
<asp:Repeater runat="server" ID="eventsList" OnItemDataBound="eventsList_ItemDataBound">
<ItemTemplate>
<ul class = "jobsTemplate events">
<li><a class = "expand"><img src = "/Images/expand.gif" alt = "Expand Jobs" /></a></li>
<li><%# DataBinder.Eval(Container, "DataItem.Name") %></li>
<li><%# DataBinder.Eval(Container, "DataItem.Location") %></li>
<li><%# DataBinder.Eval(Container, "DataItem.StartdateTime") %></li>
<li><%# DataBinder.Eval(Container, "DataItem.EnddateTime") %></li>
</ul>
<asp:Repeater runat="server" ID="jobsList">
<HeaderTemplate><div class = "jobsList"></HeaderTemplate>
<ItemTemplate>
<ul class = "jobsTemplate jobs">
<li><%# DataBinder.Eval(Container, "DataItem.Name") %></li>
<li><%# DataBinder.Eval(Container, "DataItem.StartdateTime") %></li>
<li><%# DataBinder.Eval(Container, "DataItem.EnddateTime") %></li>
<li><%# DataBinder.Eval(Container, "DataItem.Maxpeople") %></li>
<li><%# DataBinder.Eval(Container, "DataItem.Description") %></li>
</ul>
</ItemTemplate>
<FooterTemplate></div></FooterTemplate>
</asp:Repeater>
Figuring out the jQuery took me about 4 – 5 hours. I still felt that we weren’t doing enough work to be able to deliver the project.