Week 12

admin | WISE
21 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.

Leave a Reply