FindControl in UltraWebGrid

Most of us find it difficult to implement a similar FindControl functionality from GridView in UltraWebGrid using the TemplatedColum. Here is a way to do it.

 

/// <summary>
/// Initalize grid row
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void _Grid_InitializeRow(object sender, Infragistics.WebUI.UltraWebGrid.RowEventArgs e)
{
    UltraWebGrid grid = sender as UltraWebGrid;
    if(grid == null)
        return;

    TemplatedColumn col = (TemplatedColumn) grid.Columns[0];
    CellItem item = (CellItem) col.CellItems[e.Row.Index];
    RadioButton optSelect = item.FindControl("optSelect") as RadioButton;
    if (optSelect != null)
    {
        optSelect.Attributes["onclick"] =
            string.Format("alert('Row# : {0}')", e.Row.Index);
    }
}

Calling a Web Page or a Web Service Method using ASP.NET AJAX

Most of the time when developing a web application we will encounter scenarios wherein we need to call a page function or a web service function from client script (e.g. javascript). Thought ASP.NET AJAX has created a PageMethods to do this task, however studying the html that it generates we will find that it creates complex markup to our page which may add to the size of html being rendered and transmitted into the network. Here is an alternative example to do this.

Javascript:

<form id="_default" runat="server">
<asp:ScriptManager ID="_ScriptManager" runat="server"></asp:ScriptManager>
<script type="text/javascript">
//<!--
function ShowServerDateWS()
{
Sys.Net.WebServiceProxy.invoke('CommonUtil.asmx',
    'GetServerDate', true, {},function (result, args) {
    alert(result);
    },function (error) {
    alert('sorry error happens...');
    },
    '',0
);
}

function ShowServerDateWP()
{
Sys.Net.WebServiceProxy.invoke('CommonFunctions.aspx',
    'GetServerDate', true, {},function (result, args) {
    alert(result);
    },function (error) {
    alert('sorry error happens...');
    },
    '',0
);
}
//-->
</script>
<input type="button" id="btnShowServerDateWs" value="Show Server Date from Web Service" onclick="javascript:ShowServerDateWS()" /><br />
<input type="button" id="btnShowServerDateWp" value="Show Server Date from Web Page" onclick="javascript:ShowServerDateWP()" /><br />
</form>

Web Page:

[System.Web.Services.WebService()]
public partial class CommonFunctions : System.Web.UI.Page
{
    [System.Web.Services.WebMethod()]
    [System.Web.Script.Services.ScriptMethod(UseHttpGet = true)]
    public static string GetServerDate()
    {
        return DateTime.Now.ToString("dd-MMM-yyyy");
    }
}

Web Service:

[System.Web.Services.WebService()]
[System.Web.Script.Services.ScriptService]
public class CommonUtil : System.Web.Services.WebService
{
    [System.Web.Services.WebMethod()]
    [System.Web.Script.Services.ScriptMethod(UseHttpGet = true)]
    public string GetServerDate()
    {
        return DateTime.Now.ToString("dd-MMM-yyyy");
    }
}

Cheers!

Displaying a progress indicator during DemandLoad of the UltraWebTree

Declare InitializeTree and DemandLoad event handlers in the ClientSideEvents of the UltraWebTree.

<ClientSideEvents InitializeTree="func_initializeTree" DemandLoad="func_demandLoad" />

The DemandLoad event handler will respond when the user click on a node and process an ajax postback to retrieve thechild nodes. In this handler you can display any progress indicator message.

The InitializeTree event handler will act like the callback, this is assumed because the UltraWebTree does not have any AfterDemandLoad event. In this handler you can hide the progress indicator message.

 

var _currentNodeId = '';
var _currentNodeText = '';

function func_initializeTree(treeId)
{
    var tree;
    tree = igtree_getTreeById(treeId);
    if(_currentNodeId.length > 0 && _currentNodeText.length > 0)
    {
        var node = igtree_getNodeById(_currentNodeId);
        node.setText(_currentNodeText);
    }
    _currentNodeId = '';
    _currentNodeText = '';
}

function func_demandLoad(treeId, nodeId)
{
    var tree = igtree_getTreeById(treeId);
    var node = igtree_getNodeById(nodeId);
    _currentNodeId = nodeId;
    _currentNodeText = node.getText();
    node.setText(_currentNodeText + ' [Loading...]');
}