Data Grid Recommendation

We are looking to add data grid functionality to our Apex app and am looking for any suggestions. Ideally it should be able to sort, resize, re-arrange and hide/show columns as well as load data asynchronously using the results of an AJAX request. Being able to resize the entire grid would also be nice.
I have seen references to integrating ExtJS into Apex but also have seen comments that it is written for an older version. Does anyone know if this is still correct?
I have also been looking at stand-alone jQuery plugins but am not sure how much work will be involved integrating this with Apex. Does anyone have experience with this?
Any help, pointers, suggestions, gotchas, etc would be appreciated.
Thanks,
Mark

Below is all of the JavaScript code. I found that, because Apex does not follow the standard method for passing parameters (sounds more like something Microsoft would do) you have to override the method used to send the data to the server. Also, since there is no way to change the content-type response header from 'text/html' (as far as I can find) you must also parse the resulting JSON string. Both of these actions are performed within the getPromoData function.
I haven't done more than get the table to display with pagination working so there may be other issues I run into along the way. I shouild also note that we are using Apex 4.0 and I understand there have been improvements in AJAX processing in Apex 4.2, so that may change things (hopefully for the better).
<link rel="stylesheet" type="text/css" media="screen" href="&WORKSPACE_IMAGES.ui.jqgrid.css" />
<script src="&WORKSPACE_IMAGES.grid.locale-en.js" type="text/javascript"></script>
<script src="&WORKSPACE_IMAGES.jquery.jqGrid.min.js" type="text/javascript"></script>
<script type="text/javascript">
* Manually retrieve JSON data due to Apex parameter handling
function getPromoData(pdata) {
  $.ajax({
    type: 'POST',
    contentType: 'application/json; charset=utf-8',
    url: 'f?p=&APP_ID.:&APP_PAGE_ID.:&APP_SESSION.:APPLICATION_PROCESS=Promo_Item_Query:::P70027_TABLE_PAGE,P70027_TABLE_ROWS,P70027_TABLE_SORT_INDEX,P70027_TABLE_SORT_DIR:' + pdata.page + ',' + pdata.rows + ',' + pdata.sidx + ',' + pdata.sord,
    success: function(data, textStatus) {
      try {
        var json = eval('(' + data + ')');
        $('#promoTable')[0].addJSONData(json);
      catch(e) {
        alert('Error parsing data.\n' + e);
    error: function(data, textStatus) {
      alert('Error retrieving data.\n' + textStatus);
* Initialize the grid
jQuery(document).ready(function(){
  jQuery("#promoTable").jqGrid({
    datatype: function(pdata) {
      getPromoData(pdata);
    mtype: 'POST',
    colNames: ['Id', 'Create Date', 'Promotion Name', 'Description', 'PH Promo Ranking'],
    colModel: [
      {name: 'id', index: 'id', width: 55, align: 'right'},
      {name: 'createDate', index: 'creation_date', formatter: 'date', align: 'right', width: 90},
      {name: 'name', index: 'name', width: 200},
      {name: 'description', index: 'description', width: 500},
      {name: 'ranking', index: 'ranking', width: 110, align: 'right'}
    pager: '#promoPager',
    rowNum: 5,
    rowList: [5, 10, 20],
    sortname: 'id',
    sortorder: 'desc',
    viewrecords: true,
    caption: 'General Promotion Setup'
</script>

Similar Messages

  • Text in data grids doesn't display

    With the new 29 version of FireFox, data grids on our site don't seem to display the data in the grids any longer. When using Chrome or IE11, these still show just fine. Version 28 and earlier worked great. The menu system in our site doesn't work well any longer either using version 29.
    What we are seeing on this site was also seen with IE11 when it first came out but that was easily fixed by just using the "compatability" settings in IE11 and adding our site to the list of compatible sites. There isn't such a setting in FireFox so I wonder how we go about getting around this.

    Thanks for the offer but we no part of this site can be publicly accessed. The thought of a font causing the problem doesn't make much sense to me because it was working fine prior to version 29. Why would the font all of a sudden be causing the problem. Furthermore, it isn't just text in data grids but the menu system we use doesn't work properly either. You have to hold down on the left mouse button to use the menu and then when you are on the item you want to select, let off the left mouse button. Guess our only option is to start recommending Chrome or IE.

  • Reading a csv file and bind to a data grid

    hi. doing a school project and been searching. the application reads a csv file from c:\stocklist.csv, and then this in a button called btnLoadData, and now need to read in a data control called DmgDisplayData. do i put the code in the button, or in the
    data grid. been searching, but cannot seem to find any thing. so, where do i put the code, in the data control, and does any one have an example code how to read into the data fields. also need to have one field, able to edit, the other three or four fields,
    read only. can any one help me out. never covered this in the subject, but did do file streams a few years ago in vb, but usin g c#,a dn the help in visual studio, not that helpful, with a blind person using a screen reader, jaws for windows from http://www.freedomscientific.com,
    and using visual studio 2013 community edition. can any one help me out, been searching and trawling about 15 to 20 pages so far, and did try a couple of sites, but could not find, any help. thanks. the application is to read a csv file from a button, and
    load into a data grid, then have a message box, saying file load successful, then have one field, order on as edit, but the other fields, read only, so do i need the navigator buttons, for next, back, previous, etc, and how do i code that as well. not to do
    it for me, want to learn, but maybe some sample code, did do navgiator controls, years ago for a vb project, but need the c # example for that, thanks. then you have a button, Save data, that saves the csv file in the data grid. so can google for that. then
    have a toolbar, with a button saying, Sort Items, a tool strip, and when you click on that button, you have a drop down list, of three items, then a sort button, which will then sort the array in the data grid. so, do i need another form, or just do the combo
    box as an invisible control, then just refrence, that in the toolbar. so need to use th file class and an array, learnt about single and multi arrays. any ideas. thanks.
    http://startrekcafe.stevesdomain.net http://groups.yahoo.com/groups/JawsOz

    Hi Marvin,
    -->where do i put this, in the data grid click event. or in the form load event. thanks.
    You could use this code after you initialize the DataGridView. you could put it in the form load event.
    -->what about how get the tool bar and the combo box and another button, then sort from the combo box on the array for the collumns, for to set focus to the first read collumn for the data grid. how do i do that, close the parent form, and have another
    form on the toolbar.
    Since this is another issue of this thread, I would recommend you posting it with
    another thread. We will focus on that thread to help you. Thanks for your
    understanding.
    BTW, Before you asking questions, I suggest you could learn to make it by yourself. You could begin to learn winforms in MSDN articles:
    https://msdn.microsoft.com/en-us/library/dd30h2yb%28v=vs.110%29.aspx?f=255&MSPPError=-2147217396. Or Google it, you will get many answers. In that way, you will learn more from the questions.
    Best regards,
    Youjun Tang
    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click
    HERE to participate the survey.

  • How to add a checkbox coulmn to my Data Grid row?

    Dear All ,
    I have a Data Grid which have lets says 6 columns. I want to add anew column which allow the user to select it or not. Meaning if the user select the box a hack will be shown.
    I want to you this coz I have a function which send an email to the user if the line (Invoice line) if selected. Now if there is more than one invoice (Line) I want the user to first select the checkbok and send press the send function button.
    Later on I will create a loop in the Send function which will only send mails if the line check box is checked.
    Would you please help me :)
    Ps: I am using ligth switch 2008   (C#)
    Thanks,
    Zayed

    Hello Zayed
    I would recommend that you read through this brilliant article by
    Paul van Bladel here or even look at a post on
    this forum by Sven Elm. I have looked at and followed these in the past and it works perfectly.
    If you found this post helpful, please mark it as helpful. If by some chance I answered the question, please mark the question as answered. That way you will help more people like me :)

  • Data grid performence

    Hi ,
    We are developing a real time application and using data grid
    for data rendering.
    At least 4/5 data grid rows are being updated within one
    second. For each updating data grid refresh all the visible rows
    and hence it get refreshed 4/5 times in one second. This eats very
    much CPU time.
    Can any one suggest me how I can update a particular cell/row
    without refreshing other cell/row data grid.
    Thanks
    Manish BIllore

    Hi Prakash,
    Increase the performance of the database can be related to many areas.
    If you think that your database performance is poor, please check the following topics.
    Hardware
         You need to detect if you have any hardware contation (I/O, Memory, CPU)
    Operating System configuration.
         File system/disk distribution.
         Kernel parameters as recommended by SAP/Oracle (Unix)
         Other configurations recommende.
    Oracle Profile
         Review your Oracle profile to identify possible problems in instance's configuration.
    Application
         You need to identify if the performance problem is related to all system, or only by a determined transaction or process.
    As you can see, performance its a long subject.
    If you can detail your environment and your performance problem, includding your configuration, I will try to help you.
    Regards,
    Itamar Marioto

  • Data grid for jsp applications

    Someone knows where i can get a good data grid (free or cost ) for JSP applications

    I just stumbled across this thread as we are developing a stateless BSP application and plan to use model binding in it.
    For our application the part of the models state that changes is displayed in the view in form fields, so our idea is to reload the model from the db in the doInitattributes-Method and let the model binding do the rest of the work filling in the values that changed in the view. It seems to work so far - so i guess persisting the state of the object to the db is only necessary when something changed that is not part of the view, right?
    My second question is on Brians recommendation to use MVC only at exactly one level. Is using Sub-Controllers a problem when they have got their own model? I guess the extra work Brian mentions is all about telling the subcontrollers which model to load, right?
    It would be good to know if there are any serious pitfalls when using a hierarchy of controllers instead of a controller with a collection of views.
    Martin

  • Display value in data grid

    08/29/2008 08:58:48 AM
    Reply | Quote | Top | Bottom | Edit
    hi all,
    i have two classes.
    class User
    public String name;
    public int age;
    public Address address;
    class Address
    public String city;
    I'm passing a List<Users> to the data provider of a
    data grid . I can display the values of properties of Users i.e,
    name and age.. My issue is how do i display the value of city which
    is a propertyt of Address class in the datagrid column..
    thanx in advance
    Mark this message as the answer.
    Print this message
    Report this to a Moderator

    Hi,
    Try labelFunction property of the DataGridColumn.
    labelFunction allow you to specify a function name, which will be
    invoked when that data is rendered. You will get the Object (User
    id your case) corresponding the row being rendered will be passed
    as argument to the function. You can use the object and return the
    value you want to be displayed.
    Please find more details on labelFunction at the URL below
    http://livedocs.adobe.com/flex/3/langref/mx/controls/dataGridClasses/DataGridColumn.html#l abelFunction
    You can also try custom item renderer.
    Hope this helps.

  • Can not open data grids or run reports in HFM

    Hi
    We created an application and have been working in it for weeks without any issues. Just recently once we open the app, we can longer open data grids or run financial grids. The system just hangs and we do not get an error message. Has anyone experienced this? We are wondering if it is a space issue on one of the data base tables.

    Hello,
    I would start by checking with your DBA to see if you have any issues with table space. Next, i would log onto the HFM servers and see if you have any errors being recorded in the Application Event View. If you do have errors in your Event Viewer, can you please post them?
    Thanks
    Edited by: tonyfeole on Oct 13, 2009 1:33 PM

  • FillBy always fills in the same row in data grid view. How to make it fill in a new row for each click of the Fillby Button? VB 2010 EXPRESS?

    Hi there, 
    I am a beginner in Visual Basic Express 2010. I have a Point of Sale program that uses DataGridView to display records from an external microsoft access
    database using the fillby query. 
    It works, but it repopulates the same row each time, but i want to be able to display multiple records at the same time, a new row should be filled for
    each click of the fillby button. 
    also I want to be able to delete any records if the customer suddenly decides to not buy an item after it has already been entered. 
    so actually 2 questions here: 
    1. how to populate a new row for each click of the fillby button 
    2. how to delete records from data grid view after an item has been entered 
    Thanks 
    Vishwas

    Hello,
    The FillBy method loads data according to what the results are from the SELECT statement, so if there is one row then you get one row in the DataGridView, have two rows then two rows show up.
    Some examples
    Form load populates our dataset with all data as it was defined with a plain SELECT statement. Button1 loads via a query I created after the fact to filter on a column, the next button adds a new row to the existing data. When adding a new row it is appended
    to the current data displayed and the primary key is a negative value but the new key is shown after pressing the save button on the BindingNavigator or there are other ways to get the new key by manually adding the row to the backend table bypassing the Adapter.
    The following article with code shows this but does not address adapters.
    Conceptually speaking the code in the second code block shows how to get the new key
    Public Class Form1
    Private Sub StudentsBindingNavigatorSaveItem_Click(
    sender As Object, e As EventArgs) Handles StudentsBindingNavigatorSaveItem.Click
    Me.Validate()
    Me.StudentsBindingSource.EndEdit()
    Me.TableAdapterManager.UpdateAll(Me.MyDataSet)
    End Sub
    Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
    'TODO: This line of code loads data into the 'MyDataSet.Students' table. You can move, or remove it, as needed.
    Me.StudentsTableAdapter.Fill(Me.MyDataSet.Students)
    End Sub
    Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click
    Me.StudentsTableAdapter.FillBy(Me.MyDataSet.Students, ComboBox1.Text)
    End Sub
    Private Sub Button2_Click(sender As Object, e As EventArgs) Handles Button2.Click
    Me.MyDataSet.Students.AddStudentsRow("Jane", "Adams", "Female")
    End Sub
    End Class
    Get new key taken from
    this article.
    Public Function AddNewRow(ByVal sender As Customer, ByRef Identfier As Integer) As Boolean
    Dim Success As Boolean = True
    Try
    Using cn As New OleDb.OleDbConnection With {.ConnectionString = Builder.ConnectionString}
    Using cmd As New OleDb.OleDbCommand With {.Connection = cn}
    cmd.CommandText = InsertStatement
    cmd.Parameters.AddWithValue("@CompanyName", sender.CompanyName)
    cmd.Parameters.AddWithValue("@ContactName", sender.ContactName)
    cmd.Parameters.AddWithValue("@ContactTitle", sender.ContactTitle)
    cn.Open()
    cmd.ExecuteNonQuery()
    cmd.CommandText = "Select @@Identity"
    Identfier = CInt(cmd.ExecuteScalar)
    End Using
    End Using
    Catch ex As Exception
    Success = False
    End Try
    Return Success
    End Function
    In closing I have not given you a solution but hopefully given you some stuff/logic to assist with this issue, if not perhaps I missed what you want conceptually speaking.
    Additional resources
    http://msdn.microsoft.com/en-us/library/fxsa23t6.aspx
    Please remember to mark the replies as answers if they help and unmark them if they provide no help, this will help others who are looking for solutions to the same or similar problem.

  • Coded UI: How to verify watermark displayed in the fields and Data grid?

    Hi,
    I've an requirement to verify watermark in the fields say username field displays "Username" water mark when no data is available in the field and water mark in data grid saying "No data available".
    Please observe the water mark displayed in screenshot below:
    So how to verify watermark?
    Thanks & Regards,
    Sunil
    Best Regards, Sunil Email: [email protected]

    Hello,
    Depending on what form technology you are using, you can try posting to one of the following forums:
    Windows Forms General
    Windows Presentation Foundation (WPF)
    ASP.Net forums
    Karl
    When you see answers and helpful posts, please click Vote As Helpful, Propose As Answer, and/or Mark As Answer.
    My Blog: Unlock PowerShell
    My Book:
    Windows PowerShell 2.0 Bible
    My E-mail: -join ('6F6C646B61726C406F75746C6F6F6B2E636F6D'-split'(?<=\G.{2})'|%{if($_){[char][int]"0x$_"}})

  • Want Access Data Grid control in SharePoint 2013?

    Hello everyone!
    Recently we noticed something funny in SharePoint 2013. While quite many people were hoping to have the datasheet view like those in SP2007 and 2010, Microsoft has chosen a different interface to display datasheet view.
    Now, if you try to create a sub site under a publishing site, and use the
    Publishing Site template then try to create a datasheet view in the sub site, SharePoint will try to use the Access data grid control to display the view. In some situations the view will display and other situations it will not, and will show this
    error:
    The list is displayed in Standard view. It cannot be displayed in Datasheet view for one or more of the following reasons: A datasheet component compatible with Microsoft SharePoint Foundation is not installed, your browser does not support ActiveX controls,
    a component is not properly configured for 32-bit or 64-bit support, or support for ActiveX controls is disabled.
    If you create a sub site using Publishing Site with Workflow instead, then the datasheet view will be created properly using SP2013 interface.
    Using PowerShell, we can see that both Publishing Portal and
    Publishing Site With Workflow are using the BLANKINTERNET 53 template. The
    Publishing Site on the other hand is using the CMSPUBLISHING 39 template.
    Want to try it out and let me know if that happens to your SharePoint too?

    Hi Conway,
    I tested the issue in my environment per your description and it returned the results as below:
    I created a subsite using Publishing site under a team site in SharePoint server 2013, the datasheet view in a list displayed as pic1
    I reproduced the issue in SharePoint server 2010, the datasheet view in a list displayed as pic2
    It turns out by design the datasheet view in the subsite based on Publishing site template displays as your situation. Here is an article which explains this:
    http://www.sharepointblues.com/2010/03/31/data-sheet-view-not-working/
    Regards,
    Please remember to mark the replies as answers if they help and unmark them if they provide no help. If you have feedback for TechNet Subscriber Support, contact
    [email protected] .
    Rebecca Tu
    TechNet Community Support

  • Problem in Data Grid

    Hi All,
    Account calculations are not displaying on the data grid. But the values are being picked up with a smart view report.
    I tried running a force calculate and a consolidate all, but that did not work.
    Please suggest in this regards.
    Thanks in advance....

    I tried to use your algorithm to modify my code but i am not able to do that. For this example i am not using any httpservice i am  using data services. I created a PHP file i just need to import it into data services planel and drag that services onto data grid it will automatically bring all the data into that data grid.  Can you tell me what i need to modify to achive my goal. am using following code
    protected function dataGrid_creationCompleteHandler(event:FlexEvent):void
    getHorizontalCommentResult.token = horizontalCommentsService.getHorizontalComment();
    <mx:DataGrid x="159" y="123" id="dataGrid" creationComplete="dataGrid_creationCompleteHandler(event)" dataProvider="{getHorizontalCommentResult.lastResult}" height="223" width="245">
    <mx:columns>
    <mx:DataGridColumn headerText="Comments" dataField="Comments"/>
    </mx:columns>
    PP file
    <?php
    class HorizontalCommentsService{
    public function getHorizontalComment() {
    $connection = mysqli_connect("localhost", "root", "root", "my_db", 8889) or die(mysqli_connect_error());
    $sql = "SELECT * FROM photo_comments ORDER BY Image_ID DESC";
    $result = mysqli_query($connection, $sql) or die('Query Failed: ' . mysql_error($connection));
    $rows = array();
    while($row = mysqli_fetch_object($result)) {
    $rows[ ] = $row;
    return $rows;
    ?>

  • BUG in data grid and run script (V1 1467)

    Hi,
    I found a weird bug in data grid when displaying data defined as NUMBER(10,0).
    We have a table with a column defined as NUMBER(10,0). Whenever this column contains data >5000000000 the data in the row shows up as null (empty cell) in the data grid.
    I played around a bit and found that running a scrip like select * from testtab where a > 5000000000; with F5 it stops at the first number >5000000000. Running the script with F9 shows all rows correct.
    I'm running on WIN2000 using SQL Developer V1 (Build 1467).
    The error was not present in Build 1422.

    I tried the SQL you supplied (by the way, the table name helps in the INSERT statement) and then went to the DATA tab to view the data.
    Interesting results.
    Even though all of the insert statements executed successfully, only 2 of the rows had any data displaying in columns A and C. All rows had data in column B.
    Now for the real fun: by selecting one of the empty cells the "missing" data would appear. Try a commit (yeah, I know nothing has been updated, but SQL Developer doesn't know this) and check out the UPDATE statements that are generated in the log. The cells I selected are being updated with the "missing" data. Refresh the display and the data goes into hiding again.
    I don't even want to get into the dangers of a tool updating data when all you've done is to get focus on a field. I've already seen it wipe out the time portion of date/time stamps simply because the default setting for the date/time format does not include the time.
    Good start on a tool guys, but it's not quite ready for Prime Time.
    BTW...I'm using Oracle 9.i running SQL Developer on Windows 2000.

  • Extra row in data grid

    after I load a object into data grid created from a web
    service it will always seem to create a new blank row. When I get a
    error after clicking on it, it always says "-1" for the rows count.
    when I shrink the size of the datagrid it elminates some of the
    extra row, but still there is a bit of it showing. how do I resize
    the datagrid so it doesn't spit out a extra row, or a part of one.
    http://www.ctrlzsc.com/other/pic.png
    this is a pic showing the extra row, just look where my badly drawn
    arrow is pointing to.

    hi, xyco45
    you can set the dataGrid's height and the rowHeight. In my
    experience, for example, first, you set the headerHeight="25" and
    rowHeight="22", the height will be setted
    (headerHeight+rowHeight*(rowNumbers)+1) or
    (headerHeight+rowHeight*(rowNumbers)+2), I thought this question
    will be solved.

  • Hiding Column in Data Grid

    Is there is way to hide a column in data grid column?
    Is it possiblo to reorder the column like in excel . I know its not possible bcoz it <table> tag ...

    Select the column within the table and in the property window uncheck the visible. You can also include visible="false" in the jsp page within the column tag.

Maybe you are looking for