Solved

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

Posted on 2007-11-19
6
20,497 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
  • 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
How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

 
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

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

This article will give core knowledge of JavaScript and will head in to your first JavaScript program. I am Durvesh Naik and I am here to deal with this series of JavaScript. I will teach you JavaScript in part wise , as its quite boring to read big…
This article discusses how to create an extensible mechanism for linked drop downs.
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 how to use and create new code templates in NetBeans IDE 8.0 for Windows.

759 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

Need Help in Real-Time?

Connect with top rated Experts

16 Experts available now in Live!

Get 1:1 Help Now