EasyUI Forum
June 16, 2024, 12:40:20 PM *
Welcome, Guest. Please login or register.

Login with username, password and session length
   Home   Help Search Login Register  
Pages: [1]
Author Topic: Editable datagrid with scrollview - first 10 rows vanishing during editing  (Read 1548 times)
Full Member
Posts: 176

View Profile Email
« on: November 24, 2022, 12:34:57 AM »

I have used a editable datagrid with scrollview as the data contains more than 5000 rows. No whenever I am trying to edit a cell in the datagrid, just after typing first character - top 10 rows got vanished. I have changed the view from scrollview to normal, it is working fine. But whenever I am changing the view as scrollview the same thing happens. Anybody please help me, I cann't understand why this is happening.
Hero Member
Posts: 2265

View Profile Email
« Reply #1 on: November 26, 2022, 06:18:56 PM »

Please look at this example. It works fine.
<!DOCTYPE html>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>jQuery EasyUI</title>
    <link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/themes/default/easyui.css">
    <script type="text/javascript" src="https://www.jeasyui.com/easyui/jquery.min.js"></script>
    <script type="text/javascript" src="https://www.jeasyui.com/easyui/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="https://www.jeasyui.com/easyui/datagrid-scrollview.js"></script>
    <script type="text/javascript" src="https://www.jeasyui.com/easyui/jquery.edatagrid.js"></script>
            var rows = [];
            for(var i=1; i<=8000; i++){
                var amount = Math.floor(Math.random()*1000);
                var price = Math.floor(Math.random()*1000);
                    inv: 'Inv No '+i,
                    date: $.fn.datebox.defaults.formatter(new Date()),
                    name: 'Name '+i,
                    amount: amount,
                    price: price,
                    cost: amount*price,
                    note: 'Note '+i
                data: rows
    <h1>DataGrid - VirtualScrollView</h1>
    <table id="dg" style="width:700px;height:250px"
            title="DataGrid - VirtualScrollView"
                <th field="inv" width="80">Inv No</th>
                <th field="date" width="100">Date</th>
                <th field="name" width="80" editor="textbox">Name</th>
                <th field="amount" width="80" align="right" editor="numberbox">Amount</th>
                <th field="price" width="80" align="right">Price</th>
                <th field="cost" width="100" align="right">Cost</th>
                <th field="note" width="110">Note</th>

Full Member
Posts: 176

View Profile Email
« Reply #2 on: December 02, 2022, 07:24:23 AM »

Thanks Jarry, it works. But insted of edatagrid if I use datagrid with row editing then the first page (number of rows defined for a page) vanishes just after the pressing any key in any column editor box.
Pages: [1]
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!