Tuesday, July 29, 2008

Force Page Client Validation First....

Today, I need to force check if the Page is valid in the client to perform another javascript function called.

Luckily, If you use Script Manager, WebResources.axd has been provided a function.

This function called Page_ClientValidate which will return the boolean result which indicate if the page client is valid / not. This function also will so the error message from page client validator and summary validator.

validationResult = Page_ClientValidate("groupName");

However if you use validation which is happen on the server, you still to mark your button CausesValidation="true" (Default) and code behind to check if Page is valid.

Here is example server validator using Custom validator

<asp:CustomValidator ID="custVal" runat="server" Display="dynamic" OnServerValidate="custVal_ServerValidate">
*
</asp:CustomValidator>
//code behind validation
protected void sitevalName_ServerValidate(object source, ServerValidateEventArgs args)
{
if (not valid)
args.IsValid = false;
}
//and don't forget in your button click code behind
//you need to check if page is valid,
//otherwise it will keep going.
if (!Page.IsValid) Return;

Friday, July 25, 2008

SWF with inside Modal Popup

I just solve a problem with SWF inside Modal Popup.

The weird thing happen between SWF and Ajax. It sometimes work and not work.

To make show swf in IE , I need to use SWF Object to render.
var fo = new SWFObject('temp.swf', 'viewer', '100%', '100%', '7', '#ffffff');

but there is still problem in Firefox which sometimes load up sometimes not.

Finally I need to put it on other IFrame instead of div.

<iframe style="border:none; width: 100%; height: 100%;" src="/temp.aspx?ID=<%= Content.ID%>" >
</iframe>


however It still cause a problem because I put the SWF Register Object using RegisterClient On backend... which Firefox does not accepted but IE accepted.

so Finally I need to put SWF object in front of Client aspx.




Friday, July 18, 2008

Tuesday, July 15, 2008

JQuery - Mouseleave VS Mouseout

Today, I just realize that Mouseout will trigger if we go to the child of that container. Luckily JQuery has MouseLeave event which solve this problem.

Mouseover fires when the pointer moves into or out from child element, while mouseenter does't.

It is not standard DOM event so you need to use Bind method from JQUERY.

   $("div.overout").mouseover(function(){
$("p:first",this).text("mouse over");
$("p:last",this).text(++i);
}).mouseout(function(){
$("p:first",this).text("mouse out");
});
});




$("div.enterleave").bind("mouseenter",function(){
$("p:first",this).text("mouse enter");
$("p:last",this).text(++n);
}).bind("mouseleave",function(){
$("p:first",this).text("mouse leave");
});

RepeatColumns in ListView

The last major feature of the ListView is the ability to group data into subsets, much like the DataList control provides. The DataList is a tabular control that renders a single row of data in each cell of the rendered table. You control how many rows of the underlying dataset are grouped into a single table row by setting the RepeatColumns property.

Since the ListView is not constrained to render as a table, it needs a more generic way of specifying groups of items to be rendered together, which is what GroupTemplate does. Pic below shows the relationship among the LayoutTemplate, GroupTemplate, and ItemTemplate elements within a ListView. The GroupTemplate lets you specify the surrounding HTML for every n elements in the underlying dataset, where n is specified by the GroupItemCount property of the ListView.

 

When you use a GroupTemplate within a ListView, you won't specify a control with an ID of itemPlaceholder within your LayoutTemplate—that control now needs to be in your GroupTemplate. Instead, you will specify a control with an ID of groupPlaceholder in the LayoutTemplate (you can change the control ID by setting the GroupPlaceholderID property of the ListView) to describe where the contents of the GroupTemplate should be injected for each n items encountered in the underlying dataset.

Here is example how to use GroupTemplate in ListView

