Infragistics Web Grid on a Web Tab

Geeks With Blogs

test

Chaz Blogs It's all about the eXperience!

<< Dev Dinner This Wednesday | Home | Innovative User Experiences Kids Play >>

Infragistics Web Grid on a Web Tab

Comments (8) | Share

I am writing a bit of client side code to move data from one Infragistics UltraWebGrid to another. To do this I have given the user a button on each row of the main table. If they click the button in a row the contents of the id and descrition columns should be inserted into the destination grid.

This all should have been real simple. Except my javascript did not work. Here is my original code:

function OnClickCellButton(gridName, itemName)
{
    var row = igtbl_getRowById(itemName);
    if (row != null)
  {

   var gridrow=igtbl_getActiveRow("MergeGrid");
if(gridrow=null)
{
    alert("gridrow is null");
    //if no activerow then set one and add the row to the customers band
    gridrow = igtbl_setActiveRow("MergeGrid",igtbl_getElementById     ("MergeGridr_0"));
}

var groupNo = row.getCell(1).getValue();
var terms = row.getCell(3).getValue();

   var newrow = igtbl_addNew("MergeGrid",0);

   newrow.getCell(0).setValue(groupNo);
   newrow.getCell(1).setValue(terms);

}

}

So the code is syntactically correct. My destination grid has an Id of MergeGrid. But remember my UltraWebGrid is on an UltraWebTab. This causes a problem. When I run this function, my row is never added to the grid. That is because behind the scenes, my grid was renamed. This is how I finally got the function to work.

Notice that I replaced the MergeGrid name with UltraWebTab1xxctl0xMergeGrid. I found this name by running my ASP.Net web project and viewing the source of the page from the web browser. There may be a better way to do this and if there is I'd like to know.

--chaz

function OnClickCellButton(gridName, itemName)
    {
      var row = igtbl_getRowById(itemName);
      if (row != null)
    {

    var gridrow=igtbl_getActiveRow("UltraWebTab1xxctl0xMergeGrid");
    if(gridrow=null)
      {
        alert("gridrow is null");
        //if no activerow then set one and add the row to the customers band
        gridrow = igtbl_setActiveRow("UltraWebTab1xxctl0xMergeGrid",igtbl_getElementById("UltraWebTab1xxctl0xMergeGridr_0"));
      }

    var groupNo = row.getCell(1).getValue();
    var terms = row.getCell(3).getValue();

    var newrow = igtbl_addNew("UltraWebTab1xxctl0xMergeGrid",0);

    newrow.getCell(0).setValue(groupNo);
    newrow.getCell(1).setValue(terms);

     }

} Posted on Friday, June 22, 2007 3:04 PM .Net , Other | Back to top

Comments on this post: Infragistics Web Grid on a Web Tab

# re: Infragistics Web Grid on a Web Tab

Is the code static, or are you dynamically injecting it into the page? If its dynamic (meaning your creating the code on the server and using ASP.NET to inject it into the page), then you could simply replace the literal string "MergeGrid" with this.MergeGrid.ClientID. The ClientID property will give you the full ID that ASP.NET creates for the control because it is nested in another control on the page.

If your script is static, as in its in a separate JS file or your coding it directly in the ASPX page, then what you could do is use the ClientScriptManager.RegisterClientScriptBlock() method to register a small script at the top of your page that simply defines a variable with the grids ClientID:

ClientScript.RegisterClientScriptBlock(this.GetType(),"MergeGridVar","var grid = " + this.MergeGrid.ClientID, true);

With that variable defined, you could use the grid variable when you need to specify the MergeGrid's ID value.

Hope that helps.

Left by Devin on Jun 23, 2007 11:15 PM

# re: Infragistics Web Grid on a Web Tab

Thanks for the reply Devin. To answer your question, my javascript is static within the ASPX page. So I followed your second recomendation and added:

ClientScript.RegisterClientScriptBlock(this.GetType(), "MergeGridVar","var grid = "; + this.MergeGrid.ClientID, true);

to my page_load event. This caused a javascript error;
UltraWebTab1__ctl0_MergeGrid is undefined.

So I went to the KB and searched and came up with KB09693. This KB had me define the var gridId at the top of my script. Then I added the MergeGrid_IntializeLayoutHandler client side event handler. My code looks like this:

<script>

// this variable stores the browser-generated name of the WebGrid

var gridID;

function OnToolbarButtonClick(oToolbar, oButton, oEvent)

{

if(oButton.Key == "Approve")

alert("All selected rows where the Term Number 1 = -1 will not be processed.");

}

function OnClickCellButton(gridName, itemName)

{

//gridID = MergeGridId.Value;

alert(gridID);

var row = igtbl_getRowById(itemName);

if (row != null)

{

var gridrow=igtbl_getActiveRow(gridID);

//var gridrow=igtbl_getActiveRow("UltraWebTab1xxctl0xMergeGrid");

if(gridrow=null)

{

alert("gridrow is null");

//if no activerow then set one and add the row to the customers band

//gridrow = igtbl_setActiveRow("UltraWebTab1xxctl0xMergeGrid",igtbl_getElementById("UltraWebTab1xxctl0xMergeGridr_0"));

gridrow = igtbl_setActiveRow(gridID,igtbl_getElementById(gridID + "r_0"));

}

var groupNo = row.getCell(1).getValue();

var terms = row.getCell(3).getValue();

var newrow = igtbl_addNew(gridID,0);

//var newrow = igtbl_addNew("UltraWebTab1xxctl0xMergeGrid",0);

newrow.getCell(0).setValue(groupNo);

newrow.getCell(1).setValue(terms);

}

}

