Ad:

JavaScript / DHTML / AJAX Discussion Thread
Unsolved
Views: 2229

Page 1
2
3
Next

You are currently viewing page 1 of this multi-page discussion thread

Aug 10th, 2009

how to change id by adding new row..

Expand Post »

i am making a table with dynamic increament of rows on click of button..!!

i have used an autocomplete textbox in a row...!!! which is based on textbox id..!!
.
.
as i know that id should be unique.. so how can i change ID then..?

javascript Syntax (Toggle Plain Text)
function add(oRow) 
{ 
   var selObj = oRow.getElementsByTagName('select')[0];                
    if(selObj[0].selected){ // Check for empty ledger entry
        alert("Please select ledger");
        return false;
    }          
  oRow.parentNode.replaceChild(oRow.cloneNode(true),oRow.parentNode.insertRow(oRow.rowIndex+1));
 // alert(oRow.rowIndex+1);
  var inpR = oRow.getElementsByTagName('input');
  var inpN = oRow.nextSibling.getElementsByTagName('input');
  var selR = oRow.getElementsByTagName('select')[0];
  //alert(selR);
      selR.disabled=true;
  var selN = oRow.nextSibling.getElementsByTagName('select')[0];
      selN.selectedIndex=0; 
  for(i=0;i<inpR.length;i++)
  { 
    if(inpR[i].disabled){inpR[i].disabled=false;/**/};                      
    if(inpR[i].type=='text'){inpR[i].disabled=true;inpN[i].value='';inpN[i].disabled=false};
    if(inpR[i].value=='Add'){inpR[i].value='Edit';inpN[i].disabled=true};
  } sumus();knockOut(selN);
}
function add(oRow) 
{ 
   var selObj = oRow.getElementsByTagName('select')[0];                
    if(selObj[0].selected){ // Check for empty ledger entry
        alert("Please select ledger");
        return false;
    }          
  oRow.parentNode.replaceChild(oRow.cloneNode(true),oRow.parentNode.insertRow(oRow.rowIndex+1));
 // alert(oRow.rowIndex+1);
  var inpR = oRow.getElementsByTagName('input');
  var inpN = oRow.nextSibling.getElementsByTagName('input');
  var selR = oRow.getElementsByTagName('select')[0];
  //alert(selR);
      selR.disabled=true;
  var selN = oRow.nextSibling.getElementsByTagName('select')[0];
      selN.selectedIndex=0; 
  for(i=0;i<inpR.length;i++)
  { 
    if(inpR[i].disabled){inpR[i].disabled=false;/**/};                      
    if(inpR[i].type=='text'){inpR[i].disabled=true;inpN[i].value='';inpN[i].disabled=false};
    if(inpR[i].value=='Add'){inpR[i].value='Edit';inpN[i].disabled=true};
  } sumus();knockOut(selN);
}

Last edited by sam023; Aug 10th, 2009 at 4:02 am.

Similar Threads

