• Home
  • About
  • Resume

Category: Javascript

WebDataMenu: Incorrect displaying after upgrade

By , 10/10/2011 8:55 AM

This is the second post in saga titled Upgrading Infragistics Controls to a new version. Chances are that your WebDataMenu looks weird after upgrade to 2010+ version. In my case the menu had following options/features:

  • It was a context popup menu, called on right mouse click
  • Text of menu items was assigned dynamically at runtime in JavaScript Client code

After upgrading NetAdvantage from version 2009.2 to 2011.1 strange things started to happen. Text of the menu items was cut short, submenues appeared at wrong places it looked like something from a Dali’s painting.
Numerous experiments later I found out that the problem was with EnableScrolling property of the menu control. Setting it to False returned menu to realm of realism.

WebHierarchicalDataGrid: JavaScript errors after upgrade

By , 10/05/2011 4:26 PM

Upgrading 3rd party library to a new version is bound to have problems and Infragistics is no exception. In my case I was upgrading NetAdvantage for ASP.NET from version 2009.2 to to 20011.1 and right away WebHierarchicalDataGrid started to crash client-side. If ScriptManager was in debug mode I’d get error:

Microsoft JScript runtime error: Sys.ArgumentUndefinedException: Value cannot be undefined.Parameter name: type

With ScriptManager in Release mode it’d be:

Microsoft JScript runtime error: Object expected

But always in Sys.Component.Create – it looked like grid’s client-side scripts weren’t loading at all. After A LOT of digging I found out that the culprit was grid’s server-side Bands.Clear() method. When called, it caused client-side WHDG JavaScript not to load. When that method was commented – JavaScript errors disappeared. So until Infragistics comes out with a bug fix – if you experience similar problem, try to avoid Bands.Clear() method.

Prevent Cross Site Scripting thru hidden fields

By , 09/07/2011 10:32 AM

ASP.NET protects you pretty good when user tries to post a malicious content thru an entry form. With @page directive “ValidateRequest=true” (which is true by default) if anybody attempts to enter something like <script type=”text/javascript”>…nasty stuff here…</script> the page will throw HttpRequestValidationException exception: A potentially dangerous value was detected from the client…

But this does not work for some form elements, for example framework variables such as __EVENTVALIDATION or __VIEWSTATE over which user or developer do not have direct control. A maliciously crafted POST request can insert JavaScript into those elements which then can execute in user’s browser. Yes the page may crash because of invalid data, but JavaScript is still echoed to the client and gets executed. In this case ASP.NET needs a little help. Continue reading 'Prevent Cross Site Scripting thru hidden fields'»

WebHierarchicalDatagrid: Sys.ArgumentException: Cannot deserialize on Row Expand

By , 08/04/2011 4:53 PM

I have been using WebHierarchicalDataGrid with manual load on demand bands with a pretty good success until I hit this snag.

The WHDG has correctly displayed HTML fields before, but this time a column with HTML data (an HREF link to be precise) is needed as one of the grid’s DataKeyFields to provide uniqueness of the row:

WHDG with HTML column Continue reading 'WebHierarchicalDatagrid: Sys.ArgumentException: Cannot deserialize on Row Expand'»

Solution for UltraWebGrid missing scrollbars

By , 07/27/2011 10:40 AM

I was working with classic Infragistics UltraWebGrid when noticed strange thing – even though scrollbars were enabled for the grid, the grid had fixed size and number of rows was bigger than the grid could display – no scrollbars appeared. For me it was a combination of grid being shown in a modal dialog in IE7 browser, but it could happen in other scenarios.

I also noticed when grid experienced any kind of user interaction (row added, row selected, checkbox cell checked etc.) scrollbars would magically appear. So the solution? Simulate user interaction. For example this code can be included in grid’s client-side InitializeLayout event:

function xMyGrid_InitializeLayout() {
    var oGrid = igtbl_getGridById('xMyGrid')
    oGrid.Rows.getRow(0).setSelected(true);
    oGrid.Rows.getRow(0).setSelected(false);
}

What happens here is first row of the grid is selected and an instant later unselected. It happens so fast that there’s no visual indication. But the grid gets its “user interaction” and scrollbars appear.

Affecting page during WebDataGrid AJAX calls

By , 05/02/2011 5:18 PM

When Infragistics WebDataGrid perform AJAX operations such as sorting and paging – it sends grid data directly to page’s DOM. But it also allows you to send your own custom data via server-side GridResponse object and its client-side counterpart. This feature allows you to establish effective link between server and client to perform custom operations otherwise available only during full postback or partial postback via update panel. There’re multiple cases where this can be used, let’s take a look at 3 most common:

  • Updating a related control with server-side generated data
  • Running a server-side generated JavaScript
  • Handling server-side errors, for example Session timeout

Continue reading 'Affecting page during WebDataGrid AJAX calls'»

Implementing getNextRow in WebDataGrid

By , 04/25/2011 2:16 PM

UltraWebGrid had a very convenient getNextRow() client-side function which returns next row in row collection. WebDataGrid does not have an analog, but it’s pretty easy to recreate the functionality:

function getNextRow(i_oRow) {
      var iRowIndex = i_oRow.get_index();
      var aRows = i_oRow.get_grid().get_rows();

      return aRows.get_row(iRowIndex + 1)
}

This function accept grid row as a parameter, gets the row’s index and return row with incremented index from grid row’s collection.

Solution for ‘previousSibling’ is null or not an object error in grouped UltraWebGrid

By , 04/22/2011 11:38 AM

Infragistics UltraWebGrid offers standard keyboard navigation for record selection. For example you can click a row, and holding Shift key press Down Arrow to select multiple records. This works fine for a flat grid, but try this with grid in OutlookGroupBy mode and you’ll get an error ‘previousSibling’ is null or not an object:

Error selecting records in grouped UltraWebGrid

After some digging I found the culprit. Continue reading 'Solution for ‘previousSibling’ is null or not an object error in grouped UltraWebGrid'»

Run JavaScript from both full and partial ASP.NET postback

By , 03/03/2011 4:23 PM

A while back I posted a function that would run JavaScript from both full page postback and Infragistics async postback. But what if you’re using “normal” Microsoft AJAX where partial postbacks are controlled by ScriptManager and you need to run JavaScript on initial page load, full postback and from inside of Update Panel? And even in Infragistics the newer Aikido controls use ScriptManager for async communications.

Here is an overridden version of that RunJavaScript function for pages with ScriptManager:

Public Shared Sub RunJavascript(ByVal _
   i_oScriptManager As Web.UI.ScriptManager,  ByVal i_sJScode As String)

   If i_oScriptManager.IsInAsyncPostBack Then
      i_oScriptManager.RegisterStartupScript(i_oScriptManager.Page, _
      i_oScriptManager.Page.GetType, "JSCode" & Rnd(1).ToString, _
      i_sJScode, True)
   Else
      i_oScriptManager.Page.ClientScript.RegisterStartupScript( _
      i_oScriptManager.Page.GetType, "JSCode" & Rnd(1).ToString,
      i_sJScode, True)
   End If
End Sub

It accepts 2 parameters – ScriptManager control from the page and string with JavaScript code. Function checks if it’s an async postback and if so – calls ScriptManager’s RegisterStartupScript method, otherwise page’s RegisterStartupScript is used. Here’s an example of usage:

RunJavascript(Me.ScriptManager1, "alert('Hello world from any postback!');")

UltraWebGrid: Set filter icon when manually handling RowFilterApplying event

By , 03/02/2011 2:39 PM

If you’re using Infragistics UltraWebGrid and manually handling grid’s RowFilterApplying event by doing your own filtering/querying and then canceling the event by setting parameter e.Cancel = True, one of the side-effects is that column filter icon never changes to “applied” image.

To work around this limitation you need to change the image yourself. This involves 2 steps:

1st step – In the server side, code in RowFilterApplying event handler loops thru filtered columns, getting column index, filtered state and calling a JavaScript function that would actually set the image:

Protected Sub xmyGrid_RowFilterApplying(ByVal sender As Object, ByVal e As UltraWebGrid.FilterEventArgs) Handles xmyGrid.RowFilterApplying

    ' ... Your own filtering/querying code

    Dim xGrid As UltraWebGrid = sender

    For Each oFilter As ColumnFilter In xGrid.Rows.ColumnFilters
         If oFilter.FilterConditions.Count = 0 OrElse oFilter.FilterConditions(0).ComparisonOperator = FilterComparisionOperator.All Then
            RunJavascript(Me, "setFilterIcon(" & oFilter.Column.Index & ", 'MyImages/ig_tblFilter.gif');")
         Else
            RunJavascript(Me, "setFilterIcon(" & oFilter.Column.Index & ", 'MyImages/ig_tblFilterApplied.gif');")
         End If
    Next

    e.Cancel = True

End Sub

During the loop code double checks if filter is applied to current column and if so passes URL of “applied” filter image to the JavaScript function – in this case “MyImages/ig_tblFilterApplied.gif”. Otherwise URL of “empty” filter is passed – in this case “MyImages/ig_tblFilter.gif”. To generate JavaScript call from ASP.NET code I am using RunJavascript function which works correctly both on normal postback and Infragistics partial postback (read WARP panel).

2nd step – And here’s JavaScript function that sets the image:

// Set's filter icon of the specifiec column
function setFilterIcon(i_iColumnIndex, i_sFilterImageURL) {
    var sThId = igtbl_getGridById('xmyGrid').Bands[0].Columns[i_iColumnIndex].Element.id;
    document.getElementById(sThId).firstChild.lastChild.src = i_sFilterImageURL
}

Using passed in column index, code locates column object and its DOM “TH” element (note: You have to get an ID of the element first, and then locate element by calling document.getElementById, using Column.Element for some reason returns an empty TH tag). Once element is located, code locates filter image inside and sets its source to passed image URL

Panorama Theme by Themocracy

Switch to our mobile site