Using Client Callbacks for Building the ListBoxesFTs_C ASP.NET Web User Control: Part II

In this article I share how you can build your own ASP.NET web user control with the help of the Client Callbacks. The examples are written using C# and JavaScript.

The full text of the ListBoxesFTs_C.ascx.cs is the following (the comments to the code you can find in the first part):

using System;

using System.Data;

using System.Configuration;

using System.Collections;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

using System.Text;

using System.IO;

 

 

 

public partial class UserControls_ListBoxesFTs_C : System.Web.UI.UserControl,

    System.Web.UI.ICallbackEventHandler

{

    #region "forClass"

    int _WidthLB = 60;

    int _HeightLB = 120;

    string _LabelFrom = ">>";

    string _LabelTo = "<<";

    DataTable _DT_In = null;

    DataTable _DT_Out = null;

    int _SortBy = 1;

    string _Split = "|";

 

    #endregion

 

    protected void Page_Load(object sender, EventArgs e)

    {

        if (!IsPostBack)

        {

            fillHidden(_DT_In, HiddenFromText, HiddenFromValue);

            fillHidden(_DT_Out, HiddenToText, HiddenToValue);

        }

        else

        {

            getDT_Hidden();

        }

        buildListBox(ListBoxFrom, _DT_In);

        buildListBox(ListBoxTo, _DT_Out);

        ForCallBackOnLoad();

     }

    protected void Page_PreRender(object sender, EventArgs e)

    {

        if (IsPostBack)

        { return; }

        ListBoxFrom.Width = Unit.Pixel(_WidthLB);

        ListBoxFrom.Height = Unit.Pixel(_HeightLB);

        ListBoxTo.Width = Unit.Pixel(_WidthLB);

        ListBoxTo.Height = Unit.Pixel(_HeightLB);

        ButtonHTMLFrom.Value = _LabelFrom;

        ButtonHTMLTo.Value = _LabelTo;

        ButtonHTMLFrom.Visible = true;

        ButtonHTMLTo.Visible = true;

        ButtonHTMLFrom.Attributes.Add("onClick",

            "javascript:ButtonHTML_onclick(" +

            this.Parent.ID + "." + FindControl(ListBoxFrom.ID).ClientID + "," +

            this.Parent.ID + "." + FindControl(ListBoxTo.ID).ClientID + "," +

            this.Parent.ID + "." + FindControl(HiddenToText.ID).ClientID + "," +

            this.Parent.ID + "." + FindControl(HiddenToValue.ID).ClientID + "," +

            this.Parent.ID + "." + FindControl(HiddenFromText.ID).ClientID + "," +

            this.Parent.ID + "." + FindControl(HiddenFromValue.ID).ClientID + "," +

            "true" + ")");

        ButtonHTMLTo.Attributes.Add("onClick",

            "javascript:ButtonHTML_onclick(" +

            this.Parent.ID + "." + FindControl(ListBoxFrom.ID).ClientID + "," +

            this.Parent.ID + "." + FindControl(ListBoxTo.ID).ClientID + "," +

            this.Parent.ID + "." + FindControl(HiddenToText.ID).ClientID + "," +

            this.Parent.ID + "." + FindControl(HiddenToValue.ID).ClientID + "," +

            this.Parent.ID + "." + FindControl(HiddenFromText.ID).ClientID + "," +

            this.Parent.ID + "." + FindControl(HiddenFromValue.ID).ClientID + "," +

            "false" + ")");

    }

 

 

    #region "Callback"

 

    string _cb_Return = "";

    public string GetCallbackResult()

    {

        StringBuilder SB = new StringBuilder();

        bool bFrom;

        int iSelected;

        string sSplit = _Split;

        Array arrReturn;

        char[] cIndexOf = { '!' };

        StringWriter sWriteTo = new System.IO.StringWriter();

        HtmlTextWriter htmlWriterTo = new HtmlTextWriter(sWriteTo);

        StringWriter sWriteFrom = new System.IO.StringWriter();

        HtmlTextWriter htmlWriterFrom = new HtmlTextWriter(sWriteFrom);

 

        arrReturn = _cb_Return.Split(cIndexOf);

 

        iSelected = Convert.ToInt32(arrReturn.GetValue(0).ToString().Trim());

        bFrom = Convert.ToBoolean(arrReturn.GetValue(1).ToString().Trim());

        getDT_Hidden(arrReturn.GetValue(2).ToString().Trim(),

            arrReturn.GetValue(3).ToString().Trim(),

            arrReturn.GetValue(4).ToString().Trim(),

            arrReturn.GetValue(5).ToString().Trim());

        onClickFromTo(bFrom,iSelected );

             

        ListBoxTo.RenderControl(htmlWriterTo);

        ListBoxFrom.RenderControl(htmlWriterFrom);

 

        SB.Append(FindControl(divListBoxTo.ID).ClientID);

        SB.Append(sSplit);

        SB.Append(sWriteTo.ToString());

        SB.Append(sSplit);

        SB.Append(FindControl(divListBoxFrom.ID).ClientID);

        SB.Append(sSplit);

        SB.Append(sWriteFrom.ToString());

        SB.Append(sSplit);

        SB.Append(this.Parent.ID + "." +

            FindControl(ListBoxFrom.ID).ClientID);

        SB.Append(sSplit);

        SB.Append(this.Parent.ID + "." +

            FindControl(ListBoxTo.ID).ClientID);

        SB.Append(sSplit);

        SB.Append(this.Parent.ID + "." +

            FindControl(HiddenFromText.ID).ClientID);

        SB.Append(sSplit);

        SB.Append(this.Parent.ID + "." +

            FindControl(HiddenFromValue.ID).ClientID);

        SB.Append(sSplit);

        SB.Append(this.Parent.ID + "." +

            FindControl(HiddenToText.ID).ClientID);

        SB.Append(sSplit);

        SB.Append(this.Parent.ID + "." +

            FindControl(HiddenToValue.ID).ClientID);

 

        return SB.ToString();

    }

 

    public void RaiseCallbackEvent(string eventArgument)

    {

        _cb_Return  = eventArgument;

    }

    private void ForCallBackOnLoad()

    {

        ClientScriptManager CS = Page.ClientScript;

        String cbRef = CS.GetCallbackEventReference(this, "arg",

            "ReceiveServerData", "");

        String cbScript = "function CallTheServer(arg) {" +

            cbRef + "; }";

        CS.RegisterClientScriptBlock(this.GetType(), "CallTheServer",

            cbScript, true);

    }

    private void onClickFromTo(bool clickFrom,int iSelected)

    {

        ListBox lb;

        DataTable dtFrom;

        DataTable dtTo;

        int iItemsList = 0;

        int iCount = 0;

        int iCountHelp = 0;

        if (clickFrom)

        {

            lb = ListBoxFrom;

            dtFrom = _DT_In;

            dtTo = _DT_Out;

        }

        else

        {

            lb = ListBoxTo;

            dtFrom = _DT_Out;

            dtTo = _DT_In;

        }

        iItemsList = dtFrom.Rows.Count;

        for (iCount = 0; iCount < iItemsList; iCount++)

        {

            if (iCount == iSelected)

            {

                DataRow dr;

                dr = dtTo.NewRow();

                dr[0] = dtFrom.Rows[iCount - iCountHelp][0];

                dr[1] = dtFrom.Rows[iCount - iCountHelp][1];

                dtTo.Rows.Add(dr);

                dtFrom.Rows[iCount - iCountHelp].Delete();

                iCountHelp = iCountHelp + 1;

            }

        }

        if (clickFrom)

        {

            _DT_In = dataTable_Sort(dtFrom.Copy());

            _DT_Out = dataTable_Sort(dtTo.Copy());

        }

        else

        {

            _DT_Out = dataTable_Sort(dtFrom.Copy());

            _DT_In = dataTable_Sort(dtTo.Copy());

        }

        buildListBox(ListBoxFrom, _DT_In);

        buildListBox(ListBoxTo, _DT_Out);

    }

 

    #endregion

 

 

    #region "properties"

 

    public int C_SortBy

    {

        get { return _SortBy; }

        set { _SortBy = value; }

    }

    public int C_WidthLB

    {

        get { return _WidthLB; }

        set { _WidthLB = value; }

    }

    public int C_HeightLB

    {

        get { return _HeightLB; }

        set { _HeightLB = value; }

    }

    public string C_LabelFrom

    {

        get { return _LabelFrom; }

        set { _LabelFrom = value; }

    }

    public string C_LabelTo

    {

        get { return _LabelTo; }

        set { _LabelTo = value; }

    }

    public DataTable C_DataIn

    {

        set

        {

            _DT_In = dataTable_Sort(value);

            _DT_Out = _DT_In.Clone();

        }

    }

    public DataTable C_DataOut

    {

        get { return _DT_Out; }

    }

    #endregion

 

 

    private DataTable dataTable_Sort(DataTable dt)

    {

        DataView dv;

        DataTable dtHelp;

        DataRow dr;

        int iCount = 0;

        int iMax = dt.Rows.Count;

 

        dtHelp = dt.Copy();

        dv = dtHelp.DefaultView;

        dv.Sort = dt.Columns[_SortBy].Caption;

        dt.Clear();

        for (iCount = 0; iCount < iMax; iCount++)

        {

            dr = dt.NewRow();

            dr[0] = dv[iCount][0];

            dr[1] = dv[iCount][1];

            dt.Rows.Add(dr);

        }

        return dt;

    }

//-----------------------------------------------------

    private void fillHidden(DataTable dt,

                            HtmlInputHidden HiddenText,

                            HtmlInputHidden HiddenValue)

    {

        int iCount;

        int iMax;

        string sHiddenText = "";

        string sHiddenValue = "";

        string sText = "";

        string sValue = "";

 

        iMax = dt.Rows.Count;

        for (iCount = 0; iCount < iMax; iCount++)

        {

            sText = dt.Rows[iCount][1].ToString().Trim();

            sValue = dt.Rows[iCount][0].ToString().Trim();

            sHiddenText += sText;

            sHiddenValue += sValue;

            if (iCount != (iMax - 1))

            {

                sHiddenText += _Split;

                sHiddenValue += _Split;

            }

        }

        HiddenText.Value = sHiddenText;

        HiddenValue.Value = sHiddenValue;

    }

 

//----------------------------------------------------- 

    private void buildListBox(ListBox lb, DataTable dt)

    {

        lb.DataTextField = dt.Columns[1].Caption;

        lb.DataValueField = dt.Columns[0].Caption;

        lb.DataSource = dt;

        lb.DataBind();

    }

//-----------------------------------------------------   

    private void getDT_Hidden()

    {

        Array arrFromText;

        Array arrFromValue;

        Array arrToText;

        Array arrToValue;

        char[] separator ={ (char)_Split[0]  };

        DataRow dr;

        int iCount;

        int iMax;

 

        arrFromText = HiddenFromText.Value.ToString().Trim().Split(separator);

        arrFromValue = HiddenFromValue.Value.ToString().Trim().Split(separator);

        iMax = arrFromText.Length;

        _DT_In.Clear();

        for (iCount = 0; iCount < iMax; iCount++)

        {

            dr = _DT_In.NewRow();

            dr[0] = arrFromValue.GetValue(iCount);

            dr[1] = arrFromText.GetValue(iCount);

            if (arrFromValue.GetValue(iCount).ToString().Trim() != ""

                        && arrFromText.GetValue(iCount).ToString().Trim() != "")

            {

                _DT_In.Rows.Add(dr);

            }

        }

 

        arrToText = HiddenToText.Value.ToString().Trim().Split(separator);

        arrToValue = HiddenToValue.Value.ToString().Trim().Split(separator);

        iMax = arrToText.Length;

        _DT_Out.Clear();

        for (iCount = 0; iCount < iMax; iCount++)

        {

            dr = _DT_Out.NewRow();

            dr[0] = arrToValue.GetValue(iCount);

            dr[1] = arrToText.GetValue(iCount);

            if (arrToValue.GetValue(iCount).ToString().Trim() != ""

                        && arrToText.GetValue(iCount).ToString().Trim() != "")

            {

                _DT_Out.Rows.Add(dr);

            }

        }

    }

 

    private void getDT_Hidden(

                            string textHiddenFromText,

                            string textHiddenFromValue,

                            string textHiddenToText,

                            string textHiddenToValue)

    {

        Array arrFromText;

        Array arrFromValue;

        Array arrToText;

        Array arrToValue;

        char[] separator ={ (char)_Split[0] };

        DataRow dr;

        int iCount;

        int iMax;

 

        arrFromText = textHiddenFromText.Split(separator);

        arrFromValue = textHiddenFromValue.Split(separator);

        iMax = arrFromText.Length;

        _DT_In.Clear();

        for (iCount = 0; iCount < iMax; iCount++)

        {

            dr = _DT_In.NewRow();

            dr[0] = arrFromValue.GetValue(iCount);

            dr[1] = arrFromText.GetValue(iCount);

            if (arrFromValue.GetValue(iCount).ToString().Trim() != ""

                        && arrFromText.GetValue(iCount).ToString().Trim() != "")

            {

                _DT_In.Rows.Add(dr);

            }

        }

 

        arrToText = textHiddenToText.Split(separator);

        arrToValue = textHiddenToValue.Split(separator);

        iMax = arrToText.Length;

        _DT_Out.Clear();

        for (iCount = 0; iCount < iMax; iCount++)

        {

            dr = _DT_Out.NewRow();

            dr[0] = arrToValue.GetValue(iCount);

            dr[1] = arrToText.GetValue(iCount);

            if (arrToValue.GetValue(iCount).ToString().Trim() != ""

                        && arrToText.GetValue(iCount).ToString().Trim() != "")

            {

                _DT_Out.Rows.Add(dr);

            }

        }

    }

//-----------------------------------------------------

   

    protected override void LoadViewState(object VS_saved)

    {

        if (VS_saved != null)

        {

            object[] VS_all = (object[])VS_saved;

            if (VS_all[0] != null)

            {

                base.LoadViewState(VS_all[0]);

            }

            if (VS_all[1] != null)

            {

                _DT_In = (DataTable)VS_all[1];

            }

            if (VS_all[2] != null)

            {

                _DT_Out = (DataTable)VS_all[2];

            }

            if (VS_all[3] != null)

            {

                _SortBy = (int)VS_all[3];

            }

            if (VS_all[4] != null)

            {

                _WidthLB = (int)VS_all[4];

            }

            if (VS_all[5] != null)

            {

                _HeightLB = (int)VS_all[5];

            }

            if (VS_all[6] != null)

            {

                _LabelFrom = (string)VS_all[6];

            }

            if (VS_all[7] != null)

            {

                _LabelTo = (string)VS_all[7];

            }

        }

    }

 

    protected override object SaveViewState()

    {

        object VS_base = base.SaveViewState();

        object[] VS_all = new object[8];

        VS_all[0] = VS_base;

        VS_all[1] = _DT_In;

        VS_all[2] = _DT_Out;

        VS_all[3] = _SortBy;

        VS_all[4] = _WidthLB;

        VS_all[5] = _HeightLB;

        VS_all[6] = _LabelFrom;

        VS_all[7] = _LabelTo;

        return VS_all;

    }

}

 

           

