hi i have some problem when i try to make some php with javascript function
what i want to make is a textbox that will go enable / disable depending on checkbox on left side
this is my code
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
<script type="text/javascript">
function enable_txtbox(id){
if(document.getElementById(id).disabled){
document.getElementById(id).disabled=false;
var x = document.getElementById(id).disabled;
document.getElementById("demo").innerHTML=x;
}
else
document.getElementById(id).disabled=true;
}
</script>
</head>
<body>
<form method="get">
<table>
<tbody>
<tr>
<td>Nama Gejala</td>
<td>:</td>
<td><input type="text" name="nama"></td>
</tr>
<tr>
<td>Jenis Gejala</td>
<td>:</td>
<td><select name="jenis">
<option value="0">Umum</option>
<option value="1">Khusus</option>
</select></td>
</tr>
</tbody>
</table>
<table>
<thead>
<tr>
<td>Penyakit yang Berhubungan</td>
<td>:</td>
</tr>
</thead>
<tbody>
<?php
$id=1;
while($row = mysqli_fetch_array($result)){
$id=$row['id'];
echo "<tr>";
echo "<td><input type='checkbox' name='chk$id' value='$id' onclick='enable_txtbox('".$id."')'>".$row['nama']."<br></td>";
echo "<td>Nilai Kepastian</td>";
echo"<td>:</td>";
echo "<td><input type='text' name='cf".$id." id='$id' disabled='disabled'></td>";
echo "</tr>";
}
mysqli_close($con);
?>
</tbody>
</table>
<table>
<tbody>
<tr>
<p id="demo"></p>
<td><input type="submit"></td>
</tr>
</tbody>
</table>
</form>
</body>
</html>
PS : i have more than 1 checkboxes and textboxes depending on my database file
thanks before and forgive me for my bad english skill :)
You should use jQuery to check whether the checkbox is checked.
Say you have a checkbox with id='idTag', and we would like to check whether the checkbox is checked or not.
$('#idTag').is(":checked")
This returns true should the Checkbox be checked; from that moment on you could use jQuery to either show the were it hidden, or append it to the div.
say the text input box has id 'textId'.
Method one:
if($('#idTag').is(":checked"))
$("#textId").css("display", "block"); //if you just like to show the block.
if($('#idTag').is(":checked"))
$("#textId").fadeIn("slow"); //Gives it a nice effect as well.
Method two:
<div id='DIV'>
<input type='checkbox' id='idTag' value='checkbox'/>
</div>
<script>
if($('#idTag').is(":checked"))
$("#DIV").append("<input type='text' placeholder='textbox' />");
</script>
You could simplify your function
DEMO http://jsfiddle.net/x8dSP/2853/
<script>
function enable_txtbox(id){
if(document.getElementById(id).disabled == true){
document.getElementById(id).disabled = false;
} else {
document.getElementById(id).disabled = true;
}
return true;
}
</script>
I hope this solves your problem.
Script...
function enable_txtbox(id){
if(document.getElementById(id).disabled){
document.getElementById(id).disabled=false;
var x = document.getElementById(id).disabled;
document.getElementById("demo").innerHTML=x;
} else {
document.getElementById(id).disabled=true;
var x = document.getElementById(id).disabled;
document.getElementById("demo").innerHTML=x;
}
}
HTML....
<table>
<tbody>
<tr>
<td>Nama Gejala</td>
<td>:</td>
<td><input type="text" name="nama"/></td>
</tr>
<tr>
<td>Jenis Gejala</td>
<td>:</td>
<td><select name="jenis">
<option value="0">Umum</option>
<option value="1">Khusus</option>
</select></td>
</tr>
</tbody>
</table>
<table>
<thead>
<tr>
<td>Penyakit yang Berhubungan</td>
<td>:</td>
</tr>
</thead>
<tbody>
<tr>
<td>check1</td>
<td><input type="checkbox" onclick="enable_txtbox('first')" /></td>
</tr>
<tr>
<td>Txt1</td>
<td><textarea id="first"> </textarea></td>
</tr>
<tr>
<td>check2</td>
<td><input type="checkbox" onclick="enable_txtbox('second')" /></td>
</tr>
<tr>
<td>Txt2</td>
<td><textarea id="second"> </textarea></td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<p id="demo"></p>
<td><input type="submit"/></td>
</tr>
</tbody>
</table>
JSPIDDLE
Related
I have this piece of code where values are coming from php
<table class="table datatable-basic">
<tr>
<th>-<th>
<th>title<th>
</tr>
//forloop
<tr>
<td><input class="chk" type="checkbox" name="uid[]" id="uid" value="<?php echo $id; ?>"></td>
</tr>
<tr>
<td><?php echo "$title" ?></td>
</tr>
</table>
<button id="go">GO</buton>
So in my jQuery, I want to alert the value of the check box which is id, when I click the button 'go' and when that check box is checked. How can I do this?
You can use this selector input.chk:checked and the function $.toArray to get the selected elements as array and then execute the function map to get the values.
Finally, the function join will create an string with the values from the array separated by comma.
$('#go').on('click', function() {
var selectedValues = $('input.chk:checked').toArray().map(function(chk) {
return $(chk).val();
});
console.log(selectedValues.join());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table datatable-basic">
<tr>
<th>title</th>
</tr>
<tr>
<td><input class="chk" type="checkbox" name="uid[]" id="uid" value="111"></td>
</tr>
<tr>
<td><input class="chk" type="checkbox" name="uid[]" id="uid" value="222"></td>
</tr>
<tr>
<td>Title</td>
</tr>
</table>
<button id="go">GO</buton>
There's a problem with your setup - they all have an ID of "uid". IDs must be unique.
But since they have a class you can do this:
var selectedValues = [];
$('input.chk:checked').each(function() {
selectedValues.push($(this).val());
});
The selectedValues array will contain the values of all of the selected checkboxes.
You could then join these together into a string separated by commas with join.
selectedValues.join(',');
To demonstrate the output I have omitted the PHP part from HTML. You can try the following code:
$('#go').click(function(){
var val = '';
$('.chk:checked').each(function(){
val += ', ' + $(this).val();
});
alert(val);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table datatable-basic">
<tr>
<th>-<th>
<th>title<th>
</tr>
<tr>
<td><input class="chk" type="checkbox" name="uid[]" id="uid" value="111"></td>
</tr>
<tr>
<td><input class="chk" type="checkbox" name="uid[]" id="uid" value="222"></td>
</tr>
<tr>
<td>Title</td>
</tr>
</table>
<button id="go">GO</buton>
I am trying to create a form where the user can click on a button that will create a blank row at the bottom of the table. They can click this button for as many rows as they want to add. For some reason, when I click on the button I created, it goes back to my index.php page instead of just adding the row to the current page. Here is some of the code. Please let me know if there is more information that I should be adding here.
Thank you
JavaScript:
function new_line() {
var t = document.getElementById("desc_table");
var rows = t.getElementsByTagName("tr");
var r = rows[rows.length - 1];
var x = rows[1].cloneNode(true);
x.style.display = "";
r.parentNode.insertBefore(x, r);
}
<?php include 'connect.php'; ?>
<!DOCTYPE xhtml>
<html>
<head>
<style type="text/css"><?php //include'css\file.css';?></style>
<script type="text/javascript" src="js/new_line.js"></script>
<script type="text/javascript" src="js/menu.js"></script>
<body>
<button id="home" onclick="home_btn()">Home</button>
<title>New Estimate</title>
<h1>New Estimate</h1>
<?php
$sql = $conn->prepare('SELECT * FROM entire_info');
$sql -> execute();
$result = $sql ->get_result();
if ($result->num_rows!=0) {
$entire_info=$result->fetch_assoc();
}
else{
echo'Cannot find company information<br>';
}
?>
<form>
<table id="estimate_table">
<tr>
<td>
<?php
echo '<h1>'.$entire_info['name'].'</h1><br>'.
$entire_info['str_address'].'<br>'.
$entire_info['city'].', '.$entire_info['province'].' '.$entire_info['postal']
.'<br>Phone:'.$entire_info['phone'].'<br>Fax:'.$entire_info['fax'].'<br>'.$entire_info['email'].'<br>';
?>
<br>
</td>
<td colspan="3" style="text-align: right;"><?php echo '<h1>Estimate</h1>'; ?></td>
</tr>
<tr>
<td>
<table>
<tr>
<td style="vertical-align: top;">
For:<br>
<select name="estimate_for">
<?php
$sql = $conn->prepare('SELECT * FROM company');
$sql -> execute();
$result = $sql ->get_result();
if ($result->num_rows>0) {
while ($row=$result->fetch_assoc()) {
$company_name = $row['company'];
echo '<option value="'.$company_name.'">'.$company_name.'</option>';
}
}
else{
echo'Cannot find company information<br>';
}
?>
</select>
</td>
<td>
Job:<br> <textarea name="job_name" style="width: 200px ! important;" style="height: 30px ! important;"></textarea>
</td>
</tr>
</table>
</td>
<td colspan="3" style="text-align: right;">
Invoice#: <br>
Date: <input type="text" name="estimate_date" value="<?php echo date('M d, Y'); ?>">
</td>
</tr>
</table>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<table id="desc_table">
<tr>
<td><font><br><h3>Description</h3></font></td>
<td><font><h3>Hours</h3></font></td>
<td><font><h3>Rate</h3></font></td>
<td><font><h3>Amount</h3></font></td>
</tr>
<tr>
<td ><textarea name="description" style="width: 400px" style="height: 100px ! important;"></textarea></td>
<td> <input type="text" name="hours"></td>
<td> <input type="text" name="rate"></td>
<td><input type="text" name="amount"></td>
<td>
<button onclick="new_line();">+</button>
</td>
</tr>
<tr>
<td colspan="3" style="text-align: right;"><h3>Subtotal</h3></td>
<td><input type="text" name="subtotal"></td>
</tr>
<tr>
<td colspan="3" style="text-align: right;"><h3>GST (#87221 2410)
</h3></td>
<td><input type="text" name="gst"></td>
</tr>
<tr>
<td colspan="3" style="text-align: right;"><h3>Total</h3></td>
<td><input type="text" name="subtotal"></td>
</tr>
</table>
</form>
</head>
</body>
</html>
Your button is inside a <form> so by default it will behave like a submit button.
You have to set its type to a normal button by adding the type attribute:
<button onclick="new_line();" type="button">+</button>
My code is like this :
<html>
<head>
<title>Test Loading</title>
</head>
<body>
<div id="header">
This is header
</div>
<div id="navigation">
This is navigation
</div>
<div id="content">
<form action="test2.php" method="post">
<table>
<tr>
<td>First Name</td>
<td>:</td>
<td><input type="text" name="first_name"></td>
</tr>
<tr>
<td>Last Name</td>
<td>:</td>
<td><input type="text" name="last_name"></td>
</tr>
<tr>
<td>Age</td>
<td>:</td>
<td><input type="text" name="age"></td>
</tr>
<tr>
<td>Hobby</td>
<td>:</td>
<td><input type="text" name="hobby"></td>
</tr>
<tr>
<td></td>
<td></td>
<td><input type="submit" Value="Submit"></td>
</tr>
</table>
</form>
</div>
<div id="footer">
This is footer
</div>
</body>
</html>
The complete code of test1.php : http://pastebin.com/idcGms0h
The complete code of test2.php : http://pastebin.com/rvBPTrhn
I want to load only the content area and skip header, navigation and footer loading
Besides that, I also want to add loading
Seems to use ajax, but I am still confused
How to load only the content area when click submit button?
Any help much appreciated
Cheers
you need to use ajax. please try this instead
before submit
<!DOCTYPE html>
<html>
<head>
<title>Test Loading</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
</head>
<body>
<div id="header">
This is header
</div>
<div id="navigation">
This is navigation
</div>
<div id="content">
<form action="" id="info">
<table>
<tr>
<td>First Name</td>
<td>:</td>
<td><input type="text" name="first_name"></td>
</tr>
<tr>
<td>Last Name</td>
<td>:</td>
<td><input type="text" name="last_name"></td>
</tr>
<tr>
<td>Age</td>
<td>:</td>
<td><input type="text" name="age"></td>
</tr>
<tr>
<td>Hobby</td>
<td>:</td>
<td><input type="text" name="hobby"></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</form>
</div>
<button id="submit">Submit</button>
<div id="footer">
This is footer
</div>
</body>
</html>
<script type="text/javascript">
var postData = "text";
$('#submit').on('click',function(){
$.ajax({
type: "post",
url: "test2.php",
data: $("#info").serialize(),
contentType: "application/x-www-form-urlencoded",
success: function(response) { // on success..
$('#content').html(response); // update the DIV
},
error: function(jqXHR, textStatus, errorThrown) {
console.log(errorThrown);
}
})
});
</script>
before submit form
test2.php contents
<table>
<tr>
<td>First Name</td>
<td>:</td>
<td> <?php echo $_POST['first_name']; ?></td>
</tr>
<tr>
<td>Last Name</td>
<td>:</td>
<td><?php echo $_POST['last_name']; ?></td>
</tr>
<tr>
<td>Age</td>
<td>:</td>
<td><?php echo $_POST['age']; ?></td>
</tr>
<tr>
<td>Hobby</td>
<td>:</td>
<td><?php echo $_POST['hobby']; ?></td>
</tr>
after submit form
You need to use ajax . to update only a part of the page. firstly,give
unique id's to form elements
1. i have given form an id regForm
2. submit button an id submitButton
you can either listen to form submit or click of the submit button
listening to the click of submit button ....
$("input#submitButton").on("click",function(event){
event.preventDefault();
var data = $('form#regForm').serialize();
$.ajax({
url: "test2.php",
method: "POST",
data: { data : data },
dataType: "html"
})
.done(function( responseData ) {
console.log("theresponse of the page is"+responseData);
$("div#content").empty();
///now you can update the contents of the div...for now i have just entered text "hey i m edited" ....and i have considered that you will echo out html data on test2.php .....so specified data type as html in ajax.
$("div#content").html("hey i m edited");
})
.fail(function( jqXHR, textStatus ) {
console.log("error occured");
});
})
Well you have to use jquery ajx for that.istead of writting a big code you can just use this plugin http://malsup.com/jquery/form/ when you using this plugin you don't have to change anything of your form (except setting a form ID)
$(document).ready(function() {
var options = {
target: '#output', //this is the element that show respond after ajax finish
};
// bind to the form's submit event
$('#myForm').submit(function() {
$(this).ajaxSubmit(options);
return false;
});
});
Change your form like that:
<form action="test2.php" method="post" id="myForm">
I output a table when the user selects something. I have a button that will allow the user to append an empty table row to the end of the table but I can't seem to get it working properly.
HTML generation code in PHP:
echo<table>
"<table id='roof-component-data-table'><tbody>
<tr>
<th>Roof Component</th>
<th>Delete</th>
</tr>";tr>
<tr id="roofComponentRow" style="display: none;">
//empty row used to clone<td><input type="text" id="roof-component-name" name="roof-component-name[]" value="" <="" td=""></td>
echo</tr>
"<tr id='roofComponentRow' style='display: none;'>"; <tr id="roofComponentRow0">
echo "<td><input type='text' id='roof <td><input type="text" id="roof-component-name'name" name='roofname="roof-component-name[]'name[]" value=''<value="Air Film" <="" td=""></td>";td>
echo "< <td><a href="#" class="removeRoofComponentRow" onclick="removeRoofComponent("Air Film")">Delete</tr>";a></td>
</tr>
while<tr ($roofComponentsRowid="roofComponentRow1">
= mysqli_fetch_array($roofComponentsData)) { <td><input type="text" id="roof-component-name" name="roof-component-name[]" value="Surfacing" <="" td=""></td>
echo<td><a "<trhref="#" id='roofComponentRow".class="removeRoofComponentRow" $ComponentRowCounteronclick="removeRoofComponent("Surfacing")">Delete</a></td>
."'>"; </tr>
<tr id="roofComponentRow2">
echo "<td><input type='text' id='roof <td><input type="text" id="roof-component-name'name" name='roofname="roof-component-name[]'name[]" value='".value="Membranes" $roofComponentsRow['roof_component_name']<="" ."'<td=""></td>";td>
echo "<td><a<td>Delete</td>";td>
</tr>
echo<tr "<id="roofComponentRow3">
<td><input type="text" id="roof-component-name" name="roof-component-name[]" value="Overlay Boards" <="" td=""></tr>";td>
<td>Delete</td>
</tr>
$ComponentRowCounter++; <tr id="roofComponentRow4">
} <td><input type="text" id="roof-component-name" name="roof-component-name[]" value="Insulation" <="" td=""></td>
echo "< <td><a href="#" class="removeRoofComponentRow" onclick="removeRoofComponent("Insulation")">Delete</table>";a></td>
</tr>
echo"<input type='button' value='+' id='addRoofComponentRow' class='addRoofComponentRow'</>";tbody>
</table>
<input type="button" value="+" id="addRoofComponentRow" class="addRoofComponentRow">
This is what my table looks like:
<table>
<tbody>
<tr>
<th>Roof Component</th>
<th>Delete</th>
</tr>
<tr id="roofComponentRow" style="display: none;">
<td><input type="text" id="roof-component-name" name="roof-component-name[]" value="" <="" td=""></td>
</tr>
<tr id="roofComponentRow0">
<td><input type="text" id="roof-component-name" name="roof-component-name[]" value="Air Film" <="" td=""></td>
<td>Delete</td>
</tr>
<tr id="roofComponentRow1">
<td><input type="text" id="roof-component-name" name="roof-component-name[]" value="Surfacing" <="" td=""></td>
<td>Delete</td>
</tr>
<tr id="roofComponentRow2">
<td><input type="text" id="roof-component-name" name="roof-component-name[]" value="Membranes" <="" td=""></td>
<td>Delete</td>
</tr>
<tr id="roofComponentRow3">
<td><input type="text" id="roof-component-name" name="roof-component-name[]" value="Overlay Boards" <="" td=""></td>
<td>Delete</td>
</tr>
<tr id="roofComponentRow4">
<td><input type="text" id="roof-component-name" name="roof-component-name[]" value="Insulation" <="" td=""></td>
<td>Delete</td>
</tr>
</tbody>
</table>
<input type="button" value="+" id="addRoofComponentRow" class="addRoofComponentRow">
Now when the user clicks the + button it will fire off some JS that should clone my empty row and append it to the end of the table.
Here is how I am attempting to do that:
$(function() {
var $removeIDValue = 0;
$(document.body).on('click', '.addRoofComponentRow', function () {
var $emptyRoofComponentRow = $("#roofComponentRow").clone();
$removeIDValue++
var $emptyRoofComponentRowClone = $emptyRoofComponentRow.clone();
var $newRowID = 'added_roof_component_row' + $removeIDValue;
$emptyRoofComponentRowClone.attr('id', $newRowID)
$emptyRoofComponentRowClone.children('td').last().after('<td>Delete</td>');
$('#roof-component-data-table').append($emptyRoofComponentRowClone);
$emptyRoofComponentRowClone.show();
});
});
When I click the button nothing is happening at all, I see nothing being added onto the table and I am getting no console errors at all. I also set an alert with that function to see if the function was even firing and my alert message did get displayed.
JSFiddle
Where am I going wrong here?
youre not appending it to anything
add <tbody id="roof-component-data-table">
https://jsfiddle.net/dr1g02go/5/
The function will work alright I guess, only there are three issues here:
the table that is selected cannot be selected, since the rendered table has no id. This is the biggest problem with this code.
echo "<td><input type='text' id='roof-component-name' name='roof-component-name[]' value=''</td>"; In this line the input isn't closed resulting in badly formed HTML.
In the HTML generation the delete link doesn't has escaped quotes, generating script errors.
Working fiddle: https://jsfiddle.net/dr1g02go/4/
I'm trying to have "set all" radio buttons at the bottom of my popup control so when the user has a long list of conflicts to resolve, they can just select one of the radio buttons and the option will be quickly select. However, my javascript fires, and seems to find the radio button, but fails to actually set the radio button.
I have a gridview gvErrors that is being looped though and in the second cell of each gridview row is a table with the options (tblOptions). I have tried using .attr("checked", true), .setAttribute("checked", true), and .prop("checked", true). I am receiving no errors, in the console, but the radio buttons all remain unchecked. Any help with this would be appreciated. Below is the Javascript.
<script type="text/javascript" language="javascript">
function selectAll(option) {
var grid = document.getElementById("<%=gvErrors.ClientID%>");
for (var i = 0; i < grid.rows.length; i++)
{
var row = grid.rows[i];
var table = $(row).find("tblOptions");
var radio = $(table).find("input[name*=" + option + "]:radio");
//$('td input:radiobutton', '#tblOptions').prop('checked', true);
$(radio).prop("checked", "checked");
var test = "";
}
};
</script>
<script type="text/javascript" language="javascript">
$(document).ready(function () {
//This handles the rows or colums selection
$("#<%=rdbCancelAll.ClientID%>").click(function() {
selectAll("rdbCancel");
});
});
</script>
<script type="text/javascript" language="javascript">
$(document).ready(function () {
//This handles the rows or colums selection
$("#<%=rdbReplaceAll.ClientID%>").click(function() {
selectAll("rdbReplace");
});
});
</script>
<script type="text/javascript" language="javascript">
$(document).ready(function () {
//This handles the rows or colums selection
$("#<%=rdbRenameAll.ClientID%>").click(function() {
selectAll("rdbRename");
});
});
</script>
Small example of the gridview:
<table class="tableinfo nocollapse c6" cellspacing="1" cellpadding="2" border="0" id="ctl00_Main_gvErrors">
<tbody>
<tr class="tableinfobody tableinfoGray">
<th scope="col"><span class="c1">Current Name</span></th>
<th scope="col"><span class="c1">Options</span></th>
<th scope="col">Differences</th>
</tr>
<tr class="tableinfobody">
<td class="l"><span id="ctl00_Main_gvErrors_ctl02_lblName">Test1</span></td>
<td class="l">
<table id="ctl00_Main_gvErrors_ctl02_tblOptions" border="0">
<tbody>
<tr>
<td><input id="ctl00_Main_gvErrors_ctl02_rdbCancel" type="radio" name=
"ctl00$Main$gvErrors$ctl02$Options" value="rdbCancel" /><label for=
"ctl00_Main_gvErrors_ctl02_rdbCancel">Cancel adding signal.</label></td>
</tr>
<tr>
<td><input id="ctl00_Main_gvErrors_ctl02_rdbReplace" type="radio" name=
"ctl00$Main$gvErrors$ctl02$Options" value="rdbReplace" /><label for=
"ctl00_Main_gvErrors_ctl02_rdbReplace">Replace curent signal with
imported signal.</label></td>
</tr>
<tr>
<td><input id="ctl00_Main_gvErrors_ctl02_rdbRename" type="radio" name=
"ctl00$Main$gvErrors$ctl02$Options" value="rdbRename" /><label for=
"ctl00_Main_gvErrors_ctl02_rdbRename">Rename imported signal to:</label>
<input name="ctl00$Main$gvErrors$ctl02$txtNewName" type="text" value=
"Test1_1" id="ctl00_Main_gvErrors_ctl02_txtNewName" class="c2" /></td>
</tr>
</tbody>
</table>
</td>
<td class="l">
<input type="hidden" name="ctl00$Main$gvErrors$ctl02$hfParamInternalUnmatched"
id="ctl00_Main_gvErrors_ctl02_hfParamInternalUnmatched" value=
"EBC1-Test1" /> <input type="hidden" name=
"ctl00$Main$gvErrors$ctl02$hfParamInternalMatched" id=
"ctl00_Main_gvErrors_ctl02_hfParamInternalMatched" value="Test1" />
<table class="tableinfo c5" cellspacing="1" cellpadding="2" border="0">
<tbody>
<tr class="tableinfobody tableinfoGray">
<th>Value Name</th>
<th>Current</th>
<th>Imported</th>
</tr>
<tr class="tableinfobody">
<td class="c3">Unit</td>
<td class="c4"></td>
<td class="c4">flag</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr class="tableinfobody tableinfoGray">
<td class="l"><span id="ctl00_Main_gvErrors_ctl03_lblName">Test2</span></td>
<td class="l">
<table id="ctl00_Main_gvErrors_ctl03_tblOptions" border="0">
<tbody>
<tr>
<td><input id="ctl00_Main_gvErrors_ctl03_rdbCancel" type="radio" name=
"ctl00$Main$gvErrors$ctl03$Options" value="rdbCancel" /><label for=
"ctl00_Main_gvErrors_ctl03_rdbCancel">Cancel adding signal.</label></td>
</tr>
<tr>
<td><input id="ctl00_Main_gvErrors_ctl03_rdbReplace" type="radio" name=
"ctl00$Main$gvErrors$ctl03$Options" value="rdbReplace" /><label for=
"ctl00_Main_gvErrors_ctl03_rdbReplace">Replace curent signal with
imported signal.</label></td>
</tr>
<tr>
<td><input id="ctl00_Main_gvErrors_ctl03_rdbRename" type="radio" name=
"ctl00$Main$gvErrors$ctl03$Options" value="rdbRename" /><label for=
"ctl00_Main_gvErrors_ctl03_rdbRename">Rename imported signal to:</label>
<input name="ctl00$Main$gvErrors$ctl03$txtNewName" type="text" value=
"Test2_1" id="ctl00_Main_gvErrors_ctl03_txtNewName" class="c2" /></td>
</tr>
</tbody>
</table>
</td>
<td class="l">
<input type="hidden" name="ctl00$Main$gvErrors$ctl03$hfParamInternalUnmatched"
id="ctl00_Main_gvErrors_ctl03_hfParamInternalUnmatched" value=
"HCMData3-Testw" /> <input type="hidden" name=
"ctl00$Main$gvErrors$ctl03$hfParamInternalMatched" id=
"ctl00_Main_gvErrors_ctl03_hfParamInternalMatched" value=
"PrimaryData3-Testw" />
<table class="tableinfo c5" cellspacing="1" cellpadding="2" border="0">
<tbody>
<tr class="tableinfobody tableinfoGray">
<th>Value Name</th>
<th>Current</th>
<th>Imported</th>
</tr>
<tr class="tableinfobody">
<td class="c3">SA</td>
<td class="c4">3, 239</td>
<td class="c4">239</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr class="tableinfobody tableinfoBlue">
<td> </td>
<td> </td>
<td> </td>
</tr>
</tbody>
Any help clearing this up would be greatly appreciated.
Use the value as a selector like so
function selectAll(option) {
var radio = $("input[value=" + option + "]");
$(radio).prop("checked", "checked");
}
$('input[type="button"]').on('click', function(){
var value = $(this).data('attr');
selectAll(value);
});
http://jsfiddle.net/3u3z4bLn/3/