Solved

NetAdvantage Infragistics, UltraWebGrid adding/deleting rows using client side javascript

Posted on 2007-11-19
6
20,611 Views
Last Modified: 2013-11-15
How can I Add/ Delete rows using client side javascript. I want to add unique values while adding rows.  Is there anyway that I can enforce some validation before adding new row. Any help will be appreciated.
0
Comment
Question by:anwar ul haque
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
6 Comments
 
LVL 6

Expert Comment

by:thuannguy
ID: 20313809
Given that the gn variable holds the client name of your grid (you can get it in some CLIENTSIDE event, e.g. the InitializeLayout event).
      // get the reference to the Grid object
      var grid = igtbl_getGridById(gn);
      *Get all the rows of the grid: grid.Rows
      *Get the number of rows: grid.Rows.length
      *Example: delete the second row of the grid:
            var row = grid.Rows.getRow( 1 );
            row.deleteRow();

      *Example: Add a new row to the index position and then insert values in the values array to the row:
      var row = igtbl_addNew(grid.Id, 0);
     
         if(grid.Rows.length-1 >= index)
         {
            grid.Rows.remove(grid.Rows.length-1);
            grid.Rows.insert(row, index);
         }
   
        for(var id = 0; id < values.length; id++)
            row.getCell(id).setValue(values[id], true);

Please note that the second parameter of the setValue function is true will fire the updatecellchange event and also trigger any validator which is set to any column. What you need to do is set that validator to the column you want to validate.

I can only give you some information about the UltraWebGrid. Hope this will help :)
0
 
LVL 2

Author Comment

by:anwar ul haque
ID: 20318898
Thanks for your help. Actually I didnt want to add new row if the values are same. But unfortunately problem I could't find anyway to do this.I'm going to post my add/remove code and I will try to explaing where problem is.
code for adding new row is:
function add(){
 count = grid.Rows.length;
 while(count >=0 )
                      {
                       row=igtbl_getRowById("UltraWebGrid1_r_" + count);
///problem is here
//Actually when I add some values after deleting all previous
// rows from grid. new values are created with different row id. lik" UltraWebGrid1_r_4" . This row id is actually incremented value and it clearly shows that no row was deleted. but  "grid.Rows.length" is showing very updated value..
                        if (row != null)
                           {
                           
                                     if (myNewID.value.trim() == row.getCell(0).getValue().trim())
                                   {
                                                       return;
                                   }
                                 
                           }
                            count -=1;
                       }

var index1;
                 if (grid.Rows.length <= 0)
                     {
                      index = 0;
                     } else
                     {
                      index = (grid.Rows.length);
                     }
                   
                     var row=igtbl_getActiveRow("UltraWebGrid1");
                     if (row ==null)
                     {
                     igtbl_setActiveRow("UltraWebGrid1",igtbl_getElementById("UltraWebGrid1r_0"));
                     }
                     var row = igtbl_addNew("UltraWebGrid1",0);
                         grid.Rows.remove(index);
                         grid.Rows.insert(row, index);
                         row.getCell(0).setValue(myNewID.value.trim() ,true);
                         row.getCell(1).setValue(myNewName.value.trim() ,true);
                      /////////////
}
Code for row deletion is given below:
function delRow()
{
var grid = igtbl_getGridById("UltraWebGrid1");
      //make sure that deletes are allowed
    igtbl_getGridById("UltraWebGrid1").AllowDelete=1;
    //get the active row in the grid
     var row=igtbl_getActiveRow("UltraWebGrid1");
     if (row ==null)
        {
          return;
        }  
        var row1 = igtbl_getRowById(row.Id);
row.deleteRow();
 
}
Hope you will better understand the problem. Secondly I could not find any updatecellchange event. I'm using NetAdvantage_20073_CLR2x_ASPNET_trial version.
0
 
LVL 2

Author Comment

