|
|
Rank: Newbie
Groups: Member
Joined: 9/15/2010
Posts: 8
|
I am new in using the EO Web controls. I am looking for some help on the following scenario:
I have a grid for data entry with new rows being added once the user enters one. The columns are Qty, Item#, Desc, Price & Availability. The user has to enter the Qty and the Item# and I need to query the database on the backend to get the rest of the values and populate them in the grid. I am not able to get the postback from the Item# field to happen. I have tried using the CustomColumn and the TextboxColumn but still not able to do it. Not sure what I might be doing wrong.
Does anybody has some code sample that would show me how to do this correctly? Thanks in advance.
|
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,194
|
Hi, Here is a working sample about this: http://demo.essentialobjects.com/Demos/Grid/Features/Custom%20Column%20-%20Advanced%202/Demo.aspxNote that even though the sample is a "Custom Column" sample, you do not have to use "Custom Column" to do the update. The Custom Column in this sample is mainly for displaying the drop down. You can trigger the update in anyway you want, even from elements that are totally unrelated to the Grid, for example, a timer. Thanks
|
|
Rank: Newbie
Groups: Member
Joined: 9/15/2010
Posts: 8
|
But how do i trigger the postback then? I looked at the sample, and there is a javascript method tied to the onchange of the dropdown (onchange="on_product_change()") which in turn triggers the postback or calls the javascript that raises the ItemCommandEvent. Let me know if my understanding is incorrect there. so, how do I do that using a textboxcolumn? Because ultimately I just need a textbox that would postback (ajax way) and update the rest of the cells on that row, maintaining its own value.
|
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,194
|
Hi, There are three questions here: 1. How to trigger Javascript code from the TextBoxColumn. This usually depends on when. Usually you would trigger something from the columns' ClientSideEndEdit handler. This is a property on the GridColumn that takes a Javascript function name. So you will create a JavaScript function in your code and once a text box cell leaves edit mode, it will call that function. Inside that function you can do whatever you would like to do with JavaScript. If you wish to trigger a post back, you will need to use setTimeout to delay the actual code. For example:
Code: JavaScript
//Change this function name to anything you'd like then set the
//column's ClientSideEndEdit to the name of this function
function your_client_side_end_edit_handler(cell, newValue)
{
//Use a timer to trigger your code later
setTimeout(function()
{
//put your code that triggers post back at here
//this code will be called AFTER
//your_client_side_end_edit_handler returns
.....
}, 10);
return newValue;
}
2. How to raises a post back through JavaScript. There is a generic ASP.NET programming question that is not related to our product. You can use raisesItemCommandEvent or anything else that you have; 3. How to make an AJAX postback. This part has nothing to do with the Grid. You can use our CallbackPanel to do that through whatever other way you may have any other way to make an AJAX call to the server. Whatever method you use it is unrelated to the Grid. So it will be easier to get #1 and #2 working first and then worry about this one. Hope this helps. Thanks
|
|
Rank: Newbie
Groups: Member
Joined: 9/15/2010
Posts: 8
|
Great! Thanks so much for that. You guys are great!!! I was missing the timeout part and was trying do it all at once. This has fixed the issues and I am able to get the details back from the codebehind.
One other question that I have on this is how can I show an image after the postback has happened and I got the results from the server? So continuing on the previously mentioned scenario, I also have a Valid/Invalid column on the same grid that needs to show an image if its a valid item# that the user has entered. Once I get the details back from the server, i have hide show this image. I could not find an image type column. I tried using the customcolumn, but the image only shows when I click on that cell (probably only visible when in edit mode). Can you kindly point me the right direction?
|
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,194
|
Hi, You would use a StaticColumn to display the image. You can set the column's DataFormat as something like "<img src='{0}' />" and then set the cell value as your image Url. At runtime, the Grid will use DataFormat to format the cell value and display the result string as raw HTML inside the cell. Thanks
|
|
Rank: Newbie
Groups: Member
Joined: 9/15/2010
Posts: 8
|
That works for me... Thanks a lot. Really appreciate your help on this!
|
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,194
|
Great. Glad that we helped!
|
|
Rank: Newbie
Groups: Member
Joined: 9/15/2010
Posts: 8
|
ok, one more question on this. Is there a way to pass two parametsrs to the DataFormat field like the one below? If so, how do I assign it from the code behind to the cell?
Code: Visual Basic.NET
<eo:StaticColumn HeaderText="Val" DataFormat="<img src='{0}' title='{1}' />"></eo:StaticColumn>
|
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,194
|
Hi,
There is no direct way to do that. There are two workarounds:
1. Preformat your HTML in your server side code, then set your GridCell's Value property directly to the result HTML. This bypasses DataFormat (so you will need to clear DataFormat);
2. Use CustomColumn and handle the columns' ClientSideGetText. In a way ClientSideGetText is the JavaScript version of "DataFormat". You can implement anything logic with JavaScript with ClientSideGetText. For example, you can return the desired HTML code based on your cell value. If you need values from multiple data fields, you can use hidden columns to carry values of additional fields to the client side. You can then use our client side JavaScript interface to access multiple cell values and return the desired HTML code based on these values.
Thanks!
|
|