<asp:ListView ID="ListView1" runat="server" OnPagePropertiesChanging="ListView1_PagePropertiesChanging" GroupItemCount="2" DataKeyNames="CourtID">
<LayoutTemplate>
<asp:PlaceHolder id="groupPlaceholder" runat="server"/>
</LayoutTemplate>
<GroupTemplate>
<table>
<tr id="itemPlaceholder" runat="server">
</tr>
</table>
</GroupTemplate>
<ItemTemplate>
<td>
test<%# Eval("CourtID") %>
</td>
</ItemTemplate>
/asp:ListView>





This is very similar to what you could do with a DataList, but because you are working with a ListView, you can just as easily add both pagination and sorting as you did earlier with your grid rendering, a task that would be rather daunting with the DataList. The code download for this article contains an example that implements both pagination and sorting for your reference.

Data paging List View in .Net 3.5

ListView is one of the new data controls that was shipped with the latest release of ASP.NET, which is 3.5. It displays the values from a data source by utilizing user-defined templates. This gives the developer more flexibility about the design of the data displayed on the user interface. In order for the ListView control to display its content, templates should be created for different parts of the control. The LayoutTemplate and ItemTemplate are mandatory. All other templates are optional.

Here is a sample to use Data paging without Data Source (Data Bind)

<asp:ListView ID="ListView1" runat="server" 
onpagepropertieschanging="ListView1_PagePropertiesChanging">
<LayoutTemplate>
LIST VIEW <br />
<table>
<tr>
<th>Court ID</th>
</tr>
<tr id="itemPlaceHolder" runat="server" />
</table>

</LayoutTemplate>
<ItemTemplate>
<tr>
<td>
test<%
   1: # Eval("CourtID")
%>
</td>
</tr>

</ItemTemplate>
</asp:ListView>
<asp:DataPager ID="DataPager1" runat="server" PagedControlID="ListView1" PageSize="3" >
<Fields>
<asp:NumericPagerField ButtonCount="4" />
</Fields>
</asp:DataPager>




//inside page load
protected void Page_Load(object sender, EventArgs e)
{
//nomd for the first time
if (!IsPostBack)
{
ListView1.DataSource = CourtProvider.GetAllCourtsForDataBinding();
ListView1.DataBind();
}
}




//when ListView Page Property Changed
protected void ListView1_PagePropertiesChanging(object sender, PagePropertiesChangingEventArgs e)
{
DataPager1.SetPageProperties(e.StartRowIndex, e.MaximumRows, false);

ListView1.DataSource = CourtProvider.GetAllCourtsForDataBinding();
ListView1.DataBind();

}







Here is simple way to display using Object Data Source




<asp:ListView ID="ListView1" runat="server" DataSourceID="pdsData">
<LayoutTemplate>
LIST VIEW <br />
<table>
<tr>
<th>Court ID</th>
</tr>
<tr id="itemPlaceHolder" runat="server" />
</table>

</LayoutTemplate>
<ItemTemplate>
<tr>
<td>
test<%
   1: # Eval("CourtID")
%>
</td>
</tr>

</ItemTemplate>
</asp:ListView>
<asp:DataPager ID="DataPager1" runat="server" PagedControlID="ListView1" PageSize="3" >
<Fields>
<asp:NumericPagerField ButtonCount="4" />
</Fields>
</asp:DataPager>

<cc:ParentDataSource ID="pdsData" runat="server" SelectMethod="GetData" SelectCountMethod="GetDataRowCount" />




public IEnumerable<CourtBindingHelper> GetData(string sortExpression, int maximumRows, int startRowIndex)
{
try
{

return this.CourtsData.GetSortPagingData(sortExpression, maximumRows, startRowIndex);

}
catch (Exception ex)
{
lblError.Text = ex.Message;
//if error just return the agencies
return this.CourtsData;
}
}

public int GetDataRowCount()
{
return (this.CourtsData != null ? this.CourtsData.Count : 0);
}

Wednesday, July 9, 2008

PEX

Pex is Automated EXploration Testing. It is an intelligent assistant to the programmer and will help us to generate a prarameterized unit test.

very cool...