by:anwar ul haque
ID: 20318908
Code is given below.
function add(){
 count = grid.Rows.length;
 while(count >=0 )
                      {
                       row=igtbl_getRowById("UltraWebGrid1_r_" + count);
///problem is here 
//Actually when I add some values after deleting all previous
// rows from grid. new values are created with different row id. lik" UltraWebGrid1_r_4" . This row id is actually incremented value and it clearly shows that no row was deleted. but  "grid.Rows.length" is showing very updated value..
                        if (row != null) 
                           {
                           
                                     if (myNewID.value.trim() == row.getCell(0).getValue().trim())
                                   {
                                                       return;
                                   }
                                  
                           }
                            count -=1;
                       }
 
var index1;
                 if (grid.Rows.length <= 0)
                     {
                      index = 0;
                     } else 
                     {
                      index = (grid.Rows.length);
                     }
                    
                     var row=igtbl_getActiveRow("UltraWebGrid1");
                     if (row ==null)
                     {
                     igtbl_setActiveRow("UltraWebGrid1",igtbl_getElementById("UltraWebGrid1r_0"));
                     }
                     var row = igtbl_addNew("UltraWebGrid1",0);
                         grid.Rows.remove(index);
                         grid.Rows.insert(row, index);
                         row.getCell(0).setValue(myNewID.value.trim() ,true);
                         row.getCell(1).setValue(myNewName.value.trim() ,true);
                      /////////////
}
Code for row deletion is given below:
function delRow()
{
var grid = igtbl_getGridById("UltraWebGrid1");
      //make sure that deletes are allowed
    igtbl_getGridById("UltraWebGrid1").AllowDelete=1;
    //get the active row in the grid
     var row=igtbl_getActiveRow("UltraWebGrid1");
     if (row ==null)
        {
          return;
        }  
        var row1 = igtbl_getRowById(row.Id);
row.deleteRow();
  
}

Open in new window

0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 6

Accepted Solution

by:
thuannguy earned 500 total points
ID: 20327445
It is obvious that the id of the row is generated by the grid internally. We can guess the rule (like you did), but we can't control it. So it is not a good idea to get a row by a "guessed" id.  We should get it by its index instead.

var grid = igtbl_getGridById("UltraWebGrid1");
count = grid.Rows.length - 1;
while(count >=0 )
{
         var row = grid.Rows.getRow(count); <== here
....

And:
if (row ==null)
     {
           igtbl_setActiveRow("UltraWebGrid1", grid.Rows.getRow(0));
OR
          grid.setActiveRow(grid.Rows.getRow(0));
     }

About the updatecellchange, this is my false. You can investigate events like BeforeCellChange, BeforeCellChange... instead
0
 
LVL 2

Author Comment

by:anwar ul haque
ID: 20364109
Yes it worked finally thanks for your suggestions and time. I had used following code
var count; 
var strID;
strID = "NewID";
count = grid.Rows.length;
    for(i=0; i<count; i++){
        if( grid.Rows.rows[i].getCell(0).Value.trim() == strID){
            return;
        }
    }

Open in new window

0
 

Expert Comment

by:BhaveshKotwani
ID: 23843820
Hi anwar

Can you please post your javascript function, i am working on similar script and having some issues. Will really appreciate if you can post the entire script.

I will really appreciate if you can comment on this. I am able to add a empty to the WebGrid. But now i am not able to insert the values into the inserted row. I need to read these values from 2 text boxes (created on fly) and a drop down list. The text boxes can only take numerical values. All this should happen on a  button click.

Thank You

Regards

Bhavesh Kotwani
0

Featured Post

Enroll in June's Course of the Month

June's Course of the Month is now available! Every 10 seconds, a consumer gets hit with ransomware. Refresh your knowledge of ransomware best practices by enrolling in this month's complimentary course for Premium Members, Team Accounts, and Qualified Experts.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

The task A number given should be formatted for easy reading by separating digits into triads. Format must be made inline via JavaScript, i.e., frameworks / functions are not welcome. So let’s take a number like this “12345678.91¿ and format i…
Jaspersoft Studio is a plugin for Eclipse that lets you create reports from a datasource.  In this article, we'll go over creating a report from a default template and setting up a datasource that connects to your database.
The viewer will learn how to use NetBeans IDE 8.0 for Windows to connect to a MySQL database. Open Services Panel: Create a new connection using New Connection Wizard: Create a test database called eetutorial: Create a new test tabel called ee…
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

728 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question