We are in the process of evaluating the igHierarcgicalGrid, but we have run into a problem. We managed to get it to work with just one level, but when we try to display a childband the grid does not render at all anymore.
We have a simple list of person objects which in turn have a list of appointments.
Could you show how to get the grid to display the persons with their appointments when using the Razor syntax?
Hi,
You can check out the igHierarchicalGrid samples at http://samples.infragistics.com/jquery/hierarchical-grid
In some of them (Multiple Levels Multiple Layouts and Row Selectors for example) you can open the Code View section (just below the sample grid)'s "SELECT SAMPLE SOURCE FILE TO VIEW" drop-down.
In there you will notice that there are 2 view pages available (.aspx is with MVC2's Spark view engine and .cshtml is with MVC3's Razor view engine).I think these Razor syntax samples will be exactly what you need.However, if have any problems, please let us know. Cheers and good luck,Borislav
After looking at the samples and playing around with our code some more we still did not manage to get it to work. When running our test in Firefox the grid does not appear at all, but when we run it in IE the following error occurs:
'length' is null or not an object ig.ui.min.js, line 1character 323973.
So I am wondering if we are forgetting something or if there is an error in the script. I have attached our project, so you might have a look at it.
At the present moment, the only way to have a column which you can use for an image button is to do as you suggest: add an empty column to your model.
The thing is, that the igGrid needs to bind to all of the columns it displays. Having a column that's not a part of the data you're feeding into the grid is actually called an "unbound column".The unbound column is one of the things on our developers' backlog of thing to do for the second release this year (2012.2) so you can look forward to it.Hope this helps you out.Cheers,Borislav
First off, I'm dvanmil's co-worker. We are both responsible for making the transition to MVC + JQuery + HTML5 and we are collecting suites. but before our CEO gives the OK to purchase suites we need to prove we can get existing functionality with new controls. Maybe it's also important to know we come from desktop development and find webdevelopment scary and javascript messy + a mystery.. :P
Having said this, back to the matter at hand...
I have added a property (read: column) to the model which I called AddRemarkPlaceHolder. For now I just simply want to get an image in this 'placeholder'. I understand from your previous remark the grid needs this placeholder because it doesn't support unbounded columns. Well, we can overcome this for now.
I've followed the example with the basic column templates which uses the function: "FormatterFunction". Well, we discovered it needs a javascript function as argument apparantly. No problem. a little scary, but we'll manage. So I came up with this column (watch out! Razor syntax in VB.NET :P):
column.[For](Function(x) x.AddRemarkPlaceHolder).FormatterFunction("function(val) {{var img = new Image(); img.src = ""http://files.softicons.com/download/application-icons/vista-symbol-icons-by-lokas-software/png/256/903550-button-ok.png""; return img; }}")
As you can see I have no clue what i'm doing and i naïvely try to return an HTML IMG element which i've created in this small Javascript function. The result however is that the grid displays in this column the following:
[objectHTMLImageElement]
A part of me hoped for some XAML magic (oh my gosh how I love XAML), but alas no rainbows and unicorns this time.
So, tell me... What do I need to return in the javascript to get an image to be displayed in that column?Or am I doing it wrong all together?
p.s.: And perhaps some more feedback from your customers. Please decorate your classes, properties and methods with the XML decorations, like so:
''' <summary> ''' Returns a collection of Foos ''' </summary> ''' <returns></returns> ''' <remarks></remarks>GetFoos() as List(Of Foo)
This will provide IntelliSense with information and makes your classes self documenting.
Well, you can pass it along to the developers and thnx in advance for considering and also for your answer back. :)
Hi Danny and dvanmil,Don't worry guys! IG team's here to the rescue! Danny, you're actually pretty close to the expected outcome ;). However, when you use a formatter function you need to return the value either as it was received OR as a string, because ultimately what you return will be used as the cell's innerHTML. With that in mind, you don't need an Image object (sorry - you can't serialize it as a string (JavaScript's toString() on objects sucks :(:( ). What you need is to concatenate the string for the cell's value like so: column.[For](Function(x) x.AddRemarkPlaceHolder).FormatterFunction("function(val) {{return '<img src="http://files.softicons.com/download/application-icons/vista-symbol-icons-by-lokas-software/png/256/903550-button-ok.png">'; }}") By the way I intentionally delayed my reply so that I can give you official links to some of the new stuff in our new release (it came out just a few hours ago :D) that relate to your question about custom formatting.In the new release (2012.1) we've devised our own IG templating engine which can help you out in such situations. If you are interested, I suggest getting familiar with it via:http://samples.infragistics.com/jquery/templating-engine http://help.infragistics.com/Help/NetAdvantage/jQuery/2012.1/CLR4.0/html/Infragistics%20Templating%20Engine.html
PS: I'm afraid that I don't understand your PS - why do you mention the IntelliSense-friendly triple-apostrophe comments? Sure, they're very nice, but why do you mention them?PPS: I wish lots of luck and clear-head-ed-ness to both of you guys! My personal advice to you would be to be methodical in your approach to web-based technologies - they become easier once you understand them and much scarier if you don't understand them (yep - understanding = reading + banging thy head with problems). Cheers!Borislav
To add to what my collegue said I understand entirely now how currently the FormatterFunction works because of your example. Thanks! I suspected JavaScript calls by default some ToString() function (just like in .NET) but I didn't know how to solve this in Javascript.
We are currently busy with the new samples you provided from 2012.1 and we'll post again if we have any questions.
As for the 'PS' that was a comment not related specific to this problem. So i don't know if you want this in another thread. You asked why I mentioned them. Well, because right now Infragistics doesn't provide them. So IntelliSense has no information right now on Infragistic's controls. Which makes you guess what parameter is exactly needed in a method or what the function of a method is.
A good example is the FormatterFunction. When you hit the first '(' IntelliSence pops up and says: FormatterFunction(FormatterFunc As String) with no description of what this method does and what the parameter FormatterFunc needs. Might as well be a Delegate to a VB.NET method which we convert to a String by calling ToString (ridiculous example ofcourse but you get the idea), but apparantly it needs Javascript as a String.
It was a suggestion for the dev team. ;)
Hi Danny,
Actually, we do provide IntelliSense-friendly comments in our code - it's a mystery to me why they didn't come up (they don't come up for me sometimes as well - maybe in ~10% of the cases).Actually our entire MVC help is crated from those Intellisense-friendly comments - just take a look at:http://help.infragistics.com/Help/NetAdvantage/jQuery/2012.1/CLR4.0/html/Infragistics.Web.Mvc~Infragistics.Web.Mvc_namespace.htmlhttp://help.infragistics.com/Help/NetAdvantage/jQuery/2012.1/CLR4.0/html/Infragistics.Web.Mvc~Infragistics.Web.Mvc.GridColumn_properties.html(here you can find the FormatterFunction property's description)Cheers!Borislav