jQuery UI Widgets Forums Grid Stuck after adding one value

This topic contains 3 replies, has 2 voices, and was last updated by  Dimitar 8 years, 4 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • Stuck after adding one value #78887

    vicky
    Participant

    Hello,

    After adding values to row not able to add values again and got stuck there. Problem may be with “$(‘#jqxgrid’).jqxGrid(‘updatebounddata’);” if i use updatebounddata to refresh grid then it stuck there, if i use ” refreshfilterrow ” function it shows error for process not completed.

    Here is my code Thanks in advance.

    <script type=”text/javascript”>
    $(document).ready(function ()
    {
    // inizializzo lo splitter
    // $(“#vSplitter”).jqxSplitter({ width: ‘100%’, height: ‘100%’, showSplitBar: true, resizable: true, orientation: ‘vertical’, theme: ‘bootstrap’, panels: [{ size: 200, collapsible: true }] });

    // prepare the data
    var theme = ‘bootstrap’;

    // prepare the data
    var data = {};
    var theme = ‘classic’;
    var name = [“Nancy”, “Andrew”, “Janet”, “Margaret”, “Steven”, “Michael”, “Robert”, “Laura”, “Anne”];
    var provvigione = [“Davolio”, “Fuller”, “Leverling”, “Peacock”, “Buchanan”, “Suyama”, “King”, “Callahan”, “Dodsworth”];
    var generaterow = function(id)
    {
    var row = {};
    var k = Math.floor(Math.random() * name.length);
    //var surname = Math.floor(Math.random() * surname.length);
    //var username = Math.floor(Math.random() * username.length);
    //var password = Math.floor(Math.random() * password.length);
    //var email = Math.floor(Math.random() * email.length);

    row[“codice”] = id;
    row[“nome”] = name[k];
    row[“provvigione”] = provvigione[k];
    return row;
    }

    var source =
    {
    datatype: “json”,
    datafields: [
    { name: ‘codice’},
    { name: ‘nome’},
    { name: ‘provvigione’}
    ],
    id: ‘codice’,
    url: ‘<?php echo site_url(“/Dashboard/agentSData”) ?>’,
    //—-ADD ROW——-
    addrow: function (rowid, rowdata, position, commit)
    {
    var numbersString = $.param(rowdata);
    var aa = numbersString.replace(/nome=|provvigione=/g,”);
    var numbersArray = aa.split(‘&’);

    var nome = numbersArray[0];
    var provvigione = numbersArray[1];

    if(nome == ” || provvigione ==”)
    {
    $(“#all_require”).jqxNotification({
    width: 850, position: “top-right”, opacity: 0.9,
    autoOpen: false, animationOpenDelay: 800, autoClose: true, autoCloseDelay: 3000, blink: false, template: “warning”
    });
    $(“#all_require”).jqxNotification(“open”);
    return false;
    }
    else
    {
    //alert(‘1’);
    var data = “insert=true&” + $.param(rowdata);
    $.ajax({
    dataType: ‘json’,
    url: ‘<?php echo site_url(“/Dashboard/agentsAddData/”);?>’,
    data: data,
    cache: false,
    success: function (data, status, xhr)
    {
    //alert(‘2’);
    commit(true);
    $(“#row_add”).jqxNotification({
    width: 850, position: “top-right”, opacity: 0.9,
    autoOpen: false, animationOpenDelay: 800, autoClose: true, autoCloseDelay: 3000, blink: false, template: “success”
    });
    $(“#row_add”).jqxNotification(“open”);
    $(“#jqxgrid”).jqxGrid(‘clearfilters’);
    $(‘#jqxgrid’).jqxGrid(‘updatebounddata’);
    //$(‘#jqxgrid’).jqxGrid(‘clearfilters’);
    //$(“#jqxgrid”).jqxGrid(‘clearfilters’);
    //$(“#jqxgrid”).jqxGrid({ source: dataAdapter });
    //$(“#jqxgrid”).jqxGrid(‘refreshdata’);
    //$(“#jqxgrid”).jqxGrid(‘refresh’);
    //var dataAdapter = new $.jqx.dataAdapter(source);
    //$(“#jqxgrid”).jqxGrid({ source: dataAdapter });

    },
    //–UPDATE ROW——————

    error: function(jqXHR, textStatus, errorThrown)
    {
    commit(false);
    }
    });
    }
    },
    //—DELETE ROW——————
    deleterow: function (rowid, commit)
    {
    var data = “delete=true&” + $.param({agentid: rowid});
    $.ajax({
    dataType: ‘json’,
    url: ‘<?php echo site_url(“/Dashboard/agentsDelete”) ?>’,
    cache: false,
    data: data,
    success: function(data, status, xhr)
    {

    $(“#row_delete”).jqxNotification({
    width: 850, position: “top-right”, opacity: 0.9,
    autoOpen: false, animationOpenDelay: 800, autoClose: true, autoCloseDelay: 3000, blink: false, template: “success”
    });
    $(“#row_delete”).jqxNotification(“open”);

    commit(true);
    $(“#jqxgrid”).jqxGrid(‘clearfilters’);
    //$(“#jqxgrid”).jqxGrid(‘updatebounddata’);
    //$(‘#jqxgrid’).jqxGrid(‘refreshfilterrow’);
    //$(“#jqxgrid”).jqxGrid(‘refreshdata’);
    },
    error: function(jqXHR, textStatus, errorThrown)
    {
    commit(false);
    }
    });
    },
    root: ‘Rows’,
    beforeprocessing: function (data) {
    source.totalrecords = data[0].TotalRows;
    },
    sort: function () {
    // update the grid and send a request to the server.
    $(“#jqxgrid”).jqxGrid(‘updatebounddata’);
    }
    };
    var dataAdapter = new $.jqx.dataAdapter(source);
    // initialize jqxGrid
    $(“#jqxgrid”).jqxGrid(
    {
    width: ‘57.5%’,
    filterable: true,
    source: dataAdapter,
    theme: theme,
    autoheight: true,
    pageable: true,
    virtualmode: true,
    showeverpresentrow: true,
    everpresentrowposition: “top”,
    everpresentrowactions: “add reset”,
    everpresentrowactionsmode: “columns”,
    editable: true,
    editmode: ‘dblclick’,
    selectionmode: ‘checkbox’,
    altrows: true,
    sortable: true,
    rendergridrows: function () {
    return dataAdapter.records;
    },
    columns: [
    //{ text: ‘User ID’, editable: false, datafield: ‘EmployeeID’, width: 100 },
    { text: ‘CODAGE’, editable: false, datafield: ‘codice’, width: 200, cellsalign: ‘center’,
    initEverPresentRowWidget: function (datafield, htmlElement)
    {
    var input = htmlElement.find(‘input’);
    input.attr(‘readonly’, true);
    input.attr(‘disabled’, true);
    htmlElement.addClass(‘jqx-fill-state-disabled’);
    }
    },
    { text: ‘DESCAGE’, datafield: ‘nome’, width: 200, cellsalign: ‘left’},
    { text: ‘PROVVAGE’, datafield: ‘provvigione’, width: 200, cellsalign: ‘right’} ,
    { text: ”, datafield: ‘addButtonColumn’, width: 111},
    { text: ”, datafield: ‘resetButtonColumn’, width: 112}
    ]
    });
    $(“#deleterowbutton”).jqxButton({ theme: theme });
    $(“#deleterowbutton”).bind(‘click’, function ()
    {
    var rowIndexes = $(‘#jqxgrid’).jqxGrid(‘getselectedrowindexes’);
    var rowIds = new Array();
    for (var i = 0; i < rowIndexes.length; i++) {
    var currentId = $(‘#jqxgrid’).jqxGrid(‘getrowid’, rowIndexes[i]);
    rowIds.push(currentId);
    };
    $(‘#jqxgrid’).jqxGrid(‘deleterow’, rowIds);
    $(‘#jqxgrid’).jqxGrid(‘clearselection’);
    });

    $(‘#textboxeditorjqxgridpassword’).css(‘background’,’red’);

    });
    </script>

    Stuck after adding one value #78898

    Dimitar
    Participant

    Hello vicky,

    In the addrow callback function, commit(true); updates the client-side grid. That is why you do not need to call updatebounddata. Please take a look at our help topic Build CRUD Web App with jqxGrid using PHP and MySQL, which showcases a correct implementation including the addrow callback.

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

    Stuck after adding one value #78956

    vicky
    Participant

    Hello Dimitar,

    If i remove updatebounddata it’s not updating rowid and started showing from 1,2,3. Response from database is coming as expected but when appends data then it changes id to 0,1,2 etc.

    Regards,
    Vikash THakur

    Stuck after adding one value #79001

    Dimitar
    Participant

    Hi Vikash THakur,

    In addrow, the commit callback has a second parameter you can set to synchronise the grid row ids with the ids of database records. For more information, please take a look at this forum post: http://www.jqwidgets.com/community/topic/getting-the-database-generated-id-when-adding-row/#post-52646.

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

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

You must be logged in to reply to this topic.