Trouble adding new row to DataTable (C#) in C#
Adding a new row in a Datagrid ??????????? in C#
How to change color of a row in Java
Adding new row in DataGrid in C#
Having problems with adding a row to a DataSet in VB.NET

sam023

Reputation Points: 11

Solved Threads: 6

Junior Poster

Offline

164 posts
since Jun 2009

Permalink

Aug 10th, 2009

Re: how to change id by adding new row..

i hope people understood here what exactly i want to say..!! :O

sam023

Reputation Points: 11

Solved Threads: 6

Junior Poster

Offline

164 posts
since Jun 2009

Permalink

Aug 10th, 2009

Re: how to change id by adding new row..

Sam,

If you never use document.getElementById on an element (or otherwise need to read its id) then it doesn't need one.

However, if an elememt does need an id, then as you say, it should be unique. One way to ensure uniqueness in a cloned element is to add a suffix, '_n' (where n is an integer). To ensure that "n" is unique, maintain an invisible counter in each of your table rows and increment it each time the row is duplicated.

Before duplicating the row:

javascript Syntax (Toggle Plain Text)
var n = oRow.getAttribute('counter');
n = (n===null) ? 0 : n+1;
oRow.setAttribute('counter', n);
var n = oRow.getAttribute('counter');
n = (n===null) ? 0 : n+1;
oRow.setAttribute('counter', n);

Now clone the row, then:

javascript Syntax (Toggle Plain Text)
var suffix = '_' + n;
newRow.setAttribute('counter', 0);//Set to 0 in case the cloned row is itelf later cloned.
var suffix = '_' + n;
newRow.setAttribute('counter', 0);//Set to 0 in case the cloned row is itelf later cloned.

Now append suffix to all elements in the new row that need it.

New ids will be unique provided that each original id:

is unique
is not of a value that could possibly occur due to the renumbering of another.

Airshow

Sponsor

Reputation Points: 318

Solved Threads: 358

WiFi Lounge Lizard

Offline

2,526 posts
since Apr 2009

Permalink

Aug 11th, 2009

Re: how to change id by adding new row..

can you tell where should i make changes in my code..?

nish123

Reputation Points: 10

Solved Threads: 0

Junior Poster in Training

Offline

83 posts
since Apr 2009

Permalink

Aug 11th, 2009

Re: how to change id by adding new row..

actually i dont want to use ID...!! major reason is that i m also using a delete button which will delete the row..!!
.
.
this mean that again there can be same Id which will create problem..!!

nish123

Reputation Points: 10

Solved Threads: 0

Junior Poster in Training

Offline

83 posts
since Apr 2009

Permalink

Aug 11th, 2009

Re: how to change id by adding new row..

javascript Syntax (Toggle Plain Text)
function add(oRow) 
{ 
   var selObj = oRow.getElementsByTagName('select')[0];                
    if(selObj[0].selected){ // Check for empty ledger entry
        alert("Please select ledger");
        return false;
    }          
oRow.parentNode.replaceChild(oRow.cloneNode(true),oRow
.parentNode.insertRow(oRow.rowIndex+1));
  var inpR = oRow.getElementsByTagName('input');
  var inpN = oRow.nextSibling.getElementsByTagName('input');
  var selR = oRow.getElementsByTagName('select')[0];
  //alert(selR);
      selR.disabled=true;
  var selN = oRow.nextSibling.getElementsByTagName('select')[0];
      selN.selectedIndex=0; 
  for(i=0;i<inpR.length;i++)
  { 
    if(inpR[i].disabled){inpR[i].disabled=false;/**/};                      
    if(inpR[i].type=='text'){inpR[i].disabled=true;inpN[i].value='';inpN[i].disabled=false};
    if(inpR[i].value=='Add'){inpR[i].value='Edit';inpN[i].disabled=true}; 
  } sumus();knockOut(selN);
}
function add(oRow) 
{ 
   var selObj = oRow.getElementsByTagName('select')[0];                
    if(selObj[0].selected){ // Check for empty ledger entry
        alert("Please select ledger");
        return false;
    }          
oRow.parentNode.replaceChild(oRow.cloneNode(true),oRow
.parentNode.insertRow(oRow.rowIndex+1));
  var inpR = oRow.getElementsByTagName('input');
  var inpN = oRow.nextSibling.getElementsByTagName('input');
  var selR = oRow.getElementsByTagName('select')[0];
  //alert(selR);
      selR.disabled=true;
  var selN = oRow.nextSibling.getElementsByTagName('select')[0];
      selN.selectedIndex=0; 
  for(i=0;i<inpR.length;i++)
  { 
    if(inpR[i].disabled){inpR[i].disabled=false;/**/};                      
    if(inpR[i].type=='text'){inpR[i].disabled=true;inpN[i].value='';inpN[i].disabled=false};
    if(inpR[i].value=='Add'){inpR[i].value='Edit';inpN[i].disabled=true}; 
  } sumus();knockOut(selN);
}

i have a code for autocomplete in one of the textbox in a row.. but for that i need ID..!!

but because of clone i m unable to enter different id..!! where should i maker change in my javascript..!!

Last edited by nish123; Aug 11th, 2009 at 6:54 am.

nish123

Reputation Points: 10

Solved Threads: 0

Junior Poster in Training

Offline

83 posts
since Apr 2009

Permalink

Aug 11th, 2009

Re: how to change id by adding new row..

I don"t think change ID is a good Idea because in a future you may use they "id" in another cases

polo_coins

Reputation Points: 8

Solved Threads: 0

Junior Poster in Training

Offline

63 posts
since Oct 2008

Permalink

Aug 11th, 2009

Re: how to change id by adding new row..

Click to Expand / Collapse Quote originally posted by nish123 ...

can you tell where should i make changes in my code..?

Intriguing I'm sure but this is Sam023's topic.

Airshow

Airshow

Sponsor

Reputation Points: 318

Solved Threads: 358

WiFi Lounge Lizard

Offline

2,526 posts
since Apr 2009

Permalink

Aug 11th, 2009

Re: how to change id by adding new row..

Click to Expand / Collapse Quote originally posted by Airshow ...

Intriguing I'm sure but this is Sam023's topic.

Airshow

Yes it is my topic but i can see that nish123 facing the same problem..!! and he also using same code as i do..!!!

so kindly help me out..!! where should i make changes..? in the code to create different id...!!

sam023

Reputation Points: 11

Solved Threads: 6

Junior Poster

Offline

164 posts
since Jun 2009

Permalink

Aug 11th, 2009

Re: how to change id by adding new row..

Click to Expand / Collapse Quote originally posted by polo_coins ...

I don"t think change ID is a good Idea because in a future you may use they "id" in another cases

well i have no other option except changing ID..!!

as my auto complete function is based on id and ID must be unique..!!
.
.
as the user append the row... the clonenode function create exactly the same row as above including ID..!!! and that thing will create problem...!!!
.
.
can anyone suggest an auto complete function where ID is not required..?

sam023

Reputation Points: 11

Solved Threads: 6

Junior Poster

Offline

164 posts
since Jun 2009

Page 1
2
3
Next

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.

Previous Thread in JavaScript / DHTML / AJAX Forum Timeline: Associative Array in Javascript

Next Thread in JavaScript / DHTML / AJAX Forum Timeline: I want put a clock on my page

DaniWeb Message

Cancel Changes

User Name
Password