How do I get the value of a radio button group when the add button is clicked?
Below is what I have so far:
http://jsfiddle.net/RBYzm/
Whenever I add a row to the other table no matter which radio button I select it does not showup as selected in the table that I am adding rows to.
I see that you are not setting the values of row that is added to the one from which you want to add.. You are just creating the elements but not copying over the values from the main table..
Why don't you just use .clone() instead..
EDIT
UPDATED FIDDLE
I have made some changes in the code.. Changed the id's where there were duplicates.. Also accessing the values of the current row and copying it over to the newly added row..
Related
Have a list of licenses plates that start with a disabled button and no line selected.
Here is what should to do:
When select a row, button "Go foward" enable;
When select a row already selected, deselect it and disabled button again.
When list have a row selected and user click in another row, deselect old row and select the new one.
The snippet code i did:
https://codesandbox.io/s/busy-galileo-mw3p3?fontsize=14&hidenavigation=1&theme=dark
Facing this problems:
Need 2 clicks to set css style 'custom-col-row-active' to row selected. Button is enable already first click.
When a line is already selected, when you click on the other lines, they are selected as well. With 1 click on a selected line, all are deselected.
I know need use data table to deselect line already select, but i don't know how to get the full data table, since i only get the data when i click in a specif row.
Any tips here?
#Rafael, I don't know much about tabler-react, but this is just my suggestion for you. Your handleSetActivedRow seems to have problem. I don't understand why you have written onClick={(e) => handleSetActivedRow(e)}. You are calling a function inline when onClick itself and again you are taking it to an other function handleSetActivedRow. This is bad coding; instead you can do like this onClick={handleSetActiveRow}. secondly, you need to check again your handleSetActiveRow function. I don't understand why you want to return? when it is not necessary. What you need to check on is that you want to set the className to -active when you click on an element.
I have table with checkall/uncheckall check box functionality and table is having and some input fields like text boxes, dropdowns. User should select at least one checkbox for processing the data in the table. That is working fine. For example table is having 3 rows and user select any one checkbox and click on submit button then remaining two table rows should be removed and not being submitted. I tried with the below one .
$("input:not(:checked)").each(function () {
$('input:not(:checked)').closest('tr').remove();
});
But this one is removing entire table. So I need only those table rows which are unchecked should be removed. Any help would be greatly appreaciated.
Assuming you don't use <th></th>, your header row also got selected because that checkbox is also unchecked. May be that will be the reason all rows got deleted. Console input:not:(:checked) it . It will give clear idea.
Edit:
Then try this, may be this will work
$('#tableid').find('tr[input:not:(:checked)]').each(function()
{
$(this).remove();
}
It seems to be working fine for me: https://jsfiddle.net/r9zgvbqu/7/
Two comments, you are using the .each() function to do something for all elements selected by "input:not:(:checked)", but in that function selecting everything again. so you are just doing the same thing multiple times. You can skip that step, and also skip the .each()-$(this) combination that has been suggested, by straightup doing:
$("input:not(:checked)").closest('tr').remove();
This removes all the you want.
EDIT: Your problem is that you are selecting all non-checked inputs, including text inputs etc. You can specify the type of input you are selection: input[type=checkbox]:not(:checked)
In general, I would avoid selecting elements by their tag name. It's better to give the relevant checkboxes a class, and you can select them by class.
Here is a fixed version of your fiddle: https://jsfiddle.net/927sdh8n/
And here is a simpler and safer version using classes: https://jsfiddle.net/qz53wfxc/
I have a popup data table in each row of a maintable with some checkboxes in it.
I am selecting/checking items randomly by clicking the checkbox buttons for each row and printing the values checked with the help of Print button.
I am observing that only the last selection of checkbox buttons are overwriting all the earlier selections.
How can I get the appropriate selection of checkbox buttons corresponding to each row?
Snippet: https://snippet.webix.com/11irkt7o
Thanks.
You code uses a single instance of popup table for each rows, so as result whey you are calling $$pt.eachRow you are itterating other the last active value, all previous values are lost.
The better solution will be to use click handler of close button, to get all checked rows and store that data in the master row
{view:"button", label:"Close", click:function(){
ids = collectCheckedRows($$('p_table'));
$$('mytable').updateItem(selectedRow, { checked : ids })
this.getTopParentView().hide()
}}
Now, to print all values you can use
$$('mytable').eachRow(function(id){
console.log(id, this.getItem(id).checked);
});
I have a dropdown that loads the data and there is a Add button and when the add button is being triggered it will be disabled. It works in the first load, but when the dropdown is onchange the disabled button will be false or not disabled. So how can I still disable the button when the dropdown is being changed. I have also a input field to store the values of the button that has been clicked. Check http://jsfiddle.net/leonardeveloper/qy9u5/.
Problem is, you are appending a new element every time your <select> is changed. You need to be showing and hiding the same respective table each time. You can use jQuery to create those tables using the <option>s. Like so:
$("#loads option").each(function(){
thisNumber = this.value;
$("#displays").append("<table data-table="+thisNumber+"><tr><td>"+thisNumber+"</td><td>"+thisNumber+"</td><td><button class='materialId' value='"+thisNumber+"'>Add</button></td></tr></table>");
$("#displays table").hide();
});
We append the tables (2 in this case) to #displays, and then hide them. When we change the <select> now, we hide all tables, and show the one we selected, I've used data-table for this but there are many ways to target your specific table.
$(document).on("change","#loads", function(){
$("#displays table").hide();
$("#displays table[data-table="+this.value+"]").show();
});
JSFiddle
Try to bind click event also.
Demo
$(document).on("change click","#loads",...
I'm new to jquery and need some help.
I would like jquery to select a value inside the Quantities table cell, depending on whether or not a radio button within the table row has been selected.
you can see a screenshot of the table here.
The table name is tblOfferings; the radio button name is rdbOfferings; the td Offerings name is offerQuant.
my attempt so far
Quantities = jQuery("td>span:contains('offerQuant')").closest("input[name='rdbOffering']:checked").find('offerQuant').val();
help?
quantity = $('input[name="rdbOffering"]:checked').parents('tr').find('td.offerQuant').text();
i hope that's what you mean
check this http://jsfiddle.net/bondythegreat/Ycm7L/