The full client script of the ListBoxesFTs_C.ascx:

<script language="javascript" type="text/javascript">

// <!CDATA[

 

//--------------------------------------

var _Split = "|";

var sIndexOf = "!";

function ReceiveServerData(sValue)

{

    var arrValue = Array();

    arrValue = sValue.split(_Split);

    document.getElementById(arrValue[0]).innerHTML = arrValue[1];

    document.getElementById(arrValue[2]).innerHTML = arrValue[3];

    fillHidden(arrValue[4],arrValue[6],arrValue[7]);

    fillHidden(arrValue[5],arrValue[8],arrValue[9]);

}

//-------------------------------------------------------

function ButtonHTML_onclick(ListBoxFrom,ListBoxTo,

                            HiddenToText,HiddenToValue,

                            HiddenFromText,HiddenFromValue, 

                            bDoFromList)

{

    var sListBox;

    var iSelectedIndex;

    if (typeof(bDoFromList)== "undefined")

    {

        bDoFromList=true;

    }

    else

    {if (typeof(bDoFromList)!= "boolean")

            {

                bDoFromList=true;

            }

    }

    if (bDoFromList)

    {

        sListBox="ListBoxFrom";

    }

    else

    {

        sListBox = "ListBoxTo";

    }  

    eval("iSelectedIndex="+sListBox+".selectedIndex");

    CallTheServer(iSelectedIndex + sIndexOf +

        bDoFromList + sIndexOf +

        HiddenFromText.value + sIndexOf +

        HiddenFromValue.value + sIndexOf +

        HiddenToText.value + sIndexOf +

        HiddenToValue.value );

}

//-------------------------------------------------------

function fillHidden     (ListBox,HiddenText,HiddenValue)

{

    var iOption;

    var sHelp = "";

    var iHelp= "";

    var sHiddenText = "";

    var sHiddenValue = "";

 

    eval("iOption= "+ListBox+".length");

    hiddenClear(HiddenText,HiddenValue);

          for (var i=0 ;i<iOption; i++)

          {

        eval("sHelp="+ListBox+".item(i).text");

                   eval("iHelp="+ListBox+".item(i).value");

                   sHiddenText = sHiddenText + sHelp ;

                   sHiddenValue = sHiddenValue + iHelp;

                    if (i != iOption - 1)

                   {                          

                             sHiddenText = sHiddenText  + _Split;

                             sHiddenValue = sHiddenValue + _Split;

                   };

     

};

          eval(HiddenText+".value = sHiddenText");

          eval(HiddenValue+".value = sHiddenValue");

}

//-------------------------------------------------------

function hiddenClear(HiddenText,HiddenValue)

{

    var s = "";

          eval(HiddenText+".value = s");

          eval(HiddenValue+".value = s");

}

 

// ]]>

</script>


Now we can test our control. With this purposes we reaped the actions done in the article, run the project, choose ListBoxes_s (fig. 4)

 

04.GIF




and.....receive the result as though property C_Client of the ListBoxesFT_C has been set to "true" in spite of the fact that we used server methods (this is without any re-creating and flicker of the page !!!).


CONCLUSION

In two series of the multi-part articles we discussed three different approaches of building the Web User Control. As example we have chosen the control, which carries out identical functions. It has helped us to concentrate on the mechanism of data exchange (server, client or Client Callbacks mechanism).


I hope that two series of these articles will help you to choose your own way (depending on your requests) to build web user control in Visual Studio 2005.

Good luck in programming !