Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New Coder
    Join Date
    Apr 2012
    Posts
    51
    Thanks
    19
    Thanked 0 Times in 0 Posts

    Exclamation Dynamically Created Radio Buttons & Naming

    I have an array which is called into a dynamically created Radio Group, underneath that I have a fieldset that contains a set of dynamically created Check Boxes for times.

    When a person selects a day from the radio group, I want the Legend for the Fieldset to change to that days name eg. Monday.
    Can someone Please Help me with
    a) Changing the Legend Dynamically or switching between weekday time Fieldsets depending on day Radio selection.

    b)updating the database on switching between the fieldsets with the day or clicking on the Update button/next button.

    It seems a big ask from where I'm sitting, but any help is really appreciated.

    Thanks in advance!!!

    Code:
    function create_time_range($start, $end, $by='30 mins') {
    
        $start_time = strtotime($start);
        $end_time   = strtotime($end);
    
        $times = array();
        for ( ;$start_time < $end_time; ) {
            $times[] = $start_time;
            $start_time = strtotime('+'.$by, $start_time);
        }
        $times[] = $start_time;
        return $times;
    }
    
    // create array of time ranges
    $times = create_time_range('0:00', '23:00', '1 hour');
    
    
    // $times = create_time_range('9:30am', '5:30pm', '30 mins');
    
    // format the unix timestamps
    foreach ($times as $key => $time) {
        $times[$key] = date('H:i', $time);
    }
    
    
    $days = array(
        'Sunday',
        'Monday',
        'Tuesday',
        'Wednesday',
        'Thursday',
        'Friday',
        'Saturday',
    );
    
    
    
    
     for ($i=0; $i<sizeof($days); $i++){
    
            echo("<input type=\"radio\" name=\"dayOption\" value=\"" . $i . "\" id=\"option" . $i . "\">
    		<label for=\"option" . $i . "\">" . $days[$i] . "</label>");
      	}
       echo("<fieldset><legend>\"". print $dayOption ."\"</legend>");
    echo ("<div class=\"content\">");	
    
        for ($i=0; $i<sizeof($times); $i++){
    
            echo("<input type=\"checkbox\" name=\"timeOption\" value=\"" . $i . "\" id=\"option" . $i . "\">
    		<label for=\"option" . $i . "\">" . $times[$i] . "</label>");
    
      	}
    	echo ("<div>");
    	//<input type=\"submit\" value=\"Save\">
      echo("</fieldset>");
    
    echo("<input type=\"submit\" value=\"Update\"></form>"); 
    ?>
    Last edited by lumper; 04-14-2012 at 12:49 PM. Reason: Resolved by Sunfighter !

  • #2
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,105
    Thanks
    23
    Thanked 594 Times in 593 Posts
    php is a server side language so it can not effect a html page without re-loading the page. To do what you want you need to use javascript. Here is code that contains your php plus the js needed to alter the legend title of the fieldset.
    I have also used some css to hide the fieldset until a day is picked and had js display it at that time with the day chosen.
    Once visible you can change the day

    Code:
    <?php
    function create_time_range($start, $end, $by='30 mins')
    {
        $start_time = strtotime($start);
        $end_time   = strtotime($end);
    
        $times = array();
        for ( ;$start_time < $end_time; ) {
            $times[] = $start_time;
            $start_time = strtotime('+'.$by, $start_time);
        }
        $times[] = $start_time;
        return $times;
    }
    // create array of time ranges
    $times = create_time_range('0:00', '23:00', '1 hour');
    // $times = create_time_range('9:30am', '5:30pm', '30 mins');
    // format the unix timestamps
    foreach ($times as $key => $time) {
        $times[$key] = date('H:i', $time);
    }
    
    $days = array(
    	'Sunday',
    	'Monday',
    	'Tuesday',
    	'Wednesday',
    	'Thursday',
    	'Friday',
    	'Saturday',
    );
    
    for ($i=0; $i<sizeof($days); $i++)
    {
    	echo("<input type=\"radio\" name=\"dayOption\" value=\"" . $i . "\" id=\"opt" . $i . " \" onclick=\"disshow('$i');\">$days[$i]");
    }
    
    echo "<div id=\"myfield\">";
    echo("<fieldset><legend id=\"legend\">day</legend>");
    echo ("<div class=\"content\">");
    
    for ($i=0; $i<sizeof($times); $i++)
    {
    	echo("<input type=\"checkbox\" name=\"timeOption\" value=\"" . $i . "\" id=\"option" . $i . "\">
    	<label for=\"option" . $i . "\">" . $times[$i] . "</label>");
    }
    echo ("<div>");
    //<input type=\"submit\" value=\"Save\">
    echo ("</fieldset>"); echo ("<input type=\"submit\" value=\"Update\"></form>");
    echo "</div>";
    ?>
    
    
    <style type="text/css">
    #myfield{
    	display: none;
    }
    </style>
    
    
    <script type="text/javascript">
    function disshow(num)
    {
    	var dayname = new Array('Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday');
    	document.getElementById('legend').innerHTML = dayname[num];
    	document.getElementById('myfield').style.display = 'block';
    
    }
    </script>

  • Users who have thanked sunfighter for this post:

    lumper (04-13-2012)

  • #3
    New Coder
    Join Date
    Apr 2012
    Posts
    51
    Thanks
    19
    Thanked 0 Times in 0 Posts

    Thumbs up

    Sunfighter, you are a true Jedi!!!

    I had tried several attempts at a JS to achieve this, but I am a complete Noob in JS.

    Thank you !!!


  •  

    Posting Permissions

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