I need to select this (RADIO)

[jemz]

Hi, I have problem how can i select the radio button when i am going to double click in table row.

Let say that this is a working code

while ($row = mysql_fetch_array($myresult)) {
 <tr  ondblclick=\"GetSelect('".$row['emp_num']."')\"  >
	<td><input type=\"radio\"  name=\"myradio\" value=".$row['emp_num']."  > </td>
				
				<td >".$row['emp_name']."</td>
				<td >".$row['emp_desc']."</td>
}

this is in other file, but the problem here i could not select the radio button,can you help me please on this.

   function GetSelect(empnum){

                 $('input[name=myradio]:radio').each(function(){
                      if($('input[name=myradio]:radio').val()==empnum){
                            $(this).attr('checked',true);
                      }
                  });

Thank you in advance.

[Pullo]

Hi jemz,

It's better to use an event handler and lose the in-line code:

<?php while ($row = mysql_fetch_array($myresult)) { ?>

  <tr class="myRow">
    <td><input type="radio" name="myradio" value="<?php echo $row[''emp_num] ?>"></td>
    <td><?php echo $row['emp_name'] ?></td>
    <td><?php echo $row['emp_desc'] ?></td>
  </tr>

<?php  } ?>

The JavaScript:

$(document).ready(function() {
  $(".myRow").dblclick(function() {
    $(this).find("td > input[type='radio']").css("display", "none");
  });
});

HTH

[Pullo]

Sorry, typo:

<input type="radio" name="myradio" value="<?php echo $row[''emp_num] ?>">

should be:

<input type="radio" name="myradio" value="<?php echo $row['emp_num'] ?>">

[jemz]

[QUOTE=Pullo;5305030]Sorry, typo:

<input type="radio" name="myradio" value="<?php echo $row[''emp_num] ?>">

should be:

Hi pullo thank you for the reply...why you put none?

.css("display", "none");

[Pullo]

Sorry, it was just an example of how to target the radio buttons.
Just change .css("display", "none") into whatever you want.

[jemz]

Sorry, it was just an example of how to target the radio buttons.
Just change .css("display", "none") into whatever you want.

Hi Pullo, I tried this

$('.myRow').dblclick(function(){
$(this).find("td > input[type='radio']").attr('checked','checked');
});

it's not working...

[Pullo]

Try this:

$(this).find("td > input[type='radio']").prop('checked',true);

[jemz]

Try this:

$(this).find("td > input[type='radio']").prop('checked',true);

Hi pullo, nothing happened...

[Pullo]

Hi pullo, nothing happened...

Weird, both versions work fine for me.
You are double clicking on the table cells, aren't you?

[jemz]

Weird, both versions work fine for me.
You are double clicking on the table cells, aren't you?

yeah, I don't know why it's not working for me...how can i get the id the one that i click in row ?

[Pullo]

Which id?

Could you maybe run your PHP script, look at the source code which is generated and post a snippet of that, along with your JavaScript?
This way, I can see what HTML you are really trying to target and I don't have to worry what your PHP script is actually doing.

[jemz]

Which id?

Could you maybe run your PHP script, look at the source code which is generated and post a snippet of that, along with your JavaScript?
This way, I can see what HTML you are really trying to target and I don't have to worry what your PHP script is actually doing.

this is what i mean.

 while ($row = mysql_fetch_array($myresult)) {
 <tr onclick=\"someotherFunction()\" ondblclick=\"GetSelect('".$row['emp_num']."')\"  >
	<td><input type=\"radio\"  name=\"myradio\" value=".$row['emp_num']."  > </td>
				
				<td  >".$row['emp_name']."</td>
				<td >".$row['emp_desc']."</td>

}

Hi pullo i apologize my mistake,,i figure it out that i am having two functions inside the 'tr' one function is for the geting the value of radio button which is getSelect the other function is for displaying the table via javascript which is someotherfunction()...both are having 'onclick' i noticed that this will not work so i change getSelect to ondblclick ,but what happen is that inside the function getSelect i change the attr to checked it will checked the radio button when i double click the row but the check will disappear immediately..

[Pullo]

Okay.
So, let's back up a little.
We should be able to sort this out, but first off, we really need to take PHP out of the equation.

I don't want to see the PHP code which generates the table, rather it would help a lot more if you could post the HTML code which your PHP generates (include three sample lines).

Something like this:

<table>
  <tr on click=".." ondblclick="..">
    <td><input type="radio"  name="myradio" value="1"></td>
    <td>John Doe</td>
    <td>Worker</td>
  </tr>
  <tr on click=".." ondblclick="..">
    <td><input type="radio"  name="myradio" value="2"></td>
    <td>Prince Dave</td>
    <td>Boss</td>
  </tr>
  <tr on click=".." ondblclick="..">
    <td><input type="radio"  name="myradio" value="3"></td>
    <td>Managing Director</td>
    <td>Servant</td>
  </tr>
</table>

If you do that, I can show you how to target the specific elements and manipulate them to do what you need.

[jemz]

Okay.
So, let's back up a little.
We should be able to sort this out, but first off, we really need to take PHP out of the equation.

I don't want to see the PHP code which generates the table, rather it would help a lot more if you could post the HTML code which your PHP generates (include three sample lines).

Something like this:

<table>
  <tr on click=".." ondblclick="..">
    <td><input type="radio"  name="myradio" value="1"></td>
    <td>John Doe</td>
    <td>Worker</td>
  </tr>
  <tr on click=".." ondblclick="..">
    <td><input type="radio"  name="myradio" value="2"></td>
    <td>Prince Dave</td>
    <td>Boss</td>
  </tr>
  <tr on click=".." ondblclick="..">
    <td><input type="radio"  name="myradio" value="3"></td>
    <td>Managing Director</td>
    <td>Servant</td>
  </tr>
</table>

If you do that, I can show you how to target the specific elements and manipulate them to do what you need.

Okay here it is,i hope this is what you mean

<table>
<tr  ondblclick="GetSelect('0002');" onclick="myOtherFunction('0002');">
	<td>
		<span>
			<input  type="radio" value="0002" name="rad">
		</span>
	</td>
	<td>
		<span>0002 </span>
	</td>
	<td>
		<span>Manager</span>
	</td>
	<td>
		<span>2012-12-28</span>
	</td>
</tr>

<tr  ondblclick="GetSelect('0003');" onclick="myOtherFunction('0003');">
	<td>
		<span>
			<input  type="radio" value="0003" name="rad">
		</span>
	</td>
	<td>
		<span>0003 </span>
	</td>
	<td>
		<span>Supervisor</span>
	</td>
	<td>
		<span>2012-12-28</span>
	</td>
</tr>

<tr  ondblclick="GetSelect('0003');" onclick="myOtherFunction('0003');">
	<td>
		<span>
			<input  type="radio" value="0003" name="rad">
		</span>
	</td>
	<td>
		<span>0003</span>
	</td>
	<td>
		<span>SEO</span>
	</td>
	<td>
		<span>2012-12-28</span>
	</td>
</tr>

</table>

[Pullo]

Yeah, that's what I meant.
Now what exactly is it you would like to have happen?

[jemz]

Yeah, that's what I meant.
Now what exactly is it you would like to have happen?

I want that when i am going to click in a row the radio button will be selected,if i click another row the radio button will be selected,i want also that only one radio button will be selected every time i click. Thank you in advance.

[Pullo]

So, just to understand:
If you click row one, then the row one radio button is selected.
If you then click row three, then the row one radio button is deselected and the row three radio button is selected instead.
Is this correct?

[jemz]

So, just to understand:
If you click row one, then the row one radio button is selected.
If you then click row three, then the row one radio button is deselected and the row three radio button is selected instead.
Is this correct?

yes your correct

[Pullo]

You can do it like this:

<!DOCTYPE HTML>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Radio button example</title>
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
  </head>

  <body>
    <table class="myTable">
      <tr  class="myRow">
        <td><span><input  type="radio" value="0002" name="rad"></span></td>
        <td><span>0002</span></td>
        <td><span>Manager</span></td>
        <td><span>2012-12-28</span></td>
      </tr>
      
      <tr  class="myRow">
        <td><span><input  type="radio" value="0003" name="rad"></span></td>
        <td><span>0003</span></td>
        <td><span>Supervisor</span></td>
        <td><span>2012-12-28</span></td>
      </tr>
      
      <tr class="myRow">
        <td><span><input  type="radio" value="0003" name="rad"></span></td>
        <td><span>0003</span></td>
        <td><span>SEO</span></td>
        <td><span>2012-12-28</span></td>
      </tr>
    </table>
    
    <script>
    $(document).ready(function() {
      $(".myRow").dblclick(function() {
	$(".myTable input[type='radio']").prop('checked',false);
        $(this).find("td input[type='radio']").prop('checked',true);
      });
    });
    </script>
  </body>
</html>

Basically you just give the table a class, then when a table row receives a double click, you deselect all of the radio buttons in the table, then reselect the one you want.

What about your other function (myOtherFunction). What should that do?

P.S. Please don't quote my whole post back at me in your answer

[jemz]

Hi pullo,

What about your other function (myOtherFunction). What should that do?

That will load other table,if the values of the otherfunction is "0003"..my javascript for this is

function otherfunction(empNUm)
  $.ajax{(
   type: 'post',
   data: {idemp:empNUm};
   url:'to other page.php',
  success:function(data){
     //some code here
 }
});

but i have no problem yet for this function...

[jemz]

Hi pullo, I could not still achieve

I applied everything,but still i could not select the radio button.

[jemz]

It will deselected immediately when i click the table row.

[Pullo]

It will deselected immediately when i click the table row.

Hey jemz,

The code I provided definitely works as a stand alone example, so maybe something else is interfering.

One suggestion would be to attach an event handler to the radio buttons, so that when they change state something else happens (another function fires for example).
Here's how:

<!DOCTYPE HTML>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Radio button example</title>
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
  </head>

  <body>
    <table class="myTable">
      <tr  class="myRow">
        <td><span><input type="radio" value="0002" name="rad" class="row_1"></span></td>
        <td><span>0002</span></td>
        <td><span>Manager</span></td>
        <td><span>2012-12-28</span></td>
      </tr>
      
      <tr  class="myRow">
        <td><span><input type="radio" value="0003" name="rad" class="row_2"></span></td>
        <td><span>0003</span></td>
        <td><span>Supervisor</span></td>
        <td><span>2012-12-28</span></td>
      </tr>
      
      <tr class="myRow">
        <td><span><input type="radio" value="0003" name="rad" class="row_3"></span></td>
        <td><span>0003</span></td>
        <td><span>SEO</span></td>
        <td><span>2012-12-28</span></td>
      </tr>
    </table>
    
    <script>
      $(document).ready(function() {
        $(".myRow").dblclick(function() {
          $(".myTable input[type='radio']").prop('checked',false);
          r = $(this).find("td input[type='radio']");
          r.prop('checked',true);
          r.change();
        });
        
        $(".myTable input[type='radio']").on("change", function(){
          // Your code goes here
          alert("Hello from " + $(this).attr("class"));
        });
      });
    </script>
  </body>
</html>

[jemz]

Hi pullo, yes maybe your correct that something else is interfering..i have one class that is used by every form that has table.can i ask something is it okay to have mulitple class in tr?

because for example i have this class "myfirstclass" that is used by all my forms that has table,and i want to add a class which is the one that you give so that it will never interfere with others?is this possible?

[Pullo]

I'm not sure if I understand your question properly, but an element can have as many classes as you like (separated by a space).