I need to select this (RADIO)

JavaScript
21

Hi pullo, I could not still achieve :confused:

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

22

It will deselected immediately when i click the table row.

23

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>
24

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?

25

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).

26

Okay, so if i have multiple class in tr,it should like this

<tr class=“firstclass secondclass”>
//some code here
</tr>

what about other scenario maybe this also can be the cause why my script did not work…when i navigate other page i just use .load() function and in my url it will never change it always firstpage.php but in the body is now the content of secondpage.php,now does all my javascript in secondpage will work?

I hope you get my point.Thank you in advance.

27

Yes to your first question, that is correct.
Regarding point two, it is difficult to say without seeing an example.

28

Hi pullo.,what do you mean point two?is that talking two class in one tr?,…

it is difficult to say without seeing an example.

Okay i will write back as soon as i can to give an example what i mean in .load() function

29

Sorry if I was unclear before.
Let me explain:

Multiple classes on an element should look like this:

<tr class="firstclass secondclass thirdclass fourthclass">
  //some code here
</tr>

They should be separated with a space and you can have as many as you want (within reason).

My initial answer would be no.
For example:

File 1:

<!DOCTYPE HTML>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>.load() example</title>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
  </head>
  <body>
    <dv id="result"></div>
     
    <script>
      $('#result').load('test.html #container');
    </script>
  </body>
</html>

File 2:

<!DOCTYPE HTML>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Unbenanntes Dokument</title>
  </head>
  
  <body>
  <div id="container">
    <h1>Some content</h1>
    <script>alert("bo");</script>
    <h2>Some more content</h2>
    </div>
  </body>
</html>

Here, file 1 loads file 2 via .load()
On load however, you will not see an alert box pop up, as the script tags will not be inserted into file 1.
Maybe there is a way to accomplish what you are trying to do.
I would just need to see a (minimal) example.