Solved

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

Posted on 2007-11-19
6
20,578 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
Online Training Solution

Drastically shorten your training time with WalkMe's advanced online training solution that Guides your trainees to action. Forget about retraining and skyrocket knowledge retention rates.

 
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

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
Error running webpage local computer 7 27
Rotate images for Web Page 11 28
Put javascript to get dropdown value 3 22
AngularJS: ng-repeat 25 28
Problem Hi all,    While many today have fast Internet connection, there are many still who do not, or are connecting through devices with a slower connect, so light web pages and fast load times are still popular.    If your ASP.NET page …
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
The viewer will learn how to use and create keystrokes in Netbeans IDE 8.0 for Windows.
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…

730 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