jQWidgets Forums

Forum Replies Created

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • in reply to: Expander and a grid Expander and a grid #54936

    arikbd
    Participant

    Hi Dimitar,

    Thanks.

    I have a follow up on that:

    I create an expander and then I dynamiclly create its content according to some settings I read from the DB. then I set the content of the Expander.
    It seems to work fine until this grid issue (It was working and I cannot say exactly when it stopped working, I upgrade to the new version and I saw it is not working, but downgrading does not solve the problem).

    This is example of what I do (This demo works, I get this error:

    Uncaught TypeError: Cannot read property 'length' of undefined jquery-1.10.2.js:631
    jQuery.extend.each jquery-1.10.2.js:631
    b.extend._updatehiddenrows jqxgrid.js:7
    b.extend._updaterowsproperties jqxgrid.js:7
    a.extend.sortby jqxgrid.sort.js:7
    b.extend.databind.dataview.update jqxgrid.js:7
    b.jqx.dataview.databind.z jqxgrid.js:7
    b.jqx.dataview.databind.k jqxgrid.js:7
    i.jqx.dataAdapter.callDownloadComplete jqxdata.js:7
    i.jqx.dataAdapter.dataBind.xhr.i.jqx.data.ajax.success jqxdata.js:7
    jQuery.Callbacks.fire jquery-1.10.2.js:3048
    jQuery.Callbacks.self.fireWith jquery-1.10.2.js:3160
    S jqxdata.js:7
    i.jqx.data.ajaxTransport.send.H
    <div id='jqxExpander'>
        <div>Header</div>
        <div>
    
        </div>
    </div>
    
    $("#jqxExpander").jqxExpander({
           width: 600,
           height: 600,
           theme: 'energyblue',
           expanded: false,
             initContent: function () {
    
           }
       });
    
       var strHTML = "<input type='button' id='jqxButton' value='Button' /><div id='mygrid'></div>";
       $("#jqxExpander").jqxExpander('setContent', strHTML);
       
       var data = new Array();
       var firstNames = [
           "Andrew", "Nancy", "Shelley", "Regina", "Yoshi", "Antoni", "Mayumi", 
            "Ian", "Peter", "Lars", "Petra", "Martin", "Sven", "Elio", "Beate", "Cheryl", "Michael", "Guylene"
       ];
       var lastNames = [
           "Fuller", "Davolio", "Burke", "Murphy", "Nagase", "Saavedra", "Ohno", "Devling", "Wilson", "Peterson", 
           "Winkler", "Bein", "Petersen", "Rossi", "Vileid", "Saylor", "Bjorn", "Nodier"
       ];
       var productNames =
       [
          "Black Tea", "Green Tea", "Caffe Espresso", "Doubleshot Espresso", "Caffe Latte", "White Chocolate Mocha", 
          "Cramel Latte", "Caffe Americano", "Cappuccino", "Espresso Truffle", "Espresso con Panna", "Peppermint Mocha Twist"
       ];
       var priceValues = [
           "2.25", "1.5", "3.0", "3.3", "4.5", "3.6", "3.8", "2.5", "5.0", "1.75", "3.25", "4.0"
       ];
       for (var i = 0; i < 50; i++) {
           var row = {};
           var productindex = Math.floor(Math.random() * productNames.length);
           var price = parseFloat(priceValues[productindex]);
           var quantity = 1 + Math.round(Math.random() * 10);
           row["firstname"] = firstNames[Math.floor(Math.random() * firstNames.length)];
           row["lastname"] = lastNames[Math.floor(Math.random() * lastNames.length)];
           row["productname"] = productNames[productindex];
           row["price"] = price;
           row["quantity"] = quantity;
           row["total"] = price * quantity;
           data[i] = row;
        }
        var source = {
           localdata: data,
           datatype: "array"
        };
        var dataAdapter = new $.jqx.dataAdapter(source, {
            downloadComplete: function (data, status, xhr) { },
            loadComplete: function (data) { },
               loadError: function (xhr, status, error) { }
        });
    
        $("#jqxButton").jqxButton({ width: 100, height: 50,  theme: 'energyblue' });
        $("#mygrid").jqxGrid({ width: 800, height: 450, source: dataAdapter,
               columns: [
                      { text: 'First Name', datafield: 'firstname', width: 100 },
                      { text: 'Last Name', datafield: 'lastname', width: 100 },
                      { text: 'Product', datafield: 'productname', width: 180 },
                      { text: 'Quantity', datafield: 'quantity', width: 80, cellsalign: 'right' },
                      { text: 'Unit Price', datafield: 'price', width: 90, cellsalign: 'right', cellsformat: 'c2' },
                      { text: 'Total', datafield: 'total', width: 100, cellsalign: 'right', cellsformat: 'c2' }
               ], altrows: true, sortable: true, pageable: true, filterable: true,  autoheight: true
        });
    
        $("#jqxButton").jqxButton({ height: 30 });

    arikbd
    Participant

    Sorry I had problem with the images

    after load

    after re-size

    the problem


    arikbd
    Participant

    Hi Dimitar,

    Thanks. I have downloaded new version and I get the same result

    This is after load

    </iframe>” alt=”after load” />

    This after re-size (wider)

    </iframe>” alt=”resize (wider)” />

    Still Ok. Now resize (nerrow)

    </iframe>” alt=”nerrow” />

    The window inside (win1) is not resized

    I’m using the same code as above, I just downloaded version 3.2.2 and jquery version 1.11.1

    Thanks.

    Arikbd.


    arikbd
    Participant

    This is still a problem.
    Anyone know what the problem is?

    10x

    Arikbd

    in reply to: Remote Search problem Remote Search problem #47834

    arikbd
    Participant

    Peter,

    Thanks for your fast replay.
    I understand this is the purpose and it is OK, but what can I do if I delete characters from the search text and now I have no event to reflect that change and refresh the list.
    Is there event that is fired when the search text is changed?

    Thanks,

    Arik

    in reply to: Problem with fusion Charts Problem with fusion Charts #29835

    arikbd
    Participant

    Just an update:

    This is Fusion Charts problem with integration with jQuery 1.10 they should release a fix in the near future.

    Thanks,

    Arik

    in reply to: Problem with fusion Charts Problem with fusion Charts #29793

    arikbd
    Participant

    Peter,

    This is not an integration issue, it is a conflict issue.

    Each of the controls works fine when placed alone on a page, but when I put them both I have a problem, it is probably Fusion Charts problem. I posted the question to check if this is a known problem. I also posted this issue at fusion charts.

    I get TypeError: Cannot call method ‘call’ of undefined when I try to select a row in the grid, but the error is in Fusion Chart JavaScript.

    Thanks,

    Arik

    in reply to: Search in the form Search in the form #29792

    arikbd
    Participant

    Thanks, I missed that 🙂

    Sorry

    Arik

    in reply to: Tree checkboxes not aligned Tree checkboxes not aligned #25865

    arikbd
    Participant

    Hi Dimitar,

    So I cannot create a checkboxes tree from source structure? I need to create the tree structure from UL and LI tags?

    I created the tree from object structure in source attibute.

    Thanks,

    Arik

    in reply to: Tree checkboxes not aligned Tree checkboxes not aligned #25853

    arikbd
    Participant

    This is the code

    <ul class="jqx-tree-dropdown-root" style="width: 217px; min-width: 230px;">
    <li id="home" role="treeitem" class="jqx-tree-item-li" style="margin-left: 16px;">
    <div style="position: absolute; width: 13px; height: 13px; cursor: pointer; margin-top: 4.5px; margin-left: 0px;" tabindex="0" class="chkbox jqx-widget jqx-checkbox" id="jqxWidgetd6c293a4cfce">
    <div class="jqx-checkbox-default jqx-fill-state-normal jqx-rc-all">
    <div style="width: 13px; height: 13px;">
    <span style="width: 13px; height: 13px;"></span>
    </div>
    </div>
    <div style="clear: both;"></div>
    </div>
    <div style="display: inline-block; margin-left: 19px;" class="draggable jqx-rc-all jqx-tree-item jqx-item">Home</div>
    <ul class="jqx-tree-dropdown" style="overflow: hidden; display: none;"></ul>
    </li>
    <li id="root" role="treeitem" class="jqx-tree-item-li jqx-disableselect" style="margin-left: 0px; float: none;">
    <span style="height: 17px; border: none; background-color: transparent; float: left; clear: both; width: 16px; margin-top: 3px;" id="arrowroot" class="jqx-tree-item-arrow-expand"></span>
    <div style="position: absolute; width: 13px; height: 13px; cursor: pointer; margin-top: 4.5px; margin-left: 16px;" tabindex="0" class="chkbox jqx-widget jqx-checkbox" id="jqxWidget4e6769d7a958">
    <div class="jqx-checkbox-default jqx-fill-state-normal jqx-rc-all">
    <div style="width: 13px; height: 13px;">
    <span style="width: 13px; height: 13px;"></span>
    </div>
    </div>
    <div style="clear: both;"></div>
    </div>
    <div style="display: inline-block; margin-left: 19px;" class="draggable jqx-rc-all jqx-tree-item jqx-item">node</div>
    <ul class="jqx-tree-dropdown" style="overflow: hidden;">
    <li id="3" role="treeitem" class="jqx-tree-item-li" style="margin-left: 16px;">
    <div style="position: absolute; width: 13px; height: 13px; cursor: pointer; margin-top: 4.5px; margin-left: 0px; opacity: 1;" tabindex="0" class="chkbox jqx-widget jqx-checkbox" id="jqxWidgete87ade8a3121">
    <div class="jqx-checkbox-default jqx-fill-state-normal jqx-rc-all">
    <div style="width: 13px; height: 13px;">
    <span style="width: 13px; height: 13px;"></span>
    </div>
    </div>
    <div style="clear: both;"></div>
    </div>
    <div style="display: inline-block; margin-left: 19px;" class="draggable jqx-rc-all jqx-tree-item jqx-item"> (10.0.0.51)</div>
    </li>
    <li id="2" role="treeitem" class="jqx-tree-item-li" style="margin-left: 16px;">
    <div style="position: absolute; width: 13px; height: 13px; cursor: pointer; margin-top: -3.5px; margin-left: 0px; opacity: 1;" tabindex="0" class="chkbox jqx-widget jqx-checkbox" id="jqxWidget977d22266f1d">
    <div class="jqx-checkbox-default jqx-fill-state-normal jqx-rc-all">
    <div style="width: 13px; height: 13px;">
    <span style="width: 13px; height: 13px;"></span>
    </div>
    </div>
    <div style="clear: both;"></div>
    </div>
    <div style="display: inline-block; margin-left: 19px;" class="draggable jqx-rc-all jqx-tree-item jqx-item">develop3 (10.0.0.34)</div>
    </li>
    <li id="1" role="treeitem" class="jqx-tree-item-li" style="margin-left: 16px;">
    <div style="position: absolute; width: 13px; height: 13px; cursor: pointer; margin-top: -3.5px; margin-left: 0px; opacity: 1;" tabindex="0" class="chkbox jqx-widget jqx-checkbox" id="jqxWidget0688f74a337d">
    <div class="jqx-checkbox-default jqx-fill-state-normal jqx-rc-all">
    <div style="width: 13px; height: 13px;">
    <span style="width: 13px; height: 13px;"></span>
    </div>
    </div>
    <div style="clear: both;"></div>
    </div>
    <div style="display: inline-block; margin-left: 19px;" class="draggable jqx-rc-all jqx-tree-item jqx-item">mailsrv (10.0.0.3)</div>
    </li>
    <li id="5" role="treeitem" class="jqx-tree-item-li" style="margin-left: 16px;">
    :
    :
    </li>
    </ul>
    </li>
    </ul>
    in reply to: Tree sizing Tree sizing #23351

    arikbd
    Participant

    Peter,

    can I use something like 50%-75px for the height?

    Arik

    in reply to: Tree sizing Tree sizing #23348

    arikbd
    Participant

    Peter,

    Thanks but I do not understand how to do it.

    If I remove the height attribute from the jqxTree method I still get the same problem, it seems that the size of the tree control is the size of the entire frame, if I remove the height attribute then the tree does not re-size when I re-size the window.

    I want the control to re-size to the full height left in the frame.

    B.T.W I tried it on both Chrome and IE 10
    Thanks,

    Arik

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