Changing the tabular data to another table using jquery - javascript

I tried to implement to display data in a table with the button click. Now I am trying to move the data from the table to the below the continue table. In this code, when I enter the input value from the json object and click the submit button, data will display in a table with a continue button and a empty table below.When I click continue the data in the above table should move to table which is located below the continue button. Here is my code [Sample http://jsfiddle.net/e254w/6/] Can anyone please suggest the idea of implement the scenario?
Krish

One way to approach this would be to remove the row from the first table and append it to the second.
This line finds the second row in the first table, removes it if it exists and appends it to the second table.
$('#datatable').find('tr').eq(1).remove().appendTo($('#seconddatatable'));
updated fiddle
Updated fiddle - this works for me first entering 122233334444, then entering 122223355552

Related

How to add a textField to a specific row inside a table onclick of a button using reactjs & material ui

I want to add multiple textfield on to a specific row inside a table whenever the specific row add button is clicked, currently I am able to add text field onclick of add button but whenever the add button is clicked the textfield is getting added in every row of the table. Also the add icon needs to be next to the last text field but currently I could only achieve it having it on the 1st text field. Please someone help me out here. Image of what i have achieved so far.
As you can see I'm trying to add textfields on 1st row ,but it is automatically adding textfields in every row of table.
Working codesandbox:
https://codesandbox.io/s/broken-dream-7nncc?file=/src/App.js
There are a few ways to do it. A quick way is to (as Muhammad said) handle the button click for each row.
Meaning that you need to pass to the addCustomFile method the row Id and store this in your array.
Then when you map the customRow array in your main TableBody make sure to add the two custom columns only if there is a match between the customRow.rowID and the row ID you are currently rendering.
I`ve modified your sandbox https://codesandbox.io/s/infallible-resonance-qn64l?file=/src/App.js:1807-1820
you have to handle button click for each row. right now just one state so therefore it is showing in each cell
Maybe give this a try
https://www.w3schools.com/code/tryit.asp?filename=GQP3C100TJZH
hopefully it solves what you are looking for, if not please provide me with a bit more detailed issue of what exactly you want
This at the moment just works for one row and maybe for two rows you can try it by adding a it is not exactly a text field area but it should be a similar fix.

How to populate one table from db selecting a row of another table?

I'm new registered user...
I read a lot this website where I always found out what I was looking for, but this time I'm stuck.
Here is my problem:
I have two tables.
First table is about litigation and second one is activity done by lawyer for that litigation.
The first is filled with the opening of the page from db(litigation).
I saw the possibility to select each row of the table using a code in javascript but the question is: when I select the row I would like to populate the second table with the activity done for that litigation.
Example:
I select the row about litigation (white vs red) and in the second table i would like to have ex. wrote letter to other part, access to Court... and so on...
How can I do it?
Thank you in advance.

adding rows inside grid extjs

I am trying to add rows dynamically inside a grid using a button and remove individual rows using an action column function. I have two text fields (name, email) inside the grid on each row. So when the user hits the add button, a new row should appear with name and email fields. The third column would be an action column and when the button in the action column is clicked the entire row should be removed.
It would greatly help me out if somebody could share some sample code for me to get started.
There are some great code examples in the docs. This is where you have to head first, before asking here.
Look at this row editing example.

Accessing datagrid cell in a javascript

Datagrid is in content,When trying to access client side function for the cells in the datagrid,its always showing at 0 position
suppose i have 10 rows,for each row "Test button" i should invoke the client side java script.
For each row "Test button" client side script is displaying message at first row only.
in datagrid i am binding the description and button to every row in datagrid
so i have added Testbutton.attributes.add("onclick","return javascriptfunction();"); in
datagrid_itembound.Iam showing one div in client side function
but that is working only for one row,when iam trying to click test button in second row,its
showing that div in first row instead of second row
i want similar functunality like displaying of flag button in stackoverflow.
The datagrid/gridview results in a table. You could get the table by it's ID using getElementById use getElementsByTagName to get the rows/columns and/or use jQuery to help do it for you.
The below links should help:
http://www.thescarms.com/dotnet/webdatagrid.aspx
http://forums.asp.net/p/1520596/3652832.aspx
http://www.vbforums.com/showthread.php?t=429055
http://www.netomatix.com/development/gridviewclientsideaccess.aspx
This last one uses jquery...
http://aspdotnetcodebook.blogspot.com/2010/01/how-to-get-cell-value-of-gridview-using.html

How to add a row below the currently selected row (based on a dropdown input) using jQuery?

I have a table with a bunch of rows. In the last column of every row, there is a dropdown. When the dropdown changes, I need a new table row to appear below the row where the user selected the dropdown item. However, I also need the new row to have different data depending on what was selected in the dropdown.
Is any of this possible using only jQuery?
Note that I'm using ASP.NET for back-end development, so if a solution can be found without using ID's that would be great.
$("table select").live("click",function(){
var row=$(this).parent().parent();//add some .parent() untill you get the TR element
var val=$(this).val(); //<select> value if you want to use it for some conditions
$("<tr><td>....</td></tr>").insertAfter(row);
})
It's simple enough to add the HTML using JQuery. However, if you intend to save this data back to the server, the default ASP.NET process (using ViewState) will ignore the new rows. Instead, you would need to directly read the submitted form properties.
To learn how to add a row, look at the suggestions here: How to add a new row to a specified table with jQuery?

Categories