</script>

<script id="igClientScript" type="text/javascript">



</script>

I think the ClientScript registration method is much more elegant, but I can't figure out where to place the line so that the control is defined before the script is written out.

Thanks for the help!

--chaz

Left by --chaz on Jun 25, 2007 12:56 PM

# re: Infragistics Web Grid on a Web Tab

where can i find the javascript functions for infragistics web grid? 10X

Left by andrei on Aug 02, 2007 11:14 PM

# re: Infragistics Web Grid on a Web Tab

Andrei,

You can typically find all the javascript files in the following path:

C:\Program Files\Infragistics\NetAdvantage for .NET 2007 Vol. 2 CLR 2.0\ASP.NET\Scripts

<replace the NetAdvantage version info in the above path with the version you are using>

Most scripts contain the name of the control in the file name. For example: the web grid has ig_webgrid.js as one file. You can browse through each .js file to discover all the scripts that are available. You can also go to http://help.infragistics.com/NetAdvantage/NET/2007.2/CLR2.0/ (again use the version appropriate for your needs. You should see an explorer tree on the left hand side of the web page. In there navigate to ASP.NET/Developer's Guid/The Toolset/Controls and Components/WebGrid/Using WebGrid/Client-Side Behaviors.

There is a list of Client Side Behaviors for the grid, the row, the column and the cell. Each of these are very helpful with good examples.

I do think the info in this matter is somewhat burried. It would be nice to simply have a flat list of all Infragistic javascripts for easier retrieval. Maybe they have that and I didn't see it.

Anyway, I hope this helps!

--chaz

Left by --chaz on Aug 03, 2007 2:07 AM

# re: Infragistics Web Grid on a Web Tab

Hello Chaz!

You should write
- on the server side:

Page.ClientScript.RegisterClientScriptBlock(this.GetType(),"MergeGridVar","var grid = document.getElementById('" + this.MergeGrid.ClientID + "');", true);

- or on the client side:

//if 'UltraWebTab1' is the name of the container object of the 'MegreGrid' UltraWebGrid...
var grid = document.getElementById('<%=UltraWebTab1.FindControl("MergeGrid").ClientID%>');

This should find the control...

Bests,
Tamas

Left by fureditom on Sep 26, 2008 8:41 AM

# re: Infragistics Web Grid on a Web Tab

Most Infragistic controls has its own getting method of getting the client name. Here are some example:

var grid1 = igtbl_getGridById('<%= grdName.ClientID %>');

var textbox1 = igedit_getById('<%= txtName.ClientID %>');

var oWebCombo1 = igcmbo_getComboById('<%= wCboName.ClientID %>');

As for ASP.NET controls, you do the following:

var textbox1 = document.getElementById('<%= txtName1.ClientID %>')

Just my 2 cents,
Thai

Left by Thai on Oct 22, 2008 1:53 PM

# re: Infragistics Web Grid on a Web Tab

Cool,

I'm still not comfortable with java script but I'm trying my best to be expert in it

Anyway, thanks for the post

Left by web development company on Aug 21, 2009 10:37 AM

# re: Infragistics Web Grid on a Web Tab

var a = document.getElementById(editControlsContainerPrefix+"txtPastStudiesCount");
var b = document.getElementById(editControlsContainerPrefix+"txtPastSupplyCount");
var c = document.getElementById(editControlsContainerPrefix+"txtPastContractsCount");
var d = document.getElementById(editControlsContainerPrefix+"txtPastOtherCount");
alert(a.value);
var value = parseFloat(a.value)+parseFloat(b.value)+parseFloat(c.value)+parseFloat(d.value);
alert(value);
var res =igedit_getById(editControlsContainerPrefix+"txtPastCountTotal");//.setValue(value);

res.setValue(value);
although its working as it should you get an error ...User Agent: Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; Trident/4.0; GTB6; .NET CLR 1.1.4322; .NET CLR 2.0.50727; .NET CLR 3.0.04506.648; .NET CLR 3.5.21022; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; InfoPath.1; AskTB5.3)
Timestamp: Mon, 8 Feb 2010 11:14:09 UTC

Message: 'undefined' is null or not an object
Line: 688
Char: 6
Code: 0
URI: http://.................

Left by vkoulbal on Feb 08, 2010 5:14 AM

Your comment:

Title:

Name:

Email: (never displayed) (will show your gravatar)

Comment: Allowed tags: blockquote, a, strong, em, p, u, strike, super, sub, code

Verification:

Code Monkey Projectiles - Index

ASP.Net SQL Server Apple Google SharePoint Windows Visual Studio Team Foundation Server Agile Office Design Patterns Web Azure