需要在PHP中通过下拉菜单选择动态更改日期变量

Question

I have a php file (index.php) which has a titlebar, the titlebar holds date as (MM YYYY). The dates are pulled from another php file titled latest_update.php. The dates are listed in the latest_update file using the following syntax

$latest_run="April 2017";
$latest_run2="May 2017";

The $latest_run date is stripped from the file and passed to a variable using the following.

include_once "scripts/latest_update.php";
$mainTitle = "Content Title";
$secondaryTitle = $latest_run;
$thirdTitle = $latest_run2;

The title and date are held in a div using span

   <div class="titleBar">
   <span class="mainTitle"><?php echo $mainTitle ?></span></br>            
   <span Class="secondaryTitle"><?php echo $secondaryTitle ?></span>
   </div>

I have a selection menu and when I change the selection menu I want the option of the secondaryTitle to change. So if I select Run2 as the option I want the title to change to reflect May 2017 which corresponds to $thirdTitle. If I select Run1 I want it to change to the Secondarytitle referring to April 2017. The select menu is held within a form.

 <form id="myForm">
 <select style="visibility:visible;position:relative;left:0px;top:1px;font-size:12px" name="selmenu" id="selmenu">
 <option value="Run1">Run1</option>
 <option value="Run2">Run2</option>
 <option value="Run3">Run3</option>
 </select>
 </form>

I am new to php and have not been able to find a solution to complete this action. Any help would be appreciated.

Answer 1

Try something to this effect: (requires JQuery and Ajax)

JS -gets data from your form selection, sends it to your php file, then appends the response to the title 


    $(document).ready(function()
    var runChoice = $("#selectRun").val();
    $.ajax({
              url: 'latest_update.php',
              type: 'POST',
              data: {run:runChoice},
              success: function(response){
                  $(".secondaryTitle").append(response);
                }
    )};
)};

PHP Side - gets data from ajax

$choice = $_POST['runChoice'];
if($choice == "Run1"){
    echo $latest_run;
}else if($choice == "Run2"){
    echo $latest_run2;
}else{
    echo $latest_run3;
}

This could be completed entirely without a PHP file though if you don't need database related things, you could store the values for run dates into an array, then just change the title based on the selected option without using ajax and just using appends.

Answer 2

To change the content of the "secondaryTitle" you have to use javascript below:

function setTitle(select) {
        var value = select.options[select.selectedIndex].value;

        if (value == "Run2") {
            var secondTitle = document.getElementsByClassName('secondaryTitle')[0].innerHTML;
            document.getElementsByClassName('mainTitle')[0].innerHTML = secondTitle;
        }
    }

and change the select tag to:

<select style="visibility:visible;position:relative;left:0px;top:1px;font-size:12px" name="selmenu" id="selmenu" onchange="setTitle(this);">
    <option value="Run1">Run1</option>
    <option value="Run2">Run2</option>
    <option value="Run3">Run3</option>
</select>