jQWidgets Forums

jQuery UI Widgets Forums Grid grid status bar

This topic contains 5 replies, has 2 voices, and was last updated by  Peter Stoev 11 years, 10 months ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
  • grid status bar #16192

    Hi,
    I would like to display datetime picker in in my grid status bar, here is the code

    ...........
    ...........
    renderstatusbar: function (statusbar) {
    // appends buttons to the status bar.
    var container = $("<div style='position: relative; margin: 5px;'></div>");
    var xlsButton = $("<div style='float: left; margin-left: 5px;margin-top:2px;'><img style='position: relative; margin-top: 1px;' src='resources/images/excel.png'/><span style='margin-left: 4px; position: relative; top: -10px;'>EXCEL</span></div>");
    var pdfButton = $("<div style='float: left; margin-left: 5px;margin-top:2px;'><img style='position: relative; margin-top: 1px;' src='resources/images/pdfs.png'/><span style='margin-left: 4px; position: relative; top: -10px;'>PDF</span></div>");
    var datePicker = $("<div style='float: left; margin-left: 5px;margin-top:2px;' ></div>");
    container.append(datePicker);
    container.append(xlsButton);
    container.append(pdfButton);
    statusbar.append(container);
    datePicker.jqxDateTimeInput({
    width : '110',
    height : '30',
    theme : "fresh"
    });
    ...............
    ..............

    the output is this,

    why the text inside datetimeinput is way below normal.

    I checked with chrome debugger(inspect element), and it seems like if i changed the ‘top’ properties of ‘input element’ the text displayed properly, but I have no control over the ‘input’ of the datetime element.

    please instruct me how to define the properties of the ‘input” element inside the datetime input.

    Thanks

    grid status bar #16193

    Peter Stoev
    Keymaster

    Hi darkcloudbird,

    It the Grid’s DIV tag visible while you initialize the widget?

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com

    grid status bar #16195

    hi thanks for the quick response, but I am not quite clear about your question,

    here is the design flow anyway.

    1. the main grid displays with some text and a “Check” button column
    2. when I click the Check button from the main grid, it will open a new window ‘jqxwindow”
    3. the sub table (shown above) displays on the jqxwindow
    4. it seems to render the status bar correctly, but just the datetimeinput is sort of ugly.

    grid status bar #16196

    Peter Stoev
    Keymaster

    Hi darkcloudbird,

    Do you initialize the sub Grid in the jqxWindow’s initContent function? I am asking about that because widgets inside jqxWindow are supposed to be initialized in its initContent callback.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com

    grid status bar #16201

    no sir,

    i initialized the sub grid (with no data), after I initialized the main grid. when the user clicks the button the sub grid is “updatebounddata”-ed using the id on the main grid.

    1. init main grid
    2. init sub grid
    3. init window, but hidden
    4. user clicks button on the main grid
    5. get rowdata(id) from the main grid
    6. the window is ‘show’-ed
    7. get the data from server (json) using the id and ofcourse the datasource and dataadapter are changed dynamically
    8. the sub grid is ‘updatebounddata’-ed.

    for the status bar
    I just the followed the example from demo page. I can see the buttons working correctly but I could not find any other widgets example within the grid status bar.

    http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/index.htm#demos/jqxgrid/statusbar.htm

    anyway, how could I correctly use ‘initContent’ for jqxwindow? and I never read about it before.

    Thanks a lot for your help.

    grid status bar #16202

    Peter Stoev
    Keymaster

    Hi darkcloudbird,

    All samples with jqxWindow available online use “initContent”. You may take a look at any of the samples.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.