Dynamically adding a new line to a table or listview?

  • (2 Pages)
  • +
  • 1
  • 2

15 Replies - 9089 Views - Last Post: 28 July 2011 - 07:22 AM Rate Topic: -----

#1 KCross  Icon User is offline

  • D.I.C Head

Reputation: 1
  • View blog
  • Posts: 51
  • Joined: 03-March 10

Dynamically adding a new line to a table or listview?

Posted 22 June 2011 - 01:17 PM

Good evening.

I've been banging my head against a wall for 2 days on this - what I assumed would be simple - bit of code.

All I'm trying to do is create a button that adds a new row to a table. Essentially:

<asp:table runat="server" id="table1"><asp:tablerow><asp:tablecell /><asp:tablecell /><asp:tablecell><asp:button runat="server" id="btnAddRow" onclick="btnAddRow_Click"></asp:tablerow>
</asp:table>


I'm really not sure what the btnAddRow_Click event should look like. I've tried to do this with Javascript (of which I do not know any at all, I just tried using some code I found online here:

http://viralpatel.ne...javascript.html

But it choked on it. Presumably because I'm trying to create this within an asp.net web form using a master page. I tried putting the code in the PreRender event, but it just wouldn't work.

The SR dev at my work told me I should be using a ListView - so that's the approach I'm taking now... But all the books & online help I can find with a ListView control requires data binding (of which I do not need, or want), and I can't figure out how to manually add elements to the ListView using ListView.InsertItem...

Getting very frustrated, and I KNOW I'm making dumb mistakes & poor programming choices here. But I'm self taught and have very little understanding of these functions. You'd think 4 programming books would help. But it seems they don't.

Is This A Good Question/Topic? 0
  • +

Replies To: Dynamically adding a new line to a table or listview?

#2 Nakor  Icon User is offline

  • Professional Lurker
  • member icon

Reputation: 441
  • View blog
  • Posts: 1,488
  • Joined: 28-April 09

Re: Dynamically adding a new line to a table or listview?

Posted 22 June 2011 - 03:40 PM

Are you displaying any data and if so where is it coming from if you're not databinding to anything? Also, what is supposed to be in the new row you're trying to add? Is it going to contain new data from somewhere or is it supposed to allow the user to input data or is it just supposed to be some blank row for some reason?

Also, can you provide the code for the ListView you're using now?
Was This Post Helpful? 0
  • +
  • -

#3 KCross  Icon User is offline

  • D.I.C Head

Reputation: 1
  • View blog
  • Posts: 51
  • Joined: 03-March 10

Re: Dynamically adding a new line to a table or listview?

Posted 24 June 2011 - 10:51 AM

I will be adding a new row that will contain 4 columns. Those columns will contain:
Dropdown list (static items) | textbox (for user data input) | Dropdown list (static items) | Dropdown list (static items).

I will take the values selected (or entered) by the user and shove those into a SQL database.

I can provide the code, but I've barely begun work on the ListView - since I couldn't figure out how to populate the columns without databinding.
Was This Post Helpful? 0
  • +
  • -

#4 SurfingShark  Icon User is offline

  • D.I.C Head

Reputation: 38
  • View blog
  • Posts: 188
  • Joined: 18-April 11

Re: Dynamically adding a new line to a table or listview?

Posted 24 June 2011 - 07:51 PM

Please see the below link on how to add rows to a table server control.

http://msdn.microsof...y/7bewx260.aspx
Was This Post Helpful? 0
  • +
  • -

#5 KCross  Icon User is offline

  • D.I.C Head

Reputation: 1
  • View blog
  • Posts: 51
  • Joined: 03-March 10

Re: Dynamically adding a new line to a table or listview?

Posted 27 June 2011 - 01:22 PM

This is getting there!

Here is the code I'm using:

protected void btnAddHD_Click(object sender, EventArgs e)
        {
            TableRow tRow = new TableRow();
            tblHD.Rows.Add(tRow);
            TableCell tCell = new TableCell();
            tCell.Text = "Test Add";
            tRow.Cells.Add(tCell);
        }


Now, when I click the button, that row & cell gets added properly. But clicking on it more than once does not continue to add additional rows. I kind of understand why. This new row isn't truly added to the form, so when I click the button, the form that gets posted back contains only the original table, and the event to add the additional row. It does not contain the row that was added by the event.

So... I think I understand WHY it doesn't work how I want it to. But I don't know how to work around this. How do I make the program "see" the dynamically added rows so I can keep adding rows to that table?
Was This Post Helpful? 0
  • +
  • -

#6 Moogoo  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 10
  • View blog
  • Posts: 80
  • Joined: 06-January 10

Re: Dynamically adding a new line to a table or listview?

Posted 30 June 2011 - 12:25 PM

Is your original table saved in a database somewhere, because you could add a method that adds the row to your database and the Bind your DataTable again.
Was This Post Helpful? 0
  • +
  • -

#7 Nakor  Icon User is offline

  • Professional Lurker
  • member icon

Reputation: 441
  • View blog
  • Posts: 1,488
  • Joined: 28-April 09

Re: Dynamically adding a new line to a table or listview?

Posted 30 June 2011 - 02:15 PM

so you want to be able to add multiple rows even if the user hasn't selected or saved any of the previous entries?
Was This Post Helpful? 0
  • +
  • -

#8 KCross  Icon User is offline

  • D.I.C Head

Reputation: 1
  • View blog
  • Posts: 51
  • Joined: 03-March 10

Re: Dynamically adding a new line to a table or listview?

Posted 25 July 2011 - 09:02 AM

View PostNakor, on 30 June 2011 - 04:15 PM, said:

so you want to be able to add multiple rows even if the user hasn't selected or saved any of the previous entries?


Yes, thats exactly what I want to do.

I'm still thinking a gridview might be the appropriate way to do this...
Was This Post Helpful? 0
  • +
  • -

#9 Nakor  Icon User is offline

  • Professional Lurker
  • member icon

Reputation: 441
  • View blog
  • Posts: 1,488
  • Joined: 28-April 09

Re: Dynamically adding a new line to a table or listview?

Posted 25 July 2011 - 11:23 AM

You'd probably need to maintain a count of rows that have been added using either a hidden control or a viewstate backed parameter

// example of a parameter that uses ViewState
private int RowCount
{
  get
  {
    object temp = ViewState["RowCount"];
    return temp == null ? 0 : (int)temp;
  }
  set { ViewState["RowCount"] = value; }
}



you're add row button event would need to increment this value.

and then on the gridview's prerender event use a loop to add that number of rows onto the gridview.



This post has been edited by Nakor: 25 July 2011 - 11:24 AM

Was This Post Helpful? 0
  • +
  • -

#10 KCross  Icon User is offline

  • D.I.C Head

Reputation: 1
  • View blog
  • Posts: 51
  • Joined: 03-March 10

Re: Dynamically adding a new line to a table or listview?

Posted 27 July 2011 - 08:06 AM

View PostNakor, on 25 July 2011 - 01:23 PM, said:

You'd probably need to maintain a count of rows that have been added using either a hidden control or a viewstate backed parameter

// example of a parameter that uses ViewState
private int RowCount
{
  get
  {
    object temp = ViewState["RowCount"];
    return temp == null ? 0 : (int)temp;
  }
  set { ViewState["RowCount"] = value; }
}



you're add row button event would need to increment this value.

and then on the gridview's prerender event use a loop to add that number of rows onto the gridview.




I just realized a gridview has to be databound. So that isn't going to work.

I'm so frustrated with this I'm honestly ready to quit coding. I've been "hobby" coding for 2 years now, with no access to a real life mentor or resource, save the terrible beginner books I have. I have virtually no understanding of what seem to be basic programming concepts.

Whats worse is, I'm stuck with this program. I coded it for work, as a way to introduce myself to developing. And now I'm supposed to support it, add features as requested, etc. And I just dont have the skillset to do this.

Sorry for the rant. If I was a woman, I'd definitely be crying today.
Was This Post Helpful? 0
  • +
  • -

#11 KCross  Icon User is offline

  • D.I.C Head

Reputation: 1
  • View blog
  • Posts: 51
  • Joined: 03-March 10

Re: Dynamically adding a new line to a table or listview?

Posted 27 July 2011 - 09:23 AM

I don't understand.

http://viralpatel.ne...javascript.html

and

http://www.mredkj.co...ableaddrow.html

Both are exactly what I require.

Here is my new attempt:

HDTable.js
// Last updated 2006-02-21
function addRowToTable() {
    var tbl = document.getElementById('tblHD');
    var lastRow = tbl.rows.length;
    // if there's no header row in the table, then iteration = lastRow + 1
    var iteration = lastRow;
    var row = tbl.insertRow(lastRow);

    // left cell
    var cellLeft = row.insertCell(0);
    var textNode = document.createTextNode(iteration);
    cellLeft.appendChild(textNode);

    // right cell
    var cellRight = row.insertCell(1);
    var el = document.createElement('input');
    el.type = 'text';
    el.name = 'txtRow' + iteration;
    el.id = 'txtRow' + iteration;
    el.size = 40;

    el.onkeypress = keyPressTest;
    cellRight.appendChild(el);

    // select cell
    var cellRightSel = row.insertCell(2);
    var sel = document.createElement('select');
    sel.name = 'selRow' + iteration;
    sel.options[0] = new Option('text zero', 'value0');
    sel.options[1] = new Option('text one', 'value1');
    cellRightSel.appendChild(sel);
}


ServerCreation.aspx.cs
public partial class ServerCreation : System.Web.UI.Page
    {
        UserData objUserData = new UserData();

        public void RegisterClientScriptBlock(Type type, string key, string script)
        {
        }

        protected void Page_Load(object sender, EventArgs e)
        {            
            string strAdminType = objUserData.strUserType;

            string csName = "HDAddScript";
            Type csType = this.GetType();
            ClientScriptManager cs = Page.ClientScript;
            if (!cs.IsClientScriptBlockRegistered(csType, csName))
            {
                StringBuilder csText = new StringBuilder();
                System.IO.StreamReader srScript = new System.IO.StreamReader(@"C:\Users\kcross.EAPDLAW\Documents\Visual Studio 2010\Projects\Loaner Inventory\Loaner Inventory\Server\HDTable.js");
                csText.Append(srScript.ReadToEnd());
                cs.RegisterClientScriptBlock(csType, csName, csText.ToString());
            }



ServerCreation.aspx
<asp:Panel runat="server" ID="pnlHardDrive" GroupingText="Hard Drive" Font-Names="Calibri">
                <asp:Table ID="tblHD" runat="server" EnableViewState="True"><asp:TableRow><asp:TableCell></asp:TableCell><asp:TableCell Width="130px"><asp:Button runat="server" ID="btnAddHD" text="Add Another" onclick="addRowToTable()" /></asp:TableCell></asp:TableRow></asp:Table>
            </asp:Panel>


And this is the error I get:

Server Error in '/' Application.
--------------------------------------------------------------------------------

Compilation Error
Description: An error occurred during the compilation of a resource required to service this request. Please review the following specific error details and modify your source code appropriately.

Compiler Error Message: CS1061: 'ASP.server_servercreation_aspx' does not contain a definition for 'addRowToTable' and no extension method 'addRowToTable' accepting a first argument of type 'ASP.server_servercreation_aspx' could be found (are you missing a using directive or an assembly reference?)

Source Error:



Line 32:
Line 33: <asp:TableRow><asp:TableCell><asp:Panel runat="server" ID="pnlHardDrive" GroupingText="Hard Drive" Font-Names="Calibri">
Line 34: <asp:Table ID="tblHD" runat="server" EnableViewState="True"><asp:TableRow><asp:TableCell></asp:TableCell><asp:TableCell Width="130px"><asp:Button runat="server" ID="btnAddHD" text="Add Another" onclick="addRowToTable()" /></asp:TableCell></asp:TableRow></asp:Table>
Line 35: </asp:Panel></asp:TableCell></asp:TableRow>
Line 36: </asp:Table>


Source File: c:\Users\kcross.EAPDLAW\Documents\Visual Studio 2010\Projects\Loaner Inventory\Loaner Inventory\Server\ServerCreation.aspx Line: 34

This post has been edited by KCross: 27 July 2011 - 09:26 AM

Was This Post Helpful? 0
  • +
  • -

#12 Gavisann  Icon User is offline

  • D.I.C Regular
  • member icon

Reputation: 103
  • View blog
  • Posts: 382
  • Joined: 01-July 11

Re: Dynamically adding a new line to a table or listview?

Posted 27 July 2011 - 09:36 AM

onclick is server side. You want to use OnClientClick="addRowToTable()" or


<script>
void submit_click(object sender, EventArgs e)
    {
        
submit.Attributes.Add("onload", "addRowToTable()");

        }
</script>

<asp:Button onclick="submit_click" runat="server" ID="submit" text="submit" />



Was This Post Helpful? 0
  • +
  • -

#13 KCross  Icon User is offline

  • D.I.C Head

Reputation: 1
  • View blog
  • Posts: 51
  • Joined: 03-March 10

Re: Dynamically adding a new line to a table or listview?

Posted 27 July 2011 - 09:43 AM

View PostGavisann, on 27 July 2011 - 11:36 AM, said:

onclick is server side. You want to use OnClientClick="addRowToTable()" or


<script>
void submit_click(object sender, EventArgs e)
    {
        
submit.Attributes.Add("onload", "addRowToTable()");

        }
</script>

<asp:Button onclick="submit_click" runat="server" ID="submit" text="submit" />




OK! Figured I'd overlook something like that...

Now the .js file seems to be all in text above where the page renders... See attached file...
Posted Image

This post has been edited by KCross: 27 July 2011 - 09:45 AM

Was This Post Helpful? 0
  • +
  • -

#14 Gavisann  Icon User is offline

  • D.I.C Regular
  • member icon

Reputation: 103
  • View blog
  • Posts: 382
  • Joined: 01-July 11

Re: Dynamically adding a new line to a table or listview?

Posted 27 July 2011 - 09:49 AM

Your picture isn't showing. If you are seeing code as text, you might have a misplaced bracket.

This post has been edited by Gavisann: 27 July 2011 - 10:00 AM

Was This Post Helpful? 0
  • +
  • -

#15 KCross  Icon User is offline

  • D.I.C Head

Reputation: 1
  • View blog
  • Posts: 51
  • Joined: 03-March 10

Re: Dynamically adding a new line to a table or listview?

Posted 27 July 2011 - 10:14 AM

View PostGavisann, on 27 July 2011 - 11:49 AM, said:

Your picture isn't showing. If you are seeing code as text, you might have a misplaced bracket.


It's possible, but I think it has something to do with this:

string csName = "HDAddScript";
14
            Type csType = this.GetType();
15
            ClientScriptManager cs = Page.ClientScript;
16
            if (!cs.IsClientScriptBlockRegistered(csType, csName))
17
            {
18
                StringBuilder csText = new StringBuilder();
19
                System.IO.StreamReader srScript = new System.IO.StreamReader(@"C:\Users\kcross.EAPDLAW\Documents\Visual Studio 2010\Projects\Loaner Inventory\Loaner Inventory\Server\HDTable.js");
20
                csText.Append(srScript.ReadToEnd());
21
                cs.RegisterClientScriptBlock(csType, csName, csText.ToString());


I think something about that process isn't functioning properly.
Was This Post Helpful? 0
  • +
  • -

  • (2 Pages)
  • +
  • 1
  • 2