SitePoint Sponsor

User Tag List

Page 1 of 2 12 LastLast
Results 1 to 25 of 29
  1. #1
    SitePoint Wizard
    Join Date
    May 2012
    Posts
    1,096
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    Post I need to select this (RADIO)

    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
    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.
    Code:
       function GetSelect(empnum){
    
                     $('input[name=myradio]:radio').each(function(){
                          if($('input[name=myradio]:radio').val()==empnum){
                                $(this).attr('checked',true);
                          }
                      });

    Thank you in advance.

  2. #2
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,895
    Mentioned
    211 Post(s)
    Tagged
    12 Thread(s)
    Hi jemz,

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

    PHP 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:

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

    HTH

  3. #3
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,895
    Mentioned
    211 Post(s)
    Tagged
    12 Thread(s)
    Sorry, typo:

    PHP Code:
    <input type="radio" name="myradio" value="<?php echo $row[''emp_num?>">
    should be:

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

  4. #4
    SitePoint Wizard
    Join Date
    May 2012
    Posts
    1,096
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    [QUOTE=Pullo;5305030]Sorry, typo:

    PHP Code:
    <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");

  5. #5
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,895
    Mentioned
    211 Post(s)
    Tagged
    12 Thread(s)
    Sorry, it was just an example of how to target the radio buttons.
    Just change .css("display", "none") into whatever you want.

  6. #6
    SitePoint Wizard
    Join Date
    May 2012
    Posts
    1,096
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Pullo View Post
    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...

  7. #7
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,895
    Mentioned
    211 Post(s)
    Tagged
    12 Thread(s)
    Try this:

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

  8. #8
    SitePoint Wizard
    Join Date
    May 2012
    Posts
    1,096
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Pullo View Post
    Try this:

    Code JavaScript:
    $(this).find("td > input[type='radio']").prop('checked',true);
    Hi pullo, nothing happened...

  9. #9
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,895
    Mentioned
    211 Post(s)
    Tagged
    12 Thread(s)
    Quote Originally Posted by jemz View Post
    Hi pullo, nothing happened...
    Weird, both versions work fine for me.
    You are double clicking on the table cells, aren't you?

  10. #10
    SitePoint Wizard
    Join Date
    May 2012
    Posts
    1,096
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Pullo View Post
    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 ?

  11. #11
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,895
    Mentioned
    211 Post(s)
    Tagged
    12 Thread(s)
    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.

  12. #12
    SitePoint Wizard
    Join Date
    May 2012
    Posts
    1,096
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Pullo View Post
    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.

    Code:
    
     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..

  13. #13
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,895
    Mentioned
    211 Post(s)
    Tagged
    12 Thread(s)
    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:

    HTML Code:
    <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.

  14. #14
    SitePoint Wizard
    Join Date
    May 2012
    Posts
    1,096
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Pullo View Post
    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:

    HTML Code:
    <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
    HTML Code:
    <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>

  15. #15
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,895
    Mentioned
    211 Post(s)
    Tagged
    12 Thread(s)
    Yeah, that's what I meant.
    Now what exactly is it you would like to have happen?

  16. #16
    SitePoint Wizard
    Join Date
    May 2012
    Posts
    1,096
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Pullo View Post
    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.

  17. #17
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,895
    Mentioned
    211 Post(s)
    Tagged
    12 Thread(s)
    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?

  18. #18
    SitePoint Wizard
    Join Date
    May 2012
    Posts
    1,096
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Pullo View Post
    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

  19. #19
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,895
    Mentioned
    211 Post(s)
    Tagged
    12 Thread(s)
    You can do it like this:

    HTML Code:
    <!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

  20. #20
    SitePoint Wizard
    Join Date
    May 2012
    Posts
    1,096
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    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

    Code:
    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...

  21. #21
    SitePoint Wizard
    Join Date
    May 2012
    Posts
    1,096
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Hi pullo, I could not still achieve

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

  22. #22
    SitePoint Wizard
    Join Date
    May 2012
    Posts
    1,096
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    It will deselected immediately when i click the table row.

  23. #23
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,895
    Mentioned
    211 Post(s)
    Tagged
    12 Thread(s)
    Quote Originally Posted by jemz View Post
    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:

    HTML Code:
    <!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. #24
    SitePoint Wizard
    Join Date
    May 2012
    Posts
    1,096
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    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. #25
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,895
    Mentioned
    211 Post(s)
    Tagged
    12 Thread(s)
    